[개발 규칙] 협업 규칙

협업을 위해 JavaScript 코딩 컨벤션을 명확히 정의하고, 이를 팀 내에서 일관되게 사용하기 위해 다양한 도구와 방법을 활용할 수 있습니다. 아래는 협업을 위한 구체적인 방안입니다.

1. 코드 스타일 가이드 설정

팀 내에서 사용할 코드 스타일 가이드를 선택하거나 정의합니다. Airbnb, Google, Standard 등 유명한 스타일 가이드를 참고할 수 있습니다. 스타일 가이드 문서를 작성하고 공유합니다.

예시 스타일 가이드 문서 (Airbnb 스타일 가이드 기반)

## JavaScript 스타일 가이드

### 1. 들여쓰기
- 2칸 스페이스를 사용합니다.

### 2. 세미콜론
- 명령문 끝에 세미콜론을 사용합니다.

### 3. 변수 선언
- 재할당이 필요 없는 경우 `const`를 사용합니다.
- 재할당이 필요한 경우 `let`을 사용합니다.
- `var`는 사용하지 않습니다.

### 4. 함수 선언
- 함수 표현식을 사용하고, 화살표 함수를 선호합니다.
- 함수 선언은 아래와 같이 합니다:
  ```javascript
  const myFunction = (param1, param2) => {
    // 함수 내용
  };

5. 주석

• 단일 행 주석은 //를 사용합니다.
• 여러 행 주석은 /* ... */를 사용합니다.
• JSDoc을 사용하여 함수와 클래스를 문서화합니다.

6. 네이밍 컨벤션

• 변수명과 함수명은 카멜 케이스(camelCase)를 사용합니다.
• 클래스명은 파스칼 케이스(PascalCase)를 사용합니다.
• 상수명은 대문자 스네이크 케이스(SCREAMING_SNAKE_CASE)를 사용합니다.

7. 비교 연산자

• 엄격한 비교 연산자(===와 !==)를 사용합니다.

8. 객체 및 배열

• 비구조화 할당을 사용합니다.
• 스프레드 연산자를 사용합니다.

2. 린터(Linter)와 포매터(Formatter) 설정

코드 스타일을 자동으로 검사하고 포맷팅하는 도구를 설정합니다.

ESLint 설정

ESLint는 코드 스타일을 강제하기 위한 린터입니다. 프로젝트 루트에 .eslintrc.js 파일을 생성하고 다음과 같이 설정합니다:

module.exports = {
  extends: 'airbnb-base',
  rules: {
    // 팀의 특성에 맞는 규칙을 추가하거나 수정할 수 있습니다.
    'no-console': 'off',  // 콘솔 로그를 허용합니다.
    'indent': ['error', 2],  // 들여쓰기는 2칸 스페이스를 사용합니다.
  },
};

Prettier 설정

Prettier는 코드 포매터로, 일관된 코드 스타일을 유지할 수 있게 도와줍니다. 프로젝트 루트에 .prettierrc 파일을 생성하고 다음과 같이 설정합니다:

{
  "singleQuote": true,
  "trailingComma": "es5",
  "tabWidth": 2,
  "semi": true
}

VSCode 통합

팀원들이 VSCode를 사용한다면, ESLint와 Prettier를 자동으로 실행하도록 설정합니다. VSCode 설정 파일(.vscode/settings.json)에 다음 내용을 추가합니다:

{
  "editor.formatOnSave": true,
  "eslint.autoFixOnSave": true,
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    "typescript",
    "typescriptreact"
  ]
}

3. 코드 리뷰 프로세스

코드 리뷰 프로세스를 도입하여 코드 품질을 높이고 일관성을 유지합니다.

• Pull Request (PR): 모든 변경 사항은 PR을 통해 제출합니다.
• 리뷰어 지정: 팀원이 번갈아 가며 리뷰를 담당합니다.
• 리뷰 가이드라인: 리뷰 시 확인해야 할 체크리스트를 작성합니다.

코드 리뷰 체크리스트 예시

- [ ] 코드 스타일 가이드를 준수했는가?
- [ ] 함수와 변수의 네이밍이 적절한가?
- [ ] 불필요한 콘솔 로그가 없는가?
- [ ] 주석이 충분히 작성되었는가?
- [ ] 예외 처리가 잘 되어 있는가?
- [ ] 테스트 코드가 추가되었는가?

4. 지속적 통합(CI) 설정

CI 도구를 사용하여 코드 스타일 검사를 자동화합니다. GitHub Actions, Travis CI, CircleCI 등 다양한 도구를 사용할 수 있습니다.

GitHub Actions 예시

.github/workflows/ci.yml 파일을 생성하고 다음과 같이 설정합니다:

name: CI

on: [push, pull_request]

jobs:
  lint-and-test:
    runs-on: ubuntu-latest

    steps:
    - uses: actions/checkout@v2
    - name: Use Node.js
      uses: actions/setup-node@v1
      with:
        node-version: '14'

    - run: npm install

    - name: Run ESLint
      run: npm run lint

    - name: Run tests
      run: npm test

5. 팀 내 교육 및 문서화

새로운 팀원이 들어오거나 협업이 시작될 때, 스타일 가이드와 도구 사용법을 문서화하여 공유합니다. 주기적인 교육 세션을 통해 팀원들이 일관된 코딩 스타일을 유지하도록 합니다.

6. 협업 도구 사용

• Git: 버전 관리를 위해 Git을 사용합니다. Git flow, GitHub flow 등 적절한 워크플로우를 선택합니다.
• 프로젝트 관리 도구: Jira, Trello, Asana 등의 도구를 사용하여 작업을 관리합니다.
• 커뮤니케이션 도구: Slack, Microsoft Teams 등의 도구를 사용하여 원활한 소통을 유지합니다.

이와 같은 방안들을 통해 팀 내에서 일관된 코드 스타일을 유지하고, 협업을 원활하게 진행할 수 있습니다.