⚡️ Gitmoji 사용법 정리 (+ 깃모지 툴 소개)

Gitmoji 란? 

gitmoji란 git + emoji를 합쳐서 부르는 말로 emoji를 이용하여 commit message를 작성하는 tool이라고 보면 될 듯하다.

지금까지 그냥 글로만 커밋 메세지를 써왔겠지만, 메세지에 이모지(이모티콘)을 더하면, 나중에 커밋 메세지를 훑어볼때 훨씬 가독성 높게 읽기가 가능해니다.

예를 들어 커밋 메시지에 이모티콘을 사용하면 사용된 이모티콘만 보고 커밋의 목적이나 의도를 쉽게 식별할 수 있게 된다.

 

위의 커밋 로그처럼 단순하게 글귀만 나열하는 것보다 시각적인 강조를 얻을 수 있는걸 느낄 수 있다.

그리고 이모지 아이콘에 익숙해졌다면, 글을 읽지 않아도 전체적으로 어떤 일이 있었는지 한눈에 볼 수 있게 된다.

 

예를들어, ✨ 모양의 이모지는 기능 추가를 의미하는 깃모지인데, 위의 이모지만 읽어도 기능 추가 위주의 작업이라는 것을 바로 알 수 있다.

또한 gitmoji를 사용할때에는 커밋을 세세하게 해주는 편이 좋은데, 프로젝트에 기능 추가에 대한 커밋 로그를 ✨이모지 하나로 끝낼 수도 있지만, 다음과 같이 좀더 세세하게

1. 💄을 사용해서 레이아웃 완성 시 커밋 한 번,
2. API나 다른 기능들을 붙인 후 화면이 완성되면 ✨로 한 번,
3. 테스트 작성 후 ✅까지 테스트 완료 아이콘 작성

까지 한다면 보다 명확하게 커밋 단위로 생각을 할 수 있어서 프로젝트 관리에 좋다.

 

단, 실무에서 gitmoji를 사용할 때 주의해야할 점이 있다.

그건 바로 커밋 주제의 약속 인데, gitmoji를 사용할 때 어느 emoji가 어떤 의미를 나타내는지에 대한 약속을 하고 프로젝트를 진행해야 한다.

예를 들어 두 사람이 같은 모양의 이모지를 두고 다르게 해석하고  커밋메시지를 남기면 혼란이 오기 때문이다.

• A는 🐛: 버그 수정
• B는 🐛: 불필요한 코드 삭제

그래서 gitmoji를 사용할때에는 반드시 팀원들과 해당 emoji가 어떤 의미를 나타내는지에 대해 공유하고 적용해야 한다.

 

하지만 일일히 이모지를 정하고 그러는 것이 번거로우면, 해당 이모지의 용도, 의미를 미리 정해놓은 아래 사이트를 참고해도 좋다.

사이트에 들어가면 아래처럼 이모지 모양과 이름 설명이 같이 표시되는데, 해당 설명을 보고 적절한 이모지를 사용하면 된다. 참고로 이미지를 클릭하면, 이미지가 복사되고 키워드를 클릭하면 키워드가 복사된다.

gitmoji

아이콘	코드	설명	원문
🎨	:art:	코드의 구조/형태 개선	Improve structure / format of the code.
⚡️	:zap:	성능 개선	Improve performance.
🔥	:fire:	코드/파일 삭제	Remove code or files.
🐛	:bug:	버그 수정	Fix a bug.
🚑	:ambulance:	긴급 수정	Critical hotfix.
✨	:sparkles:	새 기능	Introduce new features.
📝	:memo:	문서 추가/수정	Add or update documentation.
💄	:lipstick:	UI/스타일 파일 추가/수정	Add or update the UI and style files.
🎉	:tada:	프로젝트 시작	Begin a project.
✅	:white_check_mark:	테스트 추가/수정	Add or update tests.
🔒	:lock:	보안 이슈 수정	Fix security issues.
🔖	:bookmark:	릴리즈/버전 태그	Release / Version tags.
💚	:green_heart:	CI 빌드 수정	Fix CI Build.
📌	:pushpin:	특정 버전 의존성 고정	Pin dependencies to specific versions.
👷	:construction_worker:	CI 빌드 시스템 추가/수정	Add or update CI build system.
📈	:chart_with_upwards_trend:	분석, 추적 코드 추가/수정	Add or update analytics or track code.
♻️	:recycle:	코드 리팩토링	Refactor code.
➕	:heavy_plus_sign:	의존성 추가	Add a dependency.
➖	:heavy_minus_sign:	의존성 제거	Remove a dependency.
🔧	:wrench:	구성 파일 추가/삭제	Add or update configuration files.
🔨	:hammer:	개발 스크립트 추가/수정	Add or update development scripts.
🌐	:globe_with_meridians:	국제화/현지화	Internationalization and localization.
💩	:poop:	똥싼 코드	Write bad code that needs to be improved.
⏪	:rewind:	변경 내용 되돌리기	Revert changes.
🔀	:twisted_rightwards_arrows:	브랜치 합병	Merge branches.
📦	:package:	컴파일된 파일 추가/수정	Add or update compiled files or packages.
👽	:alien:	외부 API 변화로 인한 수정	Update code due to external API changes.
🚚	:truck:	리소스 이동, 이름 변경	Move or rename resources (e.g.: files paths routes).
📄	:page_facing_up:	라이센스 추가/수정	Add or update license.
💡	:bulb:	주석 추가/수정	Add or update comments in source code.
🍻	:beers:	술 취해서 쓴 코드	Write code drunkenly.
🗃	:card_file_box:	데이버베이스 관련 수정	Perform database related changes.
🔊	:loud_sound:	로그 추가/수정	Add or update logs.
🙈	:see_no_evil:	.gitignore 추가/수정	Add or update a .gitignore file.

---

gitmoji 사용하기

GIT에 깃모지(gitmoji)를 사용하려면 따로 소프트웨어를 설치하듯이 프로그램이 필요하다.

아무 터미널에서 자유롭게 사용할 수 있는 gitmoji-cli 방법과 VSCode 에디터에서 간편하게 사용할 수 있는 깃모지 확장팩을 소개해 본다.

 

gitmoji-cli

터미널에서 소스를 커밋할때 gitmoji-cli를 이용하면 이모지를 함께 커밋내용에 간단하게 포함시킬수 있다.

먼저 gitmoji-cli 를 설치한다.

carloscuesta/gitmoji

> npm i -g gitmoji-cli
# or
> brew install gitmoji

gitmoji-cli는 npm 패키지를 필요하기 때문에, 그이전에 node.js 를 먼저 설치해야 된다.

 

설치 후 gitmoji --help를 터미널에 입력하면 도움말을 확인할 수 있다.

 

gitmoji 로그 사용법

간단하게 gitmoji -c 커맨드로 깃모지 커밋을 작성할 수 있다.

먼저 git add 명령어로 변경 사항을 스테이징 하고, git commit -m 대신에  gitmoji -c 로 커밋메시지를 작성하면 된다.

커맨드를 실행하면 emoji 리스트들이 나와 화살표를 이용해 위아래로 이동하며 선택을 하거나 원하는 keyword를 작성하여 emoji를 고를 수도 있다.

emoji를 선택한 후에는 commit title과 commit message를 작성하고 엔터를 치면 commit을 완료하면 된다.

이후 remote에 push를 하면 github에서 gitmoji로 작성된 commit log를 확인할 수 있다.

---

VSCode - Gitmoji 익스텐션

만일 터미널에서 사용하기 번거로우다면, VSCode 에디터에서 간단한 GUI 환경으로 간편하게 사용할 수 있다.

Gitmoji - Visual Studio Marketplace

 

만일 VSCode 에서 GUI로 GIT을 사용하는 방법을 배우고 싶다면, 다음 포스팅을 참고하길 바란다. (굉장히 편안하다)

[GIT] ⚡️ VSCode 내장 Git 사용방법 💯 정리

---

# 참고자료

https://pilgwon.github.io/post/gitmoji