初心者必見！Gitのコミットメッセージのテンプレートの作成方法について

## 概要
Git自体に慣れていなかったり会社のコミットメッセージの書き方を完全に理解できていないうちはカンペとして使えるテンプレートをあらかじめ作成、設定しておくことをお勧めします
なので今回はGitのコミットメッセージのテンプレートの作成および設定方法について1から解説します

## 前提
- Macを使用

## コミットメッセージ
会社によって書き方は違うと思いますが一般的には
`:emoji: #Issue番号 変更内容`
のような書き方をされている会社が多いかと思います。
テンプレート作成時は会社の運用に合わせて作っていただければと思います。

## テンプレートメッセージ
### 設定方法
- テンプレートの作成

ルート直下にテンプレートファイルを作成します
今回は`.commit_template`というファイル名で作成します
```terminal
cd ~
touch .commit_template
```

- 作成したファイルをGitのコミットメッセージのテンプレートに設定

以下を実行して先ほど作成した`.commit_template`をテンプレートメッセージとして設定
グローバルにすることで全てのGitリポジトリのコミットメッセージのテンプレートとして使用できます
```
git config --global commit.template ~/.commit_template
```

### テンプレート例
.commit_templateを開き、テンプレートメッセージを記載します
以下がテンプレートメッセージのサンプルです
会社で使用する絵文字やメッセージの構成に合わせて自由にアレンジしてみてください
テンプレートに記載されている以外の絵文字を使いたい場合は
[Emoji Cheat Sheet](https://www.webfx.com/tools/emoji-cheat-sheet/)を参照してください
テンプレートメッセージでは`#`の箇所はコメントアウトされるので実際にコミットメッセージとしてGitに反映されるのは
`# ==== Commit Messages ====`と
`# ==== Commit Messages(Template) ====`
の間の空白行になります

```terminal:.commit_template
# ==== Commit Messages ====

# ==== Commit Messages(Template) ====
# :emoji: #Issue番号 変更内容
# 例) :+1: #438 コメント追加
#       👍 #438 コメント追加
# ==== Prefix ====
# :fix: バグ修正
# :hotfix: クリティカルなバグ修正
# :add: 新規機能・新規ファイル追加
# :feat: feature
# :update: バグではない機能修正
# :change: 仕様変更による機能修正
# :docs: ドキュメントのみ修正
# :disable: 無効化
# :remove(delete): ファイル削除、コードの一部を取り除く
# :rename: ファイル名の変更
# :upgrade: バージョンアップ
# :revert: 修正取り消し
# :style: 空白、セミコロン、行、コーディングフォーマットなどの修正
# :refactor(clean,improve): リファクタリング
# :test: テスト追加や間違っていたテストの修正
# :chore: ビルドツールやライブラリで自動生成されたものをコミットするとき

# ==== Emojis ====
# 🐛  :bug: バグ修正
# 👍  :+1: 機能改善
# ✨  :sparkles: 部分的な機能追加
# 🎨  :art: デザイン変更のみ
# 💢  :anger: コンフリクト
# 🚧  :construction: WIP
# 📝  :memo: 文言修正
# ♻️  :recycle: リファクタリング
# 🔥  :fire: 不要な機能・使われなくなった機能の削除
# 💚  :green_heart: テストやCIの修正・改善
# 👕  :shirt: Lintエラーの修正やコードスタイルの修正
# 🚀  :rocket: パフォーマンス改善
# 🆙  :up: 依存パッケージなどのアップデート
# 👮  :cop: セキュリティ関連の改善
# ⚙   :gear: config変更
# 📚  :books: ドキュメント
```

## 実際にコミットしてみよう
まずは適当なコードに対して
```
git add
```
をした後に
```
git commit
```
をします
(後ろにコミットメッセージは書きません)
するとvimが起動し、作成したテンプレートメッセージが開きます
今回のテンプレートは自分でアレンジしたものです
`i`を押して`insertモート`にした後に空白行にコミットメッセージを書きます

```terminal:vim
# ==== Commit Messages ==============
♻️ #3 不要なコメントを削除
# ==== Commit Messages(Template) ====
# :emoji: #Issue番号 変更内容
# 例) :+1: #438 コメント追加
#       👍 #438 コメント追加
# ==== Emojis ====
# 🐛 :bug: バグ修正
# 例：🐛 #10 未登録のメールアドレスが入力された場合に500エラーとなる箇所を改修
# ✨ :sparkles: 新規機能(ファイル)の追加
# 例：✨ #2 faviconファイルの追加、及び、設定
# 👍 :+1: 機能修正（バグではない）
# 例：👍 #9 nameのプレースホルダを「氏名」から「お名前」に変更
# 🚿：:shower: 不要な機能（ファイル）の削除
# 例：🚿 #30 未使用の関数「set_name」を削除
# ♻️ :recycle: リファクタリング（同じ挙動を担保した上での変更）
# 例：♻️ #30 n+1問題が発生していたループをeager_loadに変更
# ✅ :white_check_mark: テストの追加
# 例：✅ #30 Userモデルのテストを追加
# Please enter the commit message for your changes. Lines starting
# with '#' will be ignored, and an empty message aborts the commit.
#
# On branch main
# Your branch is up to date with 'origin/main'.
#
# Changes to be committed:
#       modified:   algo-method/search/double-loop/chapter1.py
#       modified:   atcoder/abc240/b/main.py
#
-- INSERT --
```

### 絵文字ってどうやって追加するの？
Macでは`control+command+enter`で絵文字を入力できます
このままだとコミットメッセージを打つたびに都度絵文字を調べないといけないのでお気に入り登録しましょう
まずは下記画像の右上にある四角を選択します

![スクリーンショット 2022-09-29 6.41.11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/625980/86b09f44-b629-90c6-1098-4332ab250bd9.png)

選択するとお気に入りを選択できる画面が表示されるのでご自身が使用する絵文字を選択し、お気に入り追加を押します
![スクリーンショット 2022-09-29 6.43.34.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/625980/0ae1635e-63d4-9c1a-8eef-4d42eec8b55c.png)

お気に入り追加すると下記のようになります
![スクリーンショット 2022-09-29 6.49.57.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/625980/f4f0d3b7-3b11-82b9-0c08-0773cc53154e.png)


コミットメッセージを書き終わった後に`esc`を押し、`:wq!`と入力した後にEnterを押すとvimが閉じられてコミットが反映されます

```terminal:vim
# ==== Commit Messages ==============
♻️  #3 不要なコメントを削除
# ==== Commit Messages(Template) ====
# :emoji: #Issue番号 変更内容
# 例) :+1: #438 コメント追加
#       👍 #438 コメント追加
# ==== Emojis ====
# 🐛 :bug: バグ修正
# 例：🐛 #10 未登録のメールアドレスが入力された場合に500エラーとなる箇所を改修
# ✨ :sparkles: 新規機能(ファイル)の追加
# 例：✨ #2 faviconファイルの追加、及び、設定
# 👍 :+1: 機能修正（バグではない）
# 例：👍 #9 nameのプレースホルダを「氏名」から「お名前」に変更
# 🚿：:shower: 不要な機能（ファイル）の削除
# 例：🚿 #30 未使用の関数「set_name」を削除
# ♻️ :recycle: リファクタリング（同じ挙動を担保した上での変更）
:wq!
```

また、コミットメッセージを反映させたくない際は`esc`を押し、`:q`と入力した後にEnterを押すとコミットメッセージを保存せずにvimを閉じることができます

```terminal:vim
# ==== Commit Messages ==============
♻️  #3 不要なコメントを削除
# ==== Commit Messages(Template) ====
# :emoji: #Issue番号 変更内容
# 例) :+1: #438 コメント追加
#       👍 #438 コメント追加
# ==== Emojis ====
# 🐛 :bug: バグ修正
# 例：🐛 #10 未登録のメールアドレスが入力された場合に500エラーとなる箇所を改修
# ✨ :sparkles: 新規機能(ファイル)の追加
# 例：✨ #2 faviconファイルの追加、及び、設定
# 👍 :+1: 機能修正（バグではない）
# 例：👍 #9 nameのプレースホルダを「氏名」から「お名前」に変更
# 🚿：:shower: 不要な機能（ファイル）の削除
# 例：🚿 #30 未使用の関数「set_name」を削除
# ♻️ :recycle: リファクタリング（同じ挙動を担保した上での変更）
:q
```

絵文字を使わずに下記のように打ってもGitHub上では絵文字として表示されます(ターミナル上では下記の例だと`:recycle:`と表示されます)
```terminal:vim
# ==== Commit Messages ==============
:recycle: #3 不要なコメントを削除
# ==== Commit Messages(Template) ====
# :emoji: #Issue番号 変更内容
# 例) :+1: #438 コメント追加
#       👍 #438 コメント追加
# ==== Emojis ====
# 🐛 :bug: バグ修正
# 例：🐛 #10 未登録のメールアドレスが入力された場合に500エラーとなる箇所を改修
# ✨ :sparkles: 新規機能(ファイル)の追加
# 例：✨ #2 faviconファイルの追加、及び、設定
# 👍 :+1: 機能修正（バグではない）
# 例：👍 #9 nameのプレースホルダを「氏名」から「お名前」に変更
# 🚿：:shower: 不要な機能（ファイル）の削除
# 例：🚿 #30 未使用の関数「set_name」を削除
# ♻️ :recycle: リファクタリング（同じ挙動を担保した上での変更）
:q
```

`git push`をした後にGitHubのリモートリポジトリを確認します
![スクリーンショット 2022-08-12 20.46.11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/625980/20a5e2be-b0b1-6a62-07f3-89df45591294.png)

画像のように絵文字とIssue番号が反映されていることが確認できました
また、`#3`とハイライトされている箇所はIssueの番号なので同じ番号のIssueをすでに作成しているのであればIssue番号をクリックすると該当するIssueまで遷移することができます

![スクリーンショット 2022-08-12 20.48.14.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/625980/785af939-654c-8245-25cf-53c74d6a37a8.png)

## コミットメッセージの修正方法

:::note warn
コミットメッセージを修正したいときはどうするの？
:::

```terminal:terminal
git commit --amend
```
を使用すると直前のコミットメッセージを修正することができます

例えば以下の方に本来は
` 👍  #2 railsのDockerfileを修正`
とコミットメッセージを書きたかったところを間違えて
` 👍  #2 railsのDockfleを習性`
と書いてしまったとします

```terminal:vim
# ==== Commit Messages ==============
👍  #2 railsのDockfleを習性
# ==== Commit Messages(Template) ====
# :emoji: #Issue番号 変更内容
# 例) :+1: #438 コメント追加
#       👍 #438 コメント追加
# ==== Emojis ====
# 🐛 :bug: バグ修正
# 例：🐛 #10 未登録のメールアドレスが入力された場合に500エラーとなる箇所を改修
# ✨ :sparkles: 新規機能(ファイル)の追加
# 例：✨ #2 faviconファイルの追加、及び、設定
# 👍 :+1: 機能修正（バグではない）
# 例：👍 #9 nameのプレースホルダを「氏名」から「お名前」に変更
# 🚿：:shower: 不要な機能（ファイル）の削除
# 例：🚿 #30 未使用の関数「set_name」を削除
# ♻️ :recycle: リファクタリング（同じ挙動を担保した上での変更）
:wq!
```

Gitのlogを確認します
```terminal:terminal
git log --oneline
```
すると、間違ったコミットメッセージが反映されてしまっていることがわかります
```text:terminal
e86d3c3 (HEAD -> main)  👍 #2 railsのDockfleを習性
2129246 (origin/main, origin/HEAD) Merge pull request #1 from shun198/feature/test01
```
前述の--amendを使います
```terminal:terminal
git commit --amend
```
するとVimが起動します
`i`を押して`insertモート`にした後にコミットメッセージを修正することができます
```vim:terminal
👍  #2 railsのDockfleを習性

# Please enter the commit message for your changes. Lines starting
# with '#' will be ignored, and an empty message aborts the commit.
#
# Date:      Mon Sep 19 09:39:03 2022 +0900
#
# On branch main
# Your branch is ahead of 'origin/main' by 1 commit.
#   (use "git push" to publish your local commits)
#
# Changes to be committed:
#       modified:   containers/rails/Dockerfile
#
~                                                                                
~
-- INSERT --
```
コミットメッセージを修正した後に`esc`を押し、`:wq!`と入力した後にEnterを押すとvimが閉じられてコミットが反映されます
```terminal:vim
 👍  #2 railsのDockerfileを修正

# Please enter the commit message for your changes. Lines starting
# with '#' will be ignored, and an empty message aborts the commit.
#
# Date:      Mon Sep 19 09:39:03 2022 +0900
#
# On branch main
# Your branch is ahead of 'origin/main' by 1 commit.
#   (use "git push" to publish your local commits)
#
# Changes to be committed:
#       modified:   containers/rails/Dockerfile
#
~                                           
~
:wq!
```
コミットメッセージが修正されていることが確認できました
```text:terminal
72eef02 (HEAD -> main) 👍 #2 railsのDockerfileを修正
2129246 (origin/main, origin/HEAD) Merge pull request #1 from shun198/feature/test01
```

これでコミットメッセージのテンプレートの作成方法については以上になります

## まとめ
特に初心者はテンプレートを作成、設定することで
- コミットメッセージのカンペを簡単に常時閲覧、編集できる
- 絵文字を暗記しなくていい
- 都度テンプレートファイルを書き換えることで運用の変更に対応しやすくなる

などメリットが多いのでぜひ使ってみてください

## 参考
https://qiita.com/watame/items/b93e19b0fbbc37fad22c

https://zenn.dev/k_saito_en/articles/6f4e89360338dd