코드잇 FE15기 Part2-4팀 기초 프로젝트 [오픈마인드]

R & R

팀원	역할
이태식	질문/수정하기 페이지
김지현	질문 리스트 페이지
문주영	피드카드
유원규	메인 페이지, 공통 컴포넌트, 발표

기술 스택

• Frontend
  • React (with Vite)
  • React Router
  • Tailwind CSS
  • Axios
• 패키지 관리
  • npm
• 배포: Vercel

폴더/파일명 컨벤션

항목	규칙	예시
폴더명	케밥케이스	main-page
컴포넌트 파일명	파스칼케이스	MainPage.jsx
나머지 파일명(hooks, api 등)	카멜케이스	getQuestions.js
이미지 파일명	케밥케이스	logo-icon.svg
유틸/함수명	카멜케이스	getLocalStorage.js

함수 표현식

화살표 함수 사용

깃 브랜치

• main: 배포용, 최종 결과물이 올라가는 안정된 브랜치
• dev: 개발 통합 브랜치 (모든 기능 브랜치는 여기로 PR)
• feat/*: 기능 개발 브랜치 (이슈 기반으로 생성)
• fix/*: 버그 수정 브랜치 (필요 시 생성)

→ dev → 검토 & 테스트 완료 → main으로 머지

브랜치명 컨벤션

기능: feat/이슈번호-설명 버그: fix/이슈번호-설명

커밋 이모지

이모지	설명
✨	새로운 기능
🎨	디자인 수정
🐛	버그 수정
♻️	리팩토링
🔥	코드/파일 삭제
📄	문서 수정
🍱	이미지 추가/수정
✏️	단순 수정
🚧	작업 중
🔧	설정 파일 수정
🚚	파일 이동
➕	디펜던시 추가

코드 작성 순서

1. 외부 라이브러리 import
2. 내부 컴포넌트/모듈 import
3. 컴포넌트
4. 커스텀 훅 사용
5. 이벤트 핸들러 함수 정의
6. 보조 함수
7. return (JSX)

폴더 구조

4U/
├── .github/
├── public/
├── src/
│   ├── api/
│   ├── assets/
│   │   ├── images/
│   │   └── icons/
│   ├── components/
│   ├── hooks/
│   ├── pages/
│   ├── utils/
│   ├── App.css
│   ├── App.jsx
│   └── main.jsx
│ - .env
├── .gitignore
├── .prettierrc
├── eslint.config.js
├── index.html
├── package.json
├── package-lock.json
├── vite.config.js
└── README.md