- UI/UX 구조 설계 및 개발 환경 세팅 완료
- 컴포넌트 구조 및 상태 관리 전략 수립
- 공통 UI 및 API 연동 기반 구축
| 항목 | 내용 |
|---|---|
| 요구사항 분석 | PM 협의를 통해 핵심 기능 및 MVP 범위 정의 |
| 사용자 흐름 | 주요 User Flow 및 서비스 구조 설계 |
| 화면 설계 | Figma 기반 와이어프레임 및 화면 구조 정의 |
| 컴포넌트 설계 | 재사용 가능한 UI 단위로 분리 (Atomic / Container 패턴) |
💡 초기 설계는 핵심 흐름 중심으로 ui 구현 및 개발 진행하고, 이후 점진적으로 확장
| 항목 | 내용 |
|---|---|
| Git 전략 | main - dev - feature 브랜치 전략 수립 |
| 협업 방식 | PR 기반 코드 리뷰 프로세스 적용 |
| 코드 컨벤션 | ESLint, Prettier 설정 및 스타일 통일 |
| 폴더 구조 | feature 또는 domain 기반 구조 설계 |
| 개발 환경 | React + TypeScript + Vite 세팅(각 팀별로 기술 스택을 다르게 결정해도 괜찮습니다) |
| 항목 | 내용 |
|---|---|
| 공통 UI | Button, Input, Layout 등 공통 컴포넌트 개발 |
| 상태 관리 | Context / Zustand 등 상태 관리 구조 설계 |
| API 구조 | axios 또는 TanStack Query 기반 설계 |
| 초기 개발 | Mock 데이터 기반 UI 구현 |
- 주요 화면 및 사용자 기능 구현 완료
- API 연동 및 상태 관리 적용
- 프론트엔드 배포 및 성능 최적화
| 항목 | 내용 |
|---|---|
| 페이지 구현 | 홈, 리스트, 상세 등 핵심 화면 개발 |
| API 연동 | 백엔드 API 연결 및 데이터 처리 |
| 상태 관리 | 전역 상태 및 서버 상태 관리 적용 |
| 인터랙션 | 입력, 필터, 좋아요 등 사용자 기능 구현 |
| 항목 | 내용 |
|---|---|
| UI 개선 | 반응형 디자인 및 UX 개선 |
| 성능 최적화 | 코드 스플리팅, lazy loading 적용 |
| 배포 | Vercel / Netlify 배포 |
| 환경 설정 | 환경 변수 및 API endpoint 관리 |
- 프론트엔드 - 백엔드 통합 테스트 완료
- UI/UX 개선 및 서비스 안정화
- 최종 배포 및 발표 준비