Home

아래는 React 미니 프로젝트를 위한 간단한 컨벤션 가이드입니다. GitHub Wiki에 적합한 형식으로 작성해 보았습니다.

---

React Mini 프로젝트 컨벤션 가이드

1. VSC 익스텐션 가이드

• Prettier: 코드 포맷팅을 자동으로 해주는 익스텐션입니다. 설정에 따라 코드 스타일을 일관되게 유지할 수 있습니다.
• ESLint: JavaScript 및 TypeScript 코드의 품질을 검사하고, 코드 스타일을 강제하는 도구입니다. 팀의 코딩 규칙에 맞게 설정합니다.
• Bracket Pair Colorizer: 괄호의 쌍을 색상으로 구분해 주는 익스텐션입니다. 복잡한 코드에서 괄호를 쉽게 구분할 수 있습니다.
• Path Intellisense: 파일 경로 자동 완성을 지원하는 익스텐션입니다. 파일 import 시 유용합니다.

2. TypeScript 코딩 스타일 가이드

• 타입 정의: 모든 변수 및 함수에 대해 타입을 명시적으로 정의합니다.

  const add = (a: number, b: number): number => {
      return a + b;
  };

• 인터페이스 사용: 객체의 형태를 정의할 때는 interface를 사용합니다.

  interface User {
      id: number;
      name: string;
  }

• 가독성: 함수와 변수의 이름은 명확하고 의미 있게 작성합니다.
• 주석: 복잡한 로직에는 주석을 추가하여 이해를 돕습니다.

3. Git 관리, 커밋 가이드

• 브랜치 전략: 기능 개발 시 feature/{기능명} 형태의 브랜치를 사용합니다. 버그 수정은 bugfix/{버그명} 형태로 합니다.
• 커밋 메시지: 커밋 메시지는 명확하고 간결하게 작성합니다. 형식은 다음과 같습니다:

  [타입] 요약
  

  • 타입: feat: 새로운 기능, fix: 버그 수정, docs: 문서 수정, style: 스타일 수정, refactor: 코드 리팩토링 등.
  • 예시:

    feat: Add user login feature
    fix: Correct typo in README
    

• 풀 리퀘스트: 모든 변경 사항은 풀 리퀘스트를 통해 리뷰 후 병합합니다. 리뷰어는 최소 1명 이상으로 설정합니다.