FE 코딩 컨벤션

[c0c0pang]

코딩 컨벤션

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

const helloWorld = () => {}

const hello = "hi"

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

const HELLO_WORLD = 'helloWorld'

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

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

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

const isClient = () => {}

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

const handleHiClick = () => {}

리액트의 커스텀훅은 use 접두사를 붙인다.

const useCustomHook = () => {}

PR 규칙

1. 기능 단위로  develop 브랜치에 PR을 요청.
2. 각 기능의 진해사항 및 특이사항을 기재.
3. 문제가 있어 보이거나 의문점이 들면 PR에 코멘트를 통해 리뷰
    1. 문제가 없다면 이모지 or ‘문제없음’ 코멘트를 작성하여 병합 진행
4. 승인이 떨어지면 develop 브랜치로 이동 후 read 님이 main 브랜치로 이동


디렉토리 구조(규칙)

1. 현재 main 디렉토리에서 컴포넌트를 관리.
2. 기능 컴포넌트는 _componets 에서 관리하며 해당 컴포넌트는 별개의 디렉토리를 생성하여 관리.
3. 네비게이션이 필요한 page와 아닌 페이지로 나뉜다.
    1. 네비게이션이 필요한 page는 (cratf) 디렉트로에서 관리.
4. 더미 데이터가 필요한 경우 _data 디렉토리에서 생성하여 관리함.
5. 추후에 다른 페이지를 생성시 main 또는 (cratf) 에서 상황에 맞게 생성.

패키지 관리

1. 최초 패키지 설치자는 이슈를 통해 어떤 버전을 설치하였는지 공지.

[Octoping925]

1. 띄어쓰기는 몇 칸으로 진행할까요?
2. 문자열에 따옴표는 큰 따옴표 / 작은 따옴표 중 뭐로 진행할까요?

[c0c0pang]

1. 들여쓰기는 4칸으로 진행하시면 됩니다.(tap)
2. 띄어쓰기는 한칸씩 띄어 쓰시면 됩니다.

   
   const function = () => {
   ...
   }

const [data, SetData] = useState(null);

3. 작은 따옴표로 진행하시면 됩니다.