프로젝트 컨벤션

1️⃣ Branch

기능 단위로 Branch를 구성합니다.

• Branch 이름에는 prefix로 feature/*, 를 붙입니다.
• 이슈와 관련된 주제를 작업한 경우에는 feature/{issue-number} 형식으로 네이밍합니다.

2️⃣ Commit

Commit 메시지는 작업 내용을 이해할 수 있도록 작성합니다.

• feat : 새로운 기능 추가
• fix : 버그 수정
• env : 개발 환경 관련 설정
• style : css 추가 및 수정
• refactor : 코드 개선
• docs : 내부 문서 추가/수정
• test : 테스트 추가/수정
• chore : 의존성 패키지 추가/수정
• remove : 파일 삭제

3️⃣ 코딩 컨벤션

코딩 컨벤션 함수명 | 변수명

1. 모든 변수,함수명은 소문자 카멜케이스를 통해 정의한다.

const helloWorld = () => {};

const hello = "hi";

2. 타입이 boolean인 변수의 이름은 is , has , can으로 시작한다.

const isLoading = false

3. 상수는 대문자 스네이크 케이스를 사용한다.

const HELLO_WORLD = 'helloWorld'

4. 반환값이 boolean인 판별함수의 이름은 is, has, can으로 시작한다.

const isClient = () => {}

5. 이벤트핸들러는 handle 접두사 , (이벤트 유형) 접미사를 사용한다

const handleHiClick = () => {}

6. 배열 변수의 경우 변수명의 끝에 List를 붙인다.

const helloList = ['hello' , 'world']

타입스크립트 타입 네이밍 컨벤션

1. type과 interface는 자유롭게 사용하되 type을 우선하여 사용한다.

type Hello = {hi:string} & {hello:string}

2. 컴포넌트의 Props에 대한 타입을 정의하는 경우 항상 접미사로 Props를 붙인다

type HelloProps = {}

3. 일반적인 경우 type 접미사를 사용한다.

bad
type User = {}

good
type UserType = {}

User와 같은 이름을 사용하게되면 실제 구현체와 이름이 같아서 import 할때 이름을 바꿔줘야하는 등의 불편이 생기는 경험이 있었습니다. 이런 경우를 방지하기 위해 Type의 경우 구분할 수 있도록 type 접미사를 사용합니다.

4. 타입은 파스칼 케이스로 작성한다.

bad
type helloWorldType = {}

good
type HelloWorldType = {}

5. 유틸리티 타입의 경우 Type 접미사를 사용하지 않는다.

export type OmitFromPick<T, U> = {
  [K in Exclude<keyof T, keyof U>]: T[K];
};