개발 컨벤션

Commit

• 커밋은 Udacity Git Commit Message Style Guide를 따른다.

PR

• PR 작업 내용을 상세하게 작성한다.
• 작업이 여러개라면 ###을 이용해 문단을 구분한다.
• 관련 이슈가 있다면 하단에 추가한다.
• PR 머지는 1명 이상의 리뷰어의 approve를 받아야 가능하다.
• 부득이한 경우 선머지 후, review wanted 레이블을 추가하여 이후에 리뷰받을 수 있도록 한다.
• 리뷰가 길어지는 경우, slack front-end 채널에 자유롭게 리뷰 요청 메세지 or 회의 요청을 해도 된다.

## 작업내용
### 상세 작업 내용1
- ....
- ....
### 상세 작업 내용2
- ....
- ....
## 관련이슈
#1       // closed #1

컴포넌트

• PascalCase 네이밍을 적용하고, 컴포넌트 이름과 파일명을 동일하게 한다.
• 함수형 컴포넌트로 작성한다.
• 컴포넌트는 함수 선언식으로, 다른 함수들은 함수 표현식으로 작성한다.

const f = () => {....};

function App(){
  f();
  return (...);
}
            
export default App;

hooks (React hook)

• 공통으로 사용되거나 자주 사용되는 훅은 react-use를 우선 검토하여 사용
• 필요한 경우 커스텀 훅을 만들어 사용

이벤트 핸들링

• 리스너 네이밍은 handle + 명사 + 동사로 작성한다.
• Props로 전달하는 리스너는 Props 네이밍을 on + 명사 + 동사로 작성한다.

타입

• 타입은 T, enum은 E prefix를 붙여서 선언한다.
• enum의 프로퍼티는 UPPER_SNAKE_CASE로 작성한다.

type TProps = {
   ....
}
            
enum EStatus {
   AA_AA_A = '.....'
}

• type을 우선적으로 사용하고, interface는 상속을 통한 확장이 필요한 경우에 사용한다.
• 타입은 공통적으로 사용되는 경우 별도의 파일로 분리한다.
  • 프로젝트에 전반적으로 사용되는 타입은 common / @types 폴더로 분리한다.
  • 해당 컴포넌트 depth에서만 사용된다면 굳이 분리하지 않는다.

파일

• 유틸 파일은 utils 폴더 아래에 생성한다.
• 유틸 파일명에 Util postfix는 붙히지 않는다.

- DateUtil.ts  (X)
- date-util.ts (X)
- dateUtil.ts  (X)
- dete.ts.     (O)

모듈

• export할 파일이 하나라면 default로 내보낸다.
• export할 파일이 여러개라면 export const, export type 방식으로 개별적으로 내보낸다