はじめに

FM_Harmonyです。 Rakus Developers Blogでは4回目の投稿です。

↓前回の記事はこちら

tech-blog.rakus.co.jp

さて、弊社ではビアバッシュというイベントを行っています。（ビアバッシュ・・・?という方はコチラ）
今回はその際に私が発表したことについて、補足も踏まえつつまとめたいと思います。 テーマはtigでcommitをきれいに！です。

• はじめに
• tigとは？
• 準備
• • tigのインストール（windowsの場合）
  • tigのインストール（macOSの場合）
• commitをきれいにする理由
• 使ってみる
• • 実演の前準備
  • 機能を追加して、まとめてcommitする
  • git rebase -i で、commitの分割を始める
  • tigを使ってcommitを分割する - その1
  • tigを使ってcommitを分割する - その2
  • tigを使ってcommitを分割する - その3
• まとめ
• 参考資料

tigとは？

Tig is an ncurses-based text-mode interface for git.
--- https://github.com/jonas/tig より

tigとはターミナル上で動作するgitリポジトリのブラウザ・・・と言えます。 logの閲覧や、commit操作などを簡単に行うことができる便利なツールです。 動作も高速なので、慣れてしまえばストレスなくcommit操作を行うことができます。

準備

今回はwindowsで実演を行いますが、macでのインストール方法も記載しておきます。

tigのインストール（windowsの場合）

Git for Windows の v2.14.2から、tigが付属するようになりました。 なので、windowsではtigを特別にインストールする必要はありません。

tigのインストール（macOSの場合）

Homebrewを使うことで簡単にインストールすることができます*1。 tigをmacOSにインストールするためには、ターミナルから以下のコマンドを実行します。

commitをきれいにする理由

実演の前に、commitを分割する理由を説明します。 開発を行っていると、どうしても commit が大きくなったり、適切に commit が分けられていないという状況に出くわすと思います。
このcommitをそのままにすると何が良くないのかというと、

• レビュワーがpushされたcommit一つ一つについて規模を把握しづらい。
• 後から変更に問題があることが発覚した際に、問題が発生した commitを追いづらくなる.

といった事が挙げられます。

なので、上記の問題が発生しないようにcommitを適切な大きさに分割するとよいです。 その際に、tigを利用すると高速かつ簡単にcommitの分割を行うことができます。

使ってみる

実演の前準備

実際にtigを使って、commitの分割を行ってみましょう。

現在、sampleReposというリポジトリが以下のような構成になっているとします。

NewFile.java の内容は以下の通りです。

この状態で一度 commit したとします。

機能を追加して、まとめてcommitする

さて、この状態からNewFile.javaにmethodAとmethodB
というメソッドを追加することになりました。

とりあえず今回の変更をまとめてcommitします。

git rebase -i で、commitの分割を始める

では、早速commitを分割してみましょう。 今回は、先程のadd methodA and methodB to NewFile
というcommitを

• add methodA to NewFile
• add methodB to NewFIle

という二つのcommitにします。

まず、以下のgitコマンドを実行します。

すると、以下のような文章がテキストエディタで表示されるはずです*2。

これがtigのMain Viewと呼ばれる画面です。 この状態で、Shift + Sキーを押すと、次のような画面へ遷移します。

これがtigのStatus Viewと呼ばれる画面です*3。
この状態で、Changes not staged for commit:以下の M NewFile.javaにカーソルを合わせてEnterキーを押すと、次のような画面が画面下（もしくは画面右）に分割されて表示されます。

これが、Diff Viewと呼ばれる画面です。
長くなりましたが、この画面上でstaged / unstagedする部分を指定できます。

tigを使ってcommitを分割する - その2

それでは、mainメソッド内の

と、methodAメソッドの定義である

という変更が含まれたcommitを作成しましょう。
今回は1行ずつstagedにしていきます。 Diff Viewで、commitに含める変更箇所にカーソルを合わせて1
キーを押すことで1行づつ staged にすることができます。 ただし、変更内容が表示された画面でのカーソル移動には j, kキーを使うことに注意します。

完了したら、Status Viewが

となっているはずです。 つまり、同じファイルに対する変更をcommitに含むものと含まないものに分けることができたということです。
念のため、Changes to be committedの下にあるNewFile.javaのDiff Viewが以下のようになっていることを確認してください。

qキーを押してDiff Viewを閉じてからStatus View上で Shift + Cキーを押すと、git commitコマンド入力時と同じ画面が現れます。 そこで、 commit messageを add methodA to NewFile.java.としてcommitを行います。
こうして、methodA
の追加に関する変更のみを含んだcommitが完成しました。

tigを使ってcommitを分割する - その3

その後、画面にはEnter
キーを押すようにメッセージが出ているはずなので、それに従います。

すると、Main Viewに画面が戻るはずです。 ここで先程のadd methodA to NewFile.
というcommitが表示されていない場合は、Shift + R
キーでMain Viewを更新します。

では、同じようにmethodB
の追加に関する変更のみを含んだcommitを作成しましょう。Status Viewから、unstagedなNewFile.java
に関するDiff Viewを開きます。

また1行ずつstagedにしても良いのですが、今度は全ての変更をcommitに含みます。 なので、Uキー を押してファイルの変更全てを一括でstagedにします。Status Viewを確認すると、以下のようになるはずです。

そして、Diff Viewを閉じた状態でShift + C
キーを押してgit commitを行います。 commit messageはadd methodB to NewFile.java.とします。

commitが完了してMain Viewへ戻った後、qキー を押してtigを終了します。
その後、以下のコマンドを実行して、add methodA and methodB to NewFileというcommitへの編集を終了します。

その後、再びtigコマンドを実行すると、確かにcommitが分割されたことが分かります。

まとめ

いかがでしたでしょうか。 ちょっと伝わりづらい部分もあったと思いますが、実際にtig
を使ってみるとその便利さが分かると思います。

commitを見やすく分割するのは、レビュアーの負担を減らすだけでなく、将来の自分が変更内容を理解するのに役立ちます。 なので、この記事をご覧いただいた方が、tig を使うことで少しでも楽に commit をきれいにできれば幸いです。

最後に、以下の言葉を引用してこの記事のまとめとします。

コードは他の人が最短時間で理解できるように書かなければならない
--- リーダブルコード - より良いコードを書くためのシンプルで実践的なテクニック P.3 より

（本来はコードの可読性に関する言葉ですが、commitをきれいにするということは上記の考え方と同じものが根底にあると感じました）