Naming Rule

1. 컴포넌트

• 컴포넌트는 PascalCase를 이용하여 작성해주세요.
• 컴포넌트의 경우 반드시 확장자를 .tsx로 작성해주세요.
  • ✅ Login.tsx, ItemList.tsx
  • ❌ Login.ts, ItemList.jsx

2. 커스텀 훅

• 커스텀 훅은 접두사로 반드시 use를 붙여주세요.
• 커스텀 훅의 경우 camelCase를 이용하여 작성해주세요.
  • ✅ useGetFeeds.tsx
  • ❌ UseGetFeeds.tsx

3. 이미지

• 이미지는 underscore를 이용하여 모두 소문자로 작성합니다.
  • ✅ login_btn.png, signup_btn.png
  • ❌ LoginBtn.png, loginBtn.png
• 활성화와 비활성화 이미지가 분리되어 있는 경우 다음과 같이 상태를 마지막에 포함해주세요.
  • ✅ login_btn_active.png, login_btn_inactive.png
  • ❌ LoginBtnActive, login_active_btn.png
• 만약, 이미지 명에 숫자가 포함되어야 한다면, 최소 2자리의 숫자로 명명해주세요.
  • ✅ image_01.png, image_02.png
  • ❌ image_1.png, image1.png

4. 디렉토리

• 디렉토리는 kebab-case를 이용하여 모두 소문자로 작성해주세요.
• 폴더는 되도록이면 한 단어 이상을 넘기지 않도록 작성해주세요.
• 만약 한 단어를 넘기게 될 경우 반드시 하이픈(-)을 이용해주세요.
  • ✅ /login, /item/list, /directory-name

5. 변수명

• 변수명은 camelCase를 이용해주세요.
• 배열의 이름은 복수형으로 작성해주세요.
  • ✅ feeds, numbers
  • ❌ feedList, numberList

6. 상수명

• 상수명은 대문자와 snake_case를 이용해주세요.
  • ✅ PIE = 3.14159, SPEED_OF_LIGHT = 299,792,458

7. 타입 및 인터페이스

• 타입의 경우 T를, 인터페이스의 경우 I를 맨 앞에 추가해서 작성해주세요
• 이름은 PascalCase를 이용해주세요.
  • ✅ TFeedType
  • ✅ IFeedInterface

8. 함수명

• 함수명은 camelCase를 이용해주세요.
• 함수명의 길이과 무관하게 가독성이 더욱 향상되는 방향으로 고려해주세요.
  • ✅ generateRandomNumber, isNumber
  • ❌ checkNumber

9. 클래스명

• 클래스명은 PascalCase를 이용해주세요.
  • ✅ LottoShop, Api, Http

10. 그 외 기능을 담당하는 파일

• 그 외 파일들은 kebab-case를 이용하여 모두 소문자로 작성해주세요.
• 컴포넌트를 제외한 유틸, 상수, 타입, API 로직 등의 모든 파일 확장자는 .ts로 작성해주세요
• 컴포넌트를 제외한 모든 파일은 소문자로 작성해주세요.
• 두 개 이상의 단어가 조합되는 경우 하이픈(-)으로 구분해주세요.
• 만약 단어에 세부 분류나 성격이 포함되어 있다면 점(.)으로 구분해주세요.
  • ✅ login.validation.ts, signup.validation.ts,
  • ❌ loginValidation.ts

11. 테스트를 담당하는 파일

• 단위 테스트의 경우 unit을, 통합 테스트의 경우 integration을 사용해서 표시해주세요.
• ✅ OOO.unit.test.tsx
• ✅ OOO.integration.test.tsx