Home

🪓🔨 컨벤션

Code Convention

• 띄워쓰기 2칸 = 1tab = tabsize
• 따옴표 : 작은따옴표로 통일
• 브랜치 이름
  • 브랜치명은 현재 개발하고있는 component 또는 page 명으로 작성
  • 브랜치명은 Kebab Case 로 작성
• 파일 이름
  • Component 파일명 : PascalCase
  • Non-Component 파일명/속성명/변수명/컴포넌트 내 함수명 : camelCase
• 함수 이름은 동사+명사 의 형태로 표현
  

isNumber()
getNumber()
checkNumber()

• 변수
  • var 사용 금지
  • let, const만 사용
• 설명이 필요한 기능들에 주석 작성하고 기능 구현 완료시 “주석 삭제하기”
  • Better Comment 확장 프로그램 사용

// 기본 주석 - 자유롭게 작성

// ? 의견을 묻는 주석 예시입니다.
→ 의견을 구해야하거나, 피드백을 구하려할때 사용해주세요

// ! 주의해주세요
→ 신경 쓸 부분이나 중요한 이야기가 있을 때 사용해주세요


** 모든 주석은 기능 구현 중일때에만 작성, 전달 => 기능 구현 완료시 주석 삭제

• if문 사용시 else if 는 사용을 자제 => 가능하다면 삼항연산자로 작성
• async, await를 기본적으로 사용
  • 프로미스를 사용할 때는 반드시 주석에 표시 →Better Comment 의 * 기호 사용
• 객체, 배열 : 마지막 요소 뒤에 쉼표 넣기. 단, 한 줄로 작성한 경우에는 제외한다.
• 객체 : 중괄호 안쪽에 공백을 추가하여 작성
• Tailwindcss: module.css 작성 시, 선택자 (:after, :before, :hover 등) 를 사용하여 스타일링 하는 경우, 개행하여 작성한다.

Commit Convention

• Commit Type(Gitmoji 확장프로그램 사용)

• 아래 표에서 알맞은 이모지와 뜻을 확인하고 커밋 메세지를 작성합니다.

  • 커밋 메세지 작성 예시 : 🎉 초기 Settings 완료

• 구현이 아직 완료되지 않은 경우, 설명 뒤에 'Test' 를 붙여 커밋 완료합니다.

  • 커밋 메세지 작성 예시: ✨ 좋아요 기능 구현 Test

종류(type)	설명(Description)
✨ feat	기능 및 코드 추가
🔥 remove	기능 및 코드 제거
🌊 modify	기능 및 코드 수정
🎨 styling	코드 스타일링
➕ add	파일 추가
➖ remove	파일 제거
📦 move	파일 이동
🏗️ structure	프로젝트 구조 변경
🐛 fix	버그 수정
🚑 hotfix	치명적인 버그 수정
♻️ refactor	코드 리팩토링
📝 doc	문서 작성 및 편집
🎉 init	초기 커밋
🚀 deploy	프로젝트 배포

settings.json 에 넣기

``` "gitmoji.onlyUseAdditionalEmojis": true, "gitmoji.additionalEmojis": [ { "emoji": "✨", "code": ":sparkles:", "description": "기능 및 코드 추가" }, { "emoji": "🔥", "code": ":fire:", "description": "기능 및 코드 제거" }, { "emoji": "🌊", "code": ":ocean:", "description": "기능 및 코드 수정" }, { "emoji": "🎨", "code": ":art:", "description": "코드 스타일링" }, { "emoji": "➕", "code": ":heavy_plus_sign:", "description": "파일 추가" }, { "emoji": "➖", "code": ":heavy_minus_sign:", "description": "파일 제거" }, { "emoji": "📦", "code": ":package:", "description": "파일 이동" }, { "emoji": "🏗️", "code": ":building_construction:", "description": "프로젝트 구조 변경" }, { "emoji": "🐛", "code": ":bug:", "description": "버그 수정" }, { "emoji": "🚑", "code": ":ambulance:", "description": "치명적인 버그 수정" }, { "emoji": "♻️", "code": ":recycle:", "description": "코드 리팩토링" }, { "emoji": "📝", "code": ":memo:", "description": "문서 작성 및 편집" }, { "emoji": "🎉", "code": ":tada:", "description": "초기 커밋" }, { "emoji": "🚀", "code": ":rocket:", "description": "프로젝트 배포" } ], ```

• 커밋 메시지를 너무 길게 작성하지 말 것
  • 핵심 내용을 요약하여 1~2 줄로 작성
  • 남겨야 할 메시지가 많을 경우 git issue 사용

예시

Git GuideLine

• develop 브랜치로만 PR 한다.

만약 1명이 main 으로 pr 을 보내고 병합까지 해버린다면,😱
🧊🌊 반팔👕 반바지🩳 입고 아이스🧊 버킷🧺 챌린지 인증하기 🧊🥶

• 제목의 대괄호 안은 add, modify, delete, refactor 로 크게 구분한다.
• 제목에는 컴포넌트명과, PR 되는 내용을 요약하여 작성한다.
• 제목은 명사형으로 작성한다. (예: 토글 기능 추가, 로고 이미지 삭제)
• 내용에는 추가/변경/삭제 되는 내용을 최대한 상세하게 작성한다.
• 필요한 경우, 미구현 내용도 상세하게 작성한다.
• 필요한 경우, 스크린샷을 첨부한다.

[add] InputBox 마크업 추가
input box 컴포넌트에 해당하는 마크업 추가하였습니다. - 미구현 사항: 스타일링, props 전달

예시

2. Git Project Guideline

• 개발 관련 Task 작성 시, 제목은 [이름] 브랜치명 or 컴포넌트명 or 파일명 을 포함하여 형식에 맞춰 작성한다.
• 예: [희소] input-box 컴포넌트 구현
• Task 시작일에 맞는 milestone 을 선택한다.
• 내용에 구현 내용, 스크린샷을 첨부하고 issue 를 닫는다.

참고사항

올릴 때 : git push origin 브랜치명
받을 때 : git pull upstream 브랜치명