✍ 커밋 컨벤션

"커밋 메세지 쓸 때도 컨벤션이 존재했다고..?😨"

우테코 5기 프리코스 1주차 공통 피드백 부분 중 일부...

아래는 1주차 미션 제출 당시 내 커밋 메시지들이다.
(커밋 컨벤션을 지키지 않은 안좋은 예시)

"에이.. 이 정도면 나름 이해도 되고, 의미있는거 아냐?🤷"

라고 생각했다면,
정신차리고 커밋 컨벤션에 대해 자세히 살펴보면서 반성하도록 하자.

---

👩‍🏫 커밋 컨벤션의 구조

우리가 보통 글을 쓸 때 제목, 본문, 추가내용으로 구성을 한다.

커밋 컨벤션도 위의 구조를 따른다.
파일을 변경하거나 수정한 뒤 commit을 하게 될 때,

git commit -m "커밋메세지"

를 통해서 커밋메세지를 추가 할 수 있게 된다.

이 "커밋메세지" 부분을 컨벤션에 맞게 작성하라는 뜻이다.

커밋 메시지는 크게 type, body, footer 3부분으로 나뉜다.
각 파트는 빈줄을 두어 구분한다.
주의할 점은 커밋 메시지를 작성할 때 어떤 라인도 100자를 넘을 수 없다.

커밋 컨벤션을 지킬시에
github 및 다양한 git에서 메시지를 더 쉽게 읽을 수 있다는 이점이 있다.

---

📌 type 제목부분

//예시

feat(directive): ng:disabled, ng:checked
docs(guide): updated fixed docs from Google Docs
style($location): add couple of missing semi colons
fix($compile): couple of unit tests for IE9

제목 줄에 해당하는 부분으로
속성(type)과 범위(scope), 변경 사항에 대한 간결한 설명(subject)이 포함되어 있다.

type(scope): subject의 형태이며, :뒤에만 space가 있음에 유의한다.

속성별 type

• feat: 새로운 기능, 특징 추가
• fix: 수정, 버그 수정
• docs: 문서에 관련된 내용, 문서 수정
• style: 코드 포맷, 세미콜론 누락, 코드 변경이 없을 경우
• refactor: 리팩토링
• test: 테스트 코드 수정, 누락된 테스트를 추가할 때, 리팩토링 테스트 추가
• chore: 빌드 업무 수정, 패키지 매니저 수정

범위를 나타내는 scope

범위는 커밋 변경 위치를 지정하는 모든 것이 될 수 있다.

예를 들어
$location, $browser, $compile, $rootScope, ngHref, ngClick, ngView 등...

상대적으로 다르기 때문에 자신에게 맞는 범위를 작성하면 된다.
scope는 type, subject과 다르게 생략해도 무관하다.

제목을 간단하게 설명하는 subject

subject를 작성할때는 주의해야 할 사항들이 몇 가지 존재한다.

• 제목은 최대 50글자가 넘지 않도록 한다.
• 마침표 및 특수기호는 사용하지 않는다. 끝에 점(.) 없음
• 영어로 작성시 첫 글자를 대문자로 쓰지 않는다.
• 영문으로 표기하는 경우 동사(원형)를 가장 앞에 둔다.
• 제목은 개조식 구문으로 작성한다. (간결하고 요점적인 서술)

---

📌 body 본문부분

위처럼 제목을 간결하게 잘 작성했다면,

본문에서는 최대한 자세히 설명을 작성하면 된다.

//예시

Older IEs serialize html uppercased, but IE9 does not...
Would be better to expect case insensitive, unfortunately jasmine does
not allow to user regexps for throw expectations.

New directives for proper binding these attributes in older browsers (IE).
Added coresponding description, live examples and e2e tests.

다만, body를 작성할 때도 주의해야 할 사항들이 존재한다.

• 본문은 한 줄 당 72자 내로 작성한다.
• 본문 내용은 양에 구애받지 않고 최대한 상세히 작성한다.
• 본문 내용은 무엇을 변경했는지 또는 왜 변경했는지를 설명한다.
  (변화에 대한 동기를 포함하고 이전 행동과 대조되어야 함)
• 현재시제를 사용한다.

---

📌 footer 꼬릿말부분

footer는 추가사항이고 주로 이슈 트래커 ID를 작성한다.

//예시
Fixes: #45 Related to: #34, #23

Closes #392
Breaks foo.bar api, foo.baz should be used instead

유형: #이슈 번호 형식으로 사용한다.

여러 개의 이슈 번호를 적을 때는 쉼표(,)로 구분한다.
이슈 트래커 유형은 다음 중 하나를 사용한다.

• Fixes: 이슈 수정중 (아직 해결되지 않은 경우)
• Resolves: 이슈를 해결했을 때 사용
• Ref: 참고할 이슈가 있을 때 사용
• Related to: 해당 커밋에 관련된 이슈번호 (아직 해결되지 않은 경우)

종료된 버그는 다음과 같이 Close 키워드가 붙은
footer의 별도 줄에 나열되어야 한다.

여러 문제가 있을 경우 마찬가지로 쉼표(,)로 구분한다.
Closes #123, #245, #992

---

📌 gitmoji 활용

Gitmoji란?
Gitmoji = git + emoji

깃모지는 깃에 사용되는 이모지를 의미한다.
커밋 컨벤션과는 별개이지만, 깃모지를 사용하면 메세지를 더 가독성 있게
읽을 수 있다는 장점이 있다.

주로, 제목을 작성하기 전에 type앞에 gitmoji를 붙인다.

//예시
git commit -m ":art: style(scope): subject"

자주 사용되는 용도별 깃모지를 알아보자.

깃모지	코드	용도 설명
🎨	:art:	코드의 구조/형태 개선
⚡️	:zap:	성능 개선
🔥	:fire:	코드/파일 삭제
🐛	:bug:	버그 수정
🚑	:ambulance:	긴급 수정
✨	:sparkles:	새 기능 추가
📝	:memo:	문서 추가/수정
💄	:lipstick:	UI/style 파일 추가/수정
🎉	:tada:	프로젝트 시작
✅	:white_check_mark:	테스트 추가/수정
🔒	:lock:	보안 이슈 수정
🔖	:bookmark:	릴리즈/버전 태그
💚	:green_heart:	CI 빌드 수정
📌	:pushpin:	특정 버전 의존성 고정
👷	:construction_worker:	CI 빌드 시스템 추가/수정
📈	:chart_with_upwards_trend:	분석, 추적 코드 추가/수정
♻️	:recycle:	코드 리팩토링
➕	:heavy_plus_sign:	의존성 추가
➖	:heavy_minus_sign:	의존성 제거
🔧	:wrench:	구성 파일 추가/삭제
🔨	:hammer:	개발 스크립트 추가/수정
🌐	:globe_with_meridians:	국제화/현지화
💩	:poop:	똥싼 코드
⏪	:rewind:	변경 내용 되돌리기
🔀	:twisted_rightwards_arrows:	브랜치 합병
📦	:package:	컴파일된 파일 추가/수정
👽	:alien:	외부 API 변화로 인한 수정
🚚	:truck:	리소스 이동, 이름 변경
📄	:page_facing_up:	라이센스 추가/수정
💡	:bulb:	주석 추가/수정
🍻	:beers:	술 취해서 쓴 코드
🗃	:card_file_box:	데이터베이스 관련 수정
🔊	:loud_sound:	로그 추가/수정
🙈	:see_no_evil:	.gitignore 추가/수정

---

📌 그 외 꿀 팁

git에서 commit 메세지를 작성할 때, 간혹 줄바꿈을 해야하는데
한 줄 쓰고 enter키를 누르면 그대로 반영이 되어 당혹스러울 때가 있다.

이럴땐, "을 하나만 입력한 상태에서 enter키로 줄을 바꾸고
마지막에 다시 "로 닫아주면 된다.

//예시
git commit -m "feat: 제목 간결하게 작성

본문 길게 작성중

"

📌 참고 자료 링크

https://gist.github.com/stephenparish/9941e89d80e2bc58a153#subject-line
https://github.com/carloscuesta/gitmoji
https://treasurebear.tistory.com/70
https://velog.io/@shin6403/Git-git-커밋-컨벤션-설정하기