From 63037bf2872a19211200b1a3460677600481b707 Mon Sep 17 00:00:00 2001 From: minseok Date: Tue, 10 Dec 2024 11:22:21 +0900 Subject: [PATCH] Update README.md --- README.md | 149 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 149 insertions(+) diff --git a/README.md b/README.md index 974ec9a..026a775 100644 --- a/README.md +++ b/README.md @@ -1 +1,150 @@ +
+ # 취향 기반 데일리 Q&A 커뮤니티 플랫폼 Q-Feed 프론트엔드 + + + +

+🗓️ 프로젝트 기간 : 2024.11.15 ~ 2024.12.13 +

+ +
+ +### 📑 기획서 + +https://www.figma.com/design/pLWrGZKJ9JTaso2BZ8dpiB/%ED%94%84%EB%A1%9C%EA%B7%B8%EB%9E%98%EB%A8%B8%EC%8A%A4FE-%EC%B5%9C%EC%A2%856%ED%8C%80?node-id=0-1&t=vfEl1uAO9W1NzTEL-1 + +### 📎 배포 링크 + +https://q-feed-web.vercel.app + +## 📖 프로젝트 소개 + +Q-FEED는 자신과 취미를 선택해 일일 질문에 답변하고, 같은 취미의 사람들과 답변을 공유하며 소통하는 익명 커뮤니티 플랫폼입니다. + +## 프로젝트 선정 배경 +- 기존 SNS의 과도한 자기노출과 비교의식 유발 -> 진정성 있는 소통의 부재 +- 개인의 취향과 관심사가 점점 세분화되는 시대에, 자신의 생각을 나눌 수 진솔하게 나눌 수 있는 소통의 장 제공 + + + + +## 👫 FE 팀원 + +| 맹주연 | 김민석 | 안종인 | 김재환 | +| ----| ----- | ---- | ---- | +| | | | | +| 팀장 / 로그인 / 메인 | 개발환경 세팅 / 배포 / Q-Space | 채팅 / 알림 / 팔로우,팔로잉 | 오늘의 질문, 프로필 | + +## 시스템 아키텍쳐 +image + + +## ✨ 주요 기능 + +- 취미 기반 ai가 생성한 일일 질문 +- 자신의 답변과 다른 사용자의 답변을 볼 수 있는 메인 피드 +- 질문 외의 다양한 주제로 토론방을 생성할 수 있는 Q-Space +- 채팅 및 알림 기능 +- 마이페이지에서 자신의 답변 기록 확인 기능 +- 프로필 확인 및 팔로우 기능 + +## 🚀 Frontend Stacks + +### 언어 및 프레임 워크 +[![My Skills](https://skillicons.dev/icons?i=ts,react,emotion)](https://skillicons.dev) +- **상태관리 라이브러리:** react-query, zustand +- **웹 소켓 라이브러리:** Socket.io +- **API 통신:** Axios +- **컴포넌트 문서화:** Storybook +- **개발 도구:** + - ESLint + - Prettier + - Vite + - husky +- **협업 툴:** Jira, Figma, Notion, Slack + +- **패키지 매니저** : yarn berry + +**인증** + +JWT, OAuth + +**배포** + +Vercel + +## 📁 프로젝트 구조 + +### FSD(Feature-Sliced Design) + +```read.me +shared 계층 (공통 기능): + +components/ +hooks/ +utils/ +constants/ +types/ +styles/ +assets/ + + +entities 계층 (비즈니스 로직): + +api/ +store/ + +features 계층: + +각각의 pages/ 하위 폴더들이 feature로 구성됨 + + +widgets 계층: + +components/ 하위의 재사용 가능한 공통 UI 혹은 Header나 Footer 등의 레이아웃 + + +pages 계층: + +pages/ 디렉토리 내의 각 페이지 컴포넌트들 +``` + +## 브랜치 전략 (release branch를 제거한 git branch 전략) +![image](https://github.com/user-attachments/assets/64ad337c-8584-4c7c-b450-84566047b9bd) + +## 커밋 컨벤션 + +[tag] : [Jira 티켓명][작업 내용] + +커밋은 소문자로 작성 + +ex) feat: qfeed-12 로그인 버튼 추가 + +## PR 컨벤션 + +[tag] [Jira 티켓명][작업내용] + +ex) [Feat] QFEED-12 로그인 기능 구현 + +PR 단위 : 1 task (작업 시간 0.5일 기준) + +## 시작하기 + +1. 저장소 클론 + +```bash +git clone https://github.com/prgrms-web-devcourse-final-project/WEB1_1_Q-Feed_FE.git +``` + +2. 의존성 설치 + +``` +yarn install +``` + +3. 개발 서버 실행 + +``` +yarn dev +```