"콘서트, 페스티벌 티켓 정보를 한눈에, 손쉽게!"
-
내가 원하는 콘서트 및 페스티벌 정보를 모아서
-
찜한 공연들을 바탕으로 나만의 타임테이블을 만들어
-
중요한 일정들을 한눈에 확인할 수 있는 곳, confeti
v22.12.0
| 역할 | 종류 |
|---|---|
Library |
  |
Programming Language |
 |
Styling |
 |
Data Fetching |
  |
Formatting |
   |
Package Manager |
 |
Version Control |
  |
Workspace Management |
  |
| 기술 스택 | 선정 이유 |
|---|---|
 |
컴포넌트 기반 개발이 가능하여 재사용성과 유지보수성이 향상됨 |
 |
React + TypeScript 환경에 친화적으로 설계되어 초기 설정이 간소화되며, ES 모듈 기반으로 빌드 속도를 향상시킴 |
 |
정적 타입 체크를 지원하여 컴파일 단계에서 오류를 방지하고, 명확한 타입 정의를 통해 협업을 용이하게 함 |
 |
데이터 패칭, 캐싱, 동기화, 리패칭을 자동으로 처리하며, 백그라운드에서 데이터 업데이트 및 중복 요청을 방지함 추후 Next.js와 결합하여 SSR 및 스트리밍 기능 확장을 고려함 |
 |
정적 CSS 생성으로 빌드 타임에 CSS를 생성하여 런타임 성능을 최적화하며, Zero-runtime 스타일링을 통해 번들 크기를 최소화하고 성능을 향상시킴 |
 |
🔗 Storybook 설정 & 크로마틱 자동화 |
 |
🔗 Monorepo 도입기 |
 |
🔗 Turborepo 도입기 |
 |
🔗 Pnpm 도입기 |
# 메인 브랜치(Main branch)
main(master)
`main` 브랜치는 배포 가능한 상태만을 관리해요.
# develop
`develop` 브랜치는 통합 브랜치 역할을 하며, 평소에는 해당 브랜치를 기반으로 개발을 진행해요.
모든 기능이 정상적으로 동작할 수 있는 안정적인 상태를 유지하고,
배포가 가능한 상태라면 `main`브랜치에 `merge` 해요.
# 피쳐 브랜치(Feature branch)
develop 브랜치에서 분기
develop 브랜치로 merge
모든 기능은 구현 이전 이슈를 생성하여 관리해요.
- 브랜치 네이밍: 구현기능 종류/간단한 기능명/#이슈번호
style/main-page/#43
refactor/edit-modal/#75
모든 작업은 develop 에서 분기된 feature 브랜치에서 진행해요.
커밋 메시지는 커밋유형: 개발한 내용에 대한 커밋 메시지
ex) `feat: 타임테이블 기능 추가`
| 커밋유형 | 의미 |
|---|---|
feat |
새로운 기능 추가 |
refactor |
코드 리팩토링 |
fix |
버그 수정 |
chore |
패키지 매니저, 설정 세팅 |
init |
초기 세팅 및 종속성 추가 관련 |
docs |
문서 수정 |
design |
CSS 및 UI 변경 |
style |
코드 포맷팅, 세미콜론 누락 등 코드 변경 없음 |
test |
테스트 코드, 리팩토링 테스트 코드 추가 |
[Feature]: 메인페이지 API 연동
Feature(design-system): 공통 버튼컴포넌트 제작Feature(client): 메인페이지 API 연동- 루트에서 설정한다면 패키지명은 생략 가능
Chore: 폴더구조 세팅
위의 형식 외에는 탬플릿 형식을 따라 작성
📦 apps
└── 📂 client
├── 📂 node_modules
├── 📂 public
│ └── 📜 favicon.svg
├── 📂 src
│ ├── 📂 pages
│ │ ├── 📂 home
│ │ │ ├── 📂 components
│ │ │ ├── 📂 constants
│ │ │ ├── 📂 hooks
│ │ │ ├── 📂 page
│ │ │ │ └── 📜 home.tsx
│ │ │ │ └── 📜 home.css.ts
│ │ │ └── 📂 types
│ │ ├── 📂 my
│ │ │ ├── 📂 components
│ │ │ ├── 📂 hooks
│ │ │ ├── 📂 page
│ │ │ └── 📂 types
│ │ ├── 📂 search
│ │ │ ├── 📂 components
│ │ │ ├── 📂 hooks
│ │ │ ├── 📂 page
│ │ │ └── 📂 types
│ │ └── 📂 time-table
│ │ ├── 📂 components
│ │ ├── 📂 hooks
│ │ ├── 📂 page
│ │ └── 📂 types
│ ├── 📂 shared
│ │ ├── 📂 apis
│ │ │ └── 📜 api.ts
│ │ ├── 📂 assets
│ │ │ └── 📂 images
│ │ ├── 📂 components
│ │ │ │ └── 📂 button
│ │ │ │ │ └── 📜 button.tsx
│ │ │ │ │ └── 📜 Button.stories.ts
│ │ │ │ │ └── 📜 button.tsx
│ │ ├── 📂 constants
│ │ ├── 📂 hooks
│ │ ├── 📂 pages
│ │ ├── 📂 router
│ │ ├── 📂 styles
│ │ └── 📂 utils
│ │ └── 📜 query-client.ts
│ ├── 📜 App.tsx
│ ├── 📜 main.tsx
│ └── 📜 vite-env.d.ts
├── 📜 .eslintrc.cjs
├── 📜 .gitignore
├── 📜 index.html
├── 📜 package.json
├── 📜 tsconfig.json
└── 📜 vite.config.ts
