Skip to content

code convention

changicho edited this page Nov 29, 2020 · 1 revision

code convention

air-bnb guide line 을 바탕으로, clean code 철학을 추가

개요

철학

모든 코드는 다른 사람이 봐도 이해할 수 있도록 작성하는 것을 목표로 한다.

base

Airbnb JavaScript 스타일 가이드를 참고한다. 아래 세부 내용에 나와있지 않은 내용은 Airbnb의 가이드 라인을 참고한다.

세부 사항

목록

  • 탭 사이즈는 2로 한다.

    \t을 사용하지 않고 space로 사용한다.

  • 한 줄의 최대 길이는 80자로 제한한다.

    VSCode의 Prettier 설정 등을 통해 통일하도록 한다.

  • 변수, 함수 명에 대한 Naming Convention

    • 변수, 함수, 인스턴스는 Camel Case를 사용한다.

      함수의 경우 동사+명사 형태로 구성한다.

    • Class, Contructor는 Pascal Case를 사용한다.
    • 글자의 길이
      • 글자의 길이는 20자 이내로 제한한다.
      • 4단어 이상이 들어가거나, 부득이하게 20자 이상이 되는 경우 팀원과의 상의를 거친다.
    • flag로 사용되는 변수
      • Boolean의 경우 조동사+flag 종류로 구성된다.

        ex) isNum, hasNum

    • 약칭의 사용
      • 약어는 되도록 사용하지 않는다. ex) Not Allow) index> idx, count > cnt, array > arr, to > 2
      • 부득이하게 약어가 필요하다고 판단되는 경우 팀원과의 상의를 거친다.
  • 최대 tab depth의 제한

    • tab의 최대 depth는 4로 제한한다.
    • 이 이상으로 depth가 깊어지면 함수를 통해 나눌 수 있도록 한다.
    • 그 이상으로 개선할 수 없다고 판단되는 경우, 팀원들과의 코드리뷰를 통해 개선한다.
      function func() {
        //tab1
        if(){
          //tab2
          array.reduce((pre, cur) => {
            //tab3
            if(cur == status){
              //tab4
            }
          }
        }
      }
  • 주석 규칙

    • 한줄은 //로 적고, 그 이상은 /** */로 적는다.
      // 한줄 주석
      /**
       * 여러줄
       * 주석
       */
    • 함수에 대한 주석
      • backend에서 공통적으로 사용하는 함수의 경우, 모듈화를 통해 하나의 파일로 관리한다.
      • 하나의 파일의 시작 부분에 주석으로 상세 내용을 작성한다.
        • 함수의 전체 기능에 대한 설명
        • 함수의 파라미터에 대한 설명 (type: ..., 역할)
  • bracket({}) 규칙

    • if문의 실행문이 한 줄일 때
      • 반복문, 함수의 탈출
        • 한줄로 작성한다.
        • 다만, 부득이하게 두 줄 이상이 되는 경우 주석으로 표기하고 탈출문의 경우 아래에 한칸을 띄우고 로직을 작성한다.
        if (trigger) return;
        
        // logic start
      • (arguments)이후의 bracket
        • 아래의 방법으로 통일한다.
          function func() {
            //...
          }
  • magic number 지양

    • magic number나 문자열을 비교할 경우, constant.js에 상수화 하여 관리한다.
        //constant.js
        const LEFT = 'left';
        //other_logic_file.js
        if(dir === LEFT){
          //...
        }
        // 아래와 같은 경우는 금지한다.
        if(direction === ‘left’)
    • 에러 메시지를 반환할 필요가 있는 경우
      • constant.js에 상수를 대문자로 생성한다.
      • const 어쩌구_ERROR_MESSAGE = ‘어쩌구에 실패했습니다’;
  • else if의 사용

    • 불가피한 경우를 제외하고 else if의 사용을 최대한 줄인다.

      ex) 조건을 만족하면 탈출하는 if로 구현하는 등

  • arrow function의 사용 (익명 함수)

    • 테스트가 필요한 기능이면 arrow function을 사용하지 않는다.
    • 한줄로 끝나는 경우, 테스트가 필요없는 경우 등에는 arrow function의 사용이 가능하다.
  • 함수 파라미터 개수 제한

    • 함수의 인자로 변수를 선언하는 것은 3개까지 가능하다.

        function foo(x, y, z);
      
        // 4개 부터는 객체로 묶어서 보낸다.
        function foo(object);
  • 비동기 함수의 사용

    • Promise함수의 사용은 지양하고 async, await를 사용하도록 한다.
    • 다만 로직을 짜는 데 있어 promise를 불가피하게 사용할 경우, 주석으로 표시하고 commit에 그 이유를 작성한다.
  • 데이터 베이스 명명 규칙

    • DB 이름 (스키마)

      • 데이터베이스 명은 영어 대문자로 구성한다.
      • 길이는 8자 이내로 구성한다.
    • 테이블

      • 테이블은 영어 대문자로 구성, 대분류_의미있는 테이블 명 형태로 작성한다.
      • 테이블 명의 구성은 최대 3단어까지 사용할 수 있다.
      • 각 단어의 최대 길이는 8자 이내로 구성한다.
      • 최대 길이는 26자 이내로 구성한다.
    • 컬럼

      • 컬럼은 snake 표기법을 따르고, 의미있는 컬럼명_접미사 형태로 작성한다.

      • 컬럼의 성질을 나타내는 접미사를 사용한다. (사용하는 데이터의 타입을 나타내는 것이 아님에 유의)

        접미사 list
        • CNT : count 조회수 등의 count에 사용된다.
        • DT : date 날짜인 경우를 나타낸다.
        • FK : foreign key를 나타내는데 사용한다.
        • FL : flag 0, 1로 구성된 상태를 나타낸다.
        • ID : id 계정 등의 아이디를 나타낸다.
        • NM : name 이름, 별명 등 식별 가능하며 중복이 가능한 문자열 나타내는 데 사용한다.
        • NO : number 나이, 휴대폰 번호 등 숫자를 나타낸다.
        • ORD : order 정렬에 사용되는 index를 나타낸다.
        • PK : primary key를 나타내는데 사용한다.
        • ST : status 회원의 등급, 성별 등의 상태를 나타낸다.

참고 자료

reference

air-bnb guide line
w3schools
google

VSCode 확장 모듈

eslint + prettier
eslint + react