Code Convention

Code Convention

1. Naming Convention (이름 규칙):
   • 변수, 함수, 컴포넌트: camelCase (e.g., productList, getUserData)
     • [띄어쓰기 x & 첫 단어 첫 글자 소문자 & 첫 단어 이후의 첫 글자 대문자](https://developer.mozilla.org/ko/docs/Glossary/Camel_case)
   • 파일 및 폴더: kebab-case (e.g., test-file.js)
     • [공백은 하이픈으로 대체 & 소문자](https://developer.mozilla.org/en-US/docs/Glossary/Kebab_case)
2. React Component
   • 함수 선언
     • 타입 추론 가능하기 때문
     • function()
   • 외부에서 사용하지 않는 컴포넌트는 export x
3. 함수명 작성:
   • 동사 + 명사 형태(e.g, getResult)
4. Husky(feat.Prettier & ESLint):
   • 코드 스타일을 자동화하기 위해 Prettier와 ESLint 설정 적용
   • [(git hook을 활용한) Husky로 commit, push 전 Prettier, ESLint 검사](https://velog.io/@jiynn_12/%EA%B0%9C%EB%B0%9C%EC%9E%90%EB%A1%9C-%ED%98%91%EC%97%85%ED%95%98%EA%B8%B0-husky)
5. 폴더 및 파일 구조

project-root/
├── public/               # 정적 파일 (이미지, 폰트 등)
├── src/                  # 소스 코드
│   ├── app/              # Next.js app 라우트
│   │   ├── api/          # API 라우트
│   │   │   ├── auth/     # /api/auth/
│   │   │   │   └── route.ts
│   │   │   ├── users/    # /api/users/
│   │   │   │   └── route.ts
│   │   ├── auth/         # 인증 관련 페이지 (로그인, 회원가입)
│   │   ├── layout.tsx    # 모든 페이지의 공통 레이아웃
│   │   ├── page.tsx      # 메인 페이지
│   ├── components/       # 재사용 가능한 컴포넌트(css 파일 포함)
│   ├── hooks/            # 커스텀 훅
│   ├── contexts/         # Context API 관련
│   ├── lib/              # 유틸리티 함수, API 호출 로직
│   ├── styles/           # 전역 스타일 또는 컴포넌트 스타일
│   ├── types/            # TypeScript 타입 정의
│   └── store/            # 전역 상태 관리 (Recoil, Redux 등)
├── .env.local            # 환경 변수
├── next.config.js        # Next.js 설정 파일
└── tsconfig.json         # TypeScript 설정 파일