Notes

Gitmoji is an initiative to standardize and explain the use of emojis on GitHub commit messages.

📝 Intro : How to Write a Git Commit Message

In my case, I only read commits when i would like to track commit changes or to dig commit explanation. Otherwise, I directly read the source code.

Here is an example of good git commit message semantic will look like (according to Gist Semantic Commit Messages)

<type> [scope]: "Message"

type must be one of the following mentioned below :

<build>: Build related changes (eg: npm related/ adding external dependencies)
<chore>: A code change that external user won't see (eg: change to .gitignore)
<docs>: Documentation related changes
<feat>: Introduction of a new feature
<fix>: Resolve an issue directly linked to development (bugfixes)
<hotfix>: Resolve an issue directly linked to production (patches)
<test>: Add/Update test cases
<performance>: Add code that improves performance
<refactor>: Update for code for maintainability (clean code)

scope is optional and must be a noun that represents the section of the codebase

Message should be imperative and should describe the commit with a clear message/keywords.

Example of commits :

feat(home, components): Add login button
feat(home, components): Add login modal
fix(home, components): Resolve issue with modal collapses
chore(home): Move icons folder
feat(newsletter): Add Newsletter component
feat(navbar): Add navbar container

🚀 Gitmoji

Using emojis on commit messages provides an easy way of identifying the purpose or intention of a commit with only looking at the emojis used. As there are a lot of different emojis I found the need of creating a guide that can help to use emojis easier.

Now we can replace the <type/> with an emoji :

🎨 Improve structure / format of the code.

⚡️ Improve performance.

🔥 Remove code or files.

🐛 Fix a bug.

✨ Introduce new features.

📝 Add or update documentation.

🚀 Deploy stuff.

💚 Fix CI Build.

👷 Add or update CI build system.

🔧 Add or update configuration files.

🔨 Add or update development scripts.

⚰️ Remove dead code.

Example of commits :

✨ (home, components): Add login button
✨ (home, components): Add login modal
🐛 (home, components): Resolve issue with modal collapses
🚚 (home): Move icons folder
✨ (newsletter): Add Newsletter component
✨ (navbar): Add navbar container
🔥 (navbar): Remove old navbar file
✅ (home): Add login test case
🎨 (home, component): Improve login modal
📦️ (npm): Add react-table
🔨 Update script start-server.js

Additionnal icons

🐳 Add Dockerfile
🐳 Add docker-compose.yml
☸️ (helm): Add postgres helm chart
☸️ (helm): Update frontend.yaml
☸️ (helm): Update pvc.yaml
🐎 (home): Increase speed load for navbar
🍎 (home): Fix issue with MacOS for navbar

Link: EmojiPedia

📦️ Gitmoji-CLI

A gitmoji interactive client for using gitmojis on commit messages.

Installation

With npm :

npm install gitmoji-cli

On MacOS :

brew install gitmoji

Interactive Client

Start the interactive commit client, to auto generate your commit based on your prompts.

gitmoji -c

Hook

Run the init option, add your changes and commit them, after that the prompts will begin and your commit message will be built.

gitmoji -i
git add .
git commit

Search

Search using specific keywords to find the right gitmoji.

gitmoji -s "criteria"

List

Pretty print all the available gitmojis.

gitmoji -l

Config

Run gitmoji -g to setup some gitmoji-cli preferences.

gitmoji config

🔨Extensions (Integration with IDE)

Gitmoji for Vscode

Link : https://marketplace.visualstudio.com/items?itemName=Vtrois.gitmoji-vscode

Gitmoji for Atom

Go to Settings (cmd + , or ctrl + ,) > Install and search for gitmoji-atom.

Alternatively, run the following command:

apm install gitmoji-atom

Link : https://atom.io/packages/gitmoji-atom

💻 Integration with DEV.TO ?

Do you think that we can use it while writing posts for Dev.TO ?

🐳 Docker
☸️ Kubernetes
...

Links