[ Git ] 좋은 Commit Message 작성하는 법!

카테고리 없음

[ Git ] 좋은 Commit Message 작성하는 법!

얌얌커비 2024. 12. 19. 16:31

커밋 메세지를 작성할 때마다 이전에 정리해놓은 글을 참고하며 파파고를 사용했는데

생각보다 복잡스러운 글의 구조로 인해 불편해서 조금 더 빠르고 쉽게 알아볼 수 있도록 정리했습니다.

좋은 커밋 메세지를 작성해야하는 이유

팀 프로젝트의 경험이 많지 않았다면 좋은 커밋메세지 작성의 중요성에 대해 깨닫기 어려웠을 것이라고 생각됩니다.

(저 또한 그렇게 생각해왔고, 앞으로 함께할 팀원과의 좋은 소통을 위해 작성방법에 대해 공부하게 되었습니다 🧐 )

협업을 하는 과정에서 가장 중요한 부분이 소통입니다.

소통을 원활하게 하려면 한 눈에 알아볼 수있는 내용으로 정확하게 전달해야합니다.

한 눈에 알아볼 수 있는 내용으로 정확하게 전달해야한다면, 커밋 규칙(Clean Commit Message)에 대해 알아야합니다.

✏️ Clean Commit Message 커밋규칙

제목과 본문을 한 줄 띄어서 분리해 작성
제목은 50자 이내 작성 (영문 기준, 소문자로 시작)
제목 작성 후 끝에 . 마침표 특수문자 사용 금지
제목은 가급적이면 명령조로 작성
본문 72자 마다 줄바꿔 작성 (영문 기준, 가급적 72자 이내 작성)
본문은 무엇을, 왜 에 맞춰 작성 (어떻게 보다 무엇과 왜에 대한 부분이 중요함)

✔️ 커밋 컨벤션 규칙에 대해 알아보자

커밋 규칙과 함께 커밋 메시지 컨벤션(Commit Message Convention)이라는 일관된 형식의 커밋 메시지 작성을 위한 규칙이 있습니다.

여러 개발자 사이에서 통용되는 가이드라인이 있지만, 프로젝트에 따라 별도의 규칙을 만들기도 한다고 합니다. (기업마다 차이가 있는 부분)

Angular 커밋 스타일 가이드

첫번째 줄의 ' 타입() : 간단한 내용 (명령문 형태로 작성) ' 부분은 필수로 입력해야 하고

두번째 줄의 ' 상세 내용 ' 과 세번째 줄의 ' 이슈 번호 또는 브레이킹 체인지에 대한 내용 ' 부분은 필요할 때에만 입력하면 됩니다.

타입() : 간단한 내용(명령문 형태로 작성)
==== 한 줄 띄우고 ====
상세 내용
==== 한 줄 띄우고 ====
이슈 번호 또는 브레이킹 체인지에 대한 내용

타입(Type)에 입력하는 용어

타입은 변경사항의 성격을 나타낼 수 있도록 입력해야 합니다.

feat : 새로운 기능 추가
fix : 버그 수정
ci : 관련 수정에 대한 커밋 타입
docs : 문서 수정
style : 코드 스타일 변경
refactor : 테스트 추가 또는 수정
test : 테스트 추가 또는 수정
build : 빌드 관련 파일 수정에 대한 커밋 타입
chore : 빌드/배포 관련 작업 및 패키지 관리 작업 등
perf : 성능 개선
hotfix : 긴급 버그 수정
security : 보안 관련 수정
revert : 커밋 되돌리기
deps : 의존성 관련 작업
config : 설정 파일 관련 작업
merge : 브랜치 병합
init : 프로젝트 초기화
ui : 사용자 인터페이스 관련 작업
cleanup : 코드 정리
prototype : 시제품 또는 실험적 작업
analysis : 분석 및 로깅 작업 (📊)
localization : 다국어/로컬화 관련 작업 (🌍)
logging : 로그 추가/수정 (🪵)

타입 옆 괄호에 입력하는 용어

타입 옆 괄호에는 변경된 기능이나 모듈의 범위를 나타내어야 합니다.

🆕 auth : 새로운 기능 추가
⚙️ config : 설정이나 시스템 관련 기능 추가
🎨 ui or art : UX/UI 개선이나 디자인 추가
🔧 utils : 도구나 유틸리티 추가
📱 app : 모바일 관련 기능 추가
🌐 api : API 관련 작업
🗃 db : 데이터베이스 또는 데이터 추가

✔️ 깃모지 사용 전, 알아야 할 3가지

깃에 사용되는 이모지를 깃모지라고 부르는데 깃모지를 이용하면 커밋 내역을 더욱 직관적으로 확인할 수 있습니다.

하지만, 깃모지를 사용하고자 한다면 알고 있어야하는 부분이 3가지 있습니다.

일관성 유지 : 팀에서 자주 사용하는 이모지 리스트 또는 정해져있는 이모지 리스트 확인
가독성 관리 : 메시지의 가독성을 해치지 않도록 맨 앞 부분에 간결하게 사용
너무 많은 아이콘 사용은 혼란을 줄 수 있어서 상황에 맞게 1~2개까지만 사용

🎓 깃모지와 클린 커밋 규칙, 커밋 컨벤션 규칙을 활용해보자!

커밋 메시지를 작성하는 것이 아직 습관화되지 않았다면 아래 내용을 참고해보면 좋은 습관을 들일 수 있습니다.

이전에 작성한 글은 하나 하나 확인해야해서 불편함을 느끼고 경우에 따라 사용할 수 있도록 정리했습니다.

feat : 새로운 기능 추가

< 추천 깃모지 >
🌟 - 새로운 기능의 추가를 강조할 때
✨ - 새로운 기능이나 개선된 기능 추가
🆕 - 새로운 것을 도입할 때
💡 - 기능 아이디어를 구현할 때
🚀 - 주요 기능 출시나 초기 단계 구현
🛠️ - 새로운 기능을 위한 준비 작업

커밋 메시지 예시

// 사용자 프로필 편집 기능 추가
✨ feat(auth) : add user profile editing feature

fix : 버그 수정

< 추천 깃모지 >
🐛 - 버그 수정
🔧 - 간단한 문제 해결

커밋 메시지 예시

// API 응답 파싱 오류 수정
🐛 fix(api) : resolve issue with API response parsing

ci : CI 관련 수정

< 추천 깃모지 >
⚙️ - CI 설정 관련 작업
👷 - CI 빌드 설정 업데이트

커밋 메시지 예시

// 자동화된 테스트를 위한 GitHub Actions 추가
⚙️ ci(actions) : add GitHub Actions for automated testing


// 스테이징 환경에서 CI 파이프라인 문제 수정
👷 ci(pipeline) : fix CI pipeline for staging environment

docs : 문서 수정 (ex. README 변경)

< 추천 깃모지 >
📝 - 문서 작성 및 수정
📚 - 문서화 작업

커밋 메시지 예시

// 설치 가이드 추가를 위해 README 수정
📝 docs(readme) : update README with installation instructions

style : 코드 스타일 변경 (ex. 공백, 들여쓰기 수정)

< 추천 깃모지 >
🎨 - 코드 포맷팅, 스타일 변경
💄 - UI 또는 CSS 스타일링 작업

커밋 메시지 예시

// 코드 가독성을 위해 포맷 변경
🎨 style(lint) : reformat code for better readability

refactor : 코드 리팩토링 (ex. 기능 변경 없음)

< 추천 깃모지 >
♻️ - 리팩토링 작업
🔄 - 코드 구조 변경

커밋 메시지 예시

// 확장성을 고려한 폴더 구조 재구성
♻️ refactor(folder) : reorganize folder structure for scalability

test : 테스트 추가 또는 수정

< 추천 깃모지 >
✅ - 테스트 추가 및 수정
🧪 - 실험적 테스트

커밋 메시지 예시

// 로그인 기능에 대한 단위 테스트 추가
✅ test(login) : add unit tests for login functionality

build : 빌드 관련 파일 수정

< 추천 깃모지 >
🏗️ - 빌드 구성 변경
📦 - 패키지 관련 작업

커밋 메시지 예시

// 프로덕션 최적화를 위해 Webpack 설정 업데이트
🏗️ build(webpack) : update webpack config for production optimization

chore : 빌드/배포 관련 또는 패키지 관리

< 추천 깃모지 >
🔧 - 간단한 설정 작업
🗑️ - 불필요한 파일 또는 코드 정리

커밋 메시지 예시

// 의존성 최신 버전으로 업데이트
🔧 chore(deps) : update dependencies to the latest version

perf : 성능 개선

< 추천 깃모지 >
🔥 - 성능 최적화 작업
⚡ - 빠른 로딩 또는 실행 개선

커밋 메시지 예시

// 렌더링 프로세스를 최적화하여 로드 속도 개선
⚡ perf(render) : optimize rendering process for faster load times


// 개선된 캐싱 전략으로 서버 부하 감소
🔥 perf(cache) : reduce server load with enhanced caching strategy

hotfix : 긴급 버그 수정

< 추천 깃모지 >
🚑 - 중요한 문제나 버그 긴급 수정

커밋 메시지 예시

// 모바일 장치에서 발생하는 앱 크래시 긴급 수정
🚑 hotfix(ui) : fix app crash on mobile devices

security : 보안 관련 수정

< 추천 깃모지 >
🔒 - 보안 취약점 해결
🛡️ - 보안 강화 작업

커밋 메시지 예시

// 비밀번호 해싱 과정에서 발생한 취약점 수정
🔒 security(auth) : fix vulnerability in password hashing


// 공용 API에 대한 요청 속도 제한 기능 추가
🛡️ security(api) : implement rate limiting for public APIs

revert : 커밋 되돌리기

< 추천 깃모지 >
⏪ - 이전 커밋 복구

커밋 메시지 예시

// 사용자 인증 기능 추가 커밋 되돌림
⏪ revert(auth) : revert "add user authentication feature"

deps : 의존성 관련 작업

< 추천 깃모지 >
📦 - 의존성 추가 또는 수정
🔄 - 라이브러리 업데이트

커밋 메시지 예시

// axios를 1.2.0 버전으로 업그레이드
📦 deps(axios) : upgrade axios to 1.2.0

config : 설정 파일 관련 작업

< 추천 깃모지 >
⚙️ - 설정 파일 업데이트
🛠️ - 환경 구성 변경

커밋 메시지 예시

// 환경별 설정 파일 추가
⚙️ config(env) : add environment-specific configuration files

merge : 브랜치 병합

< 추천 깃모지 >
🔀 - 브랜치 병합 작업
📌 - 주요 병합 이슈 해결

커밋 메시지 예시

// feature/login 브랜치를 develop 브랜치에 병합
🔀 merge(feature) : merge feature/login into develop


// 핫픽스 병합 중 발생한 충돌 해결
📌 merge(hotfix) : resolve conflicts during hotfix merge

init : 프로젝트 초기화

< 추천 깃모지 >
🎉 - 초기 커밋
🛠️ - 프로젝트 초기 설정

커밋 메시지 예시

// 기본 구조로 프로젝트 초기화
🎉 init(project) : initialize project with base structure

ui : 사용자 인터페이스 관련 작업

< 추천 깃모지 >
💄 - UI/UX 스타일 개선
🖌️ - UI 디자인 작업

커밋 메시지 예시

// 탐색성을 향상시키기 위해 헤더 컴포넌트 디자인 변경
💄 ui(header) : redesign header component for better navigation

cleanup : 코드 정리

< 추천 깃모지 >
🧹 - 불필요한 코드 제거
✂️ - 리소스 최적화

커밋 메시지 예시

// 사용되지 않는 임포트와 불필요한 코드 제거
🧹 cleanup(code) : remove unused imports and dead code

prototype : 시제품 또는 실험적 작업

< 추천 깃모지 >
🧪 - 실험적 기능 구현
🚧 - 진행 중인 작업

커밋 메시지 예시

// 새로운 대시보드 기능의 프로토타입 구현
🧪 prototype(dashboard) : create prototype for new dashboard feature