「どうせgit操作するならカッコいいツールでやりたいなー」→ lazygitはいかがですか？

どうもこんにちは、パンカメです。

筆者は普段Web開発に携わっています。

最近は、「どうせ開発するなら、自分のテンションが上がるツールを使って開発したいなー」と思っていて改めてVim入門したりdotfiles管理をもっと便利にしたりなどやっています。

その中で**ターミナル上でgit操作を快適に行うことのできるlazygitというツールを知り、こんなカッコいいツールがあるんだと衝撃を受けました！**

普段の仕事ではまだVSCodeとtigを使ってgit操作を行っていますが、本格的に導入するために操作まわりを整理してみたのでぜひ覗いてみてください。

┌┬（゜＜――＠ 「lazygitかっこいいので広めたい」

## lazygitとは

[jesseduffield/lazygit: simple terminal UI for git commands](https://github.com/jesseduffield/lazygit)

lazygitをインストールすれば、ターミナル上で`lazygit`と打つだけで起動できて、ターミナルUIでgit操作ができるツールです。(`q`で終了できます)。
 **マウス操作も反応するのでパネル間の移動やコミットの選択をマウスで選択したりもできます。**
基本的にはコマンド操作で全ての操作が完結するのがlazygitのいい所ですが、慣れないうちは便利ですね。

(このテキストベースで黒い画面で操作する感じがかっこいい…)

![lagygit_1.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/163887/3d849274-3b82-201f-a58a-70215ea54244.gif)

## インストール方法

インストールはとても簡単です。

公式の[インストール方法](https://github.com/jesseduffield/lazygit#installation)を参考にインストールします。

筆者の場合は、WSLのUbuntuにlinuxbrew(homebrew)を入れているので、brewコマンドを使ってインストールします。

```
brew install lazygit
```

## lazygitの画面の説明

lazygitでは最初からいい感じにエリア(パネル)ごとにできることが決まっていて、やりたいことに応じてパネルを移動してコマンドでgit操作を行います。

パネル毎の領域がわかりやすいように透ける白背景で分かりやすく加工しています。

### Status

今いるリポジトリとブランチ名を確認できます。

![status.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/163887/5f301046-33ec-1a49-367a-b39818721b29.png)

### Files

VSCodeのgit画面と同じく変更したファイルの一覧が表示され、addやcommit等を行うことができます。

![files.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/163887/560e786d-2404-290a-3782-394f6d2f5d6e.png)


### Local Branches

ローカルブランチの一覧が見れます。

ブランチの作成・削除・切替などを行う事ができます。

![local_branches.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/163887/06e66349-43d1-f7fd-405a-caaf63b73c5c.png)


### Commits

今いるブランチのコミット履歴が見れます。

コミットハッシュ値が黄色の場合はすでにリモートにpushしたコミットで、赤色の場合はローカルでのみコミットしたものになります。リモートにpushすると黄色になります。

![commits.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/163887/fe29c7a1-c86a-b146-0830-4b4e8b7666d6.png)


### Stash

Stashの一覧が見れます。

applyやpopなどの操作を行うことができます。

![stash.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/163887/f49523a8-e9fd-8f7d-8213-e024c4e54a9a.png)


### Command Log

lazygitでコマンド操作した場合に実際はgitコマンドが実行されており、そのコマンドの履歴を確認することができます。

![command_log.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/163887/beec235f-d772-4724-a94c-489d5520688a.png)

## 操作方法

### 簡単な操作方法(これだけ覚えればとりあえずは使える！)

**lazygitはとりあえず、移動方法とヘルプが見られれば最低限すぐに使えるようになるので、「lazygitカッコいい！今すぐに触ってみたい」という人のために移動方法とヘルプの見方だけ抑えておきましょう。**

#### 移動方法

| コマンド                  | 説明                  |
| ------------------------- | --------------------- |
| `h`,`l` or `Tab`,`S-Tab`  | パネル移動(進む/戻る) |
| `j`,`k`                   | パネル内移動(上/下)   |
| `@` → `Focus command log` | Command Logへ移動     |

※他のパネルと違いCommand Logへの移動は`@` → `Focus command log`で移動するようです(戻る場合は、`ESC`で戻れます)。

#### ヘルプの見方
**操作がわからない場合は`x`キーを押せばそのパネルでできる操作コマンドの一覧を表示することができとても便利です。**

例として、Statusパネルで`x`を押してみましょう(閉じる場合は`ESC`で閉じます)。

次のようなヘルプウィンドウがフローティングで表示されます。

上部のコマンドがStatusパネルでのみ使えるコマンドで、下部のコマンドが全パネル共通のコマンドです。他のパネルでも同じような感じで表示されます。
一行の空行が区切りになっているので見方さえ覚えてしまえば簡単ですね。

![help.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/163887/fd9b346a-6540-caa5-3822-11be0f3cefef.png)

### 基本的なgit操作編

rebaseやreflogなど応用的な操作もできるのですが、まだ使いこなせていないので基本的なgit操作について紹介していきます。

#### checkout -bする
ここでは「develop」というローカルブランチを作成していきます。

1. 「Local Branches」パネルに移動
2.  `n`を押して、ブランチ名を入力して`Enter`で作成

![lagygit_checkout_b.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/163887/1573fb22-0c6e-577f-447c-337141aef4cb.gif)

#### checkoutする
ここでは「develop」ブランチから「main」ブランチに移動します。

1. 「Local Branches」パネルに移動
2.  切り替えたいブランチに移動して、`SPC`

![lagygit_checkout.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/163887/fbe3a681-34d4-7d5f-2966-66acf8c36a09.gif)

#### branch -dする

ここではローカルの「develop」ブランチを削除してみます。

1. 「Local Branches」パネルに移動
2.  削除したいブランチに移動して、`d`を押して`Enter`で削除

![lagygit_branch_d.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/163887/dbbcdc72-d51f-af84-77a3-fbdc59f5ba43.gif)

#### pullする

リモートの「main」ブランチに他の人の変更が入ったと見立てて、「main」ブランチをpullします。

1. 「Local Branches」パネルに移動
2.  pullしたいブランチに移動して、`p`

![lagygit_pull.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/163887/0552a984-9bc1-5e3b-4366-11a7d30833b6.gif)

#### addする

##### ファイル単位でadd

1. 「Files」パネルに移動
2. addしたいファイルに移動して、`SPC` ※もう一度、`SPC`でファイルのadd取り消し

![lagygit_add_1.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/163887/7898382a-54cb-f50c-8e90-a0d08d75b199.gif)

##### ファイル内の行ごと(ハンク)でadd

行ごとにadd(ハンク)するのが簡単にできます。
vimと同じように`v`でビジュアルモードにして複数行をハンクしたりもできるので、直感的にそして簡単に操作できます。

1. 「Files」パネルに移動
2. ハンクしたいファイルに移動して`Enter`してUnstaged Changesに移動
3. 一行ずつハンクする場合は、`SPC`。`v`でビジュアルモードにして行選択して`SPC`すると複数行ハンクできます。
4. Unstaged Changes/Staged Changesは`TAB`で移動。Staged Changesから取り消したい場合も同じく`SPC`で取り消し。
5. 「Files」パネルに戻るには`ESC`

![lagygit_add_2.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/163887/2feaecbc-e14d-ac14-0ce6-0d01e0969193.gif)

#### 全ファイルをadd

1. 「Files」パネルに移動
2. `a`で全てのファイルをadd ※もう一度`a`で全てのファイルのadd取り消し

![lagygit_add_3.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/163887/a42512bc-35c7-418e-3157-07f93086e686.gif)

#### commitする

1. 「Files」パネルに移動
2. `c`でコミットメッセージを入力して`Enter`してコミット

![lagygit_commit.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/163887/80a0a408-0e8d-9677-3e16-5e801484b4f8.gif)

#### pushする

ローカルでのみコミットしている場合は「Commits」パネルのコミットハッシュ値が赤く表示されます。
このコミットをリモートブランチにpushします。
pushが完了するとコミットハッシュ値が黄色くなります。

1. `P`でリモートへpush

![lagygit_push.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/163887/b88a1e01-3f55-76ee-a75a-796ffd35bda0.gif)

#### stashする

1. 「Files」パネルに移動
2. `s`でstash名を入力してstash
3. 戻すときは「Stash」パネルに移動
4. `SPC`でapply、`g`でpop、`d`でdropできます。ここでは、`g`でpopしています。

![lagygit_stash.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/163887/2ff0d235-1c85-f991-ddee-e1a20231ba85.gif)

#### gitコマンドを直接実行する

lazygit上で用意されていないgit操作を行いたい場合は、`:`でカスタムコマンドを実行することができます。

ここでは、ローカルで色々操作したけど、とりあえずリモートのブランチの状態に戻したいときに使うコマンド`git reset --hard origin/main`を実行してみます。

![lagygit_custom_command.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/163887/7aac469c-5079-42b2-5b2a-4d4d900776f6.gif)


### まとめ

lazygitいかがだったでしょうか。
意外に操作方法を見てみると、簡単にできそうという印象があるのじゃないでしょうか。

**筆者も最初は難しいかなーと思っていたのですが、パネル毎の役割と`x`を押せばとりあえずなんとかなるというのが分かってからはすごい使いやすいなーと思っています。**

最初は筆者のように練習用のリポジトリを作って、そこで操作を色々試すのがおすすめです。

lazygitは操作した内容の実際のgitコマンドも履歴を見ればわかるので、知らないgitコマンドの意味を調べたりもできて結構gitの勉強にもなります！

今はtigをメインで使っているのですが、何か特別な設定をしなくてもたくさんのgit操作を行うことができるlazygitは慣れると便利です。

あと、やっぱりカッコいいです！ツールはどうせなら自分のテンションがあがるものを使っていきましょう！