Vimゴルフのすゝめ


Ateam Commerce Techのアドベントカレンダー 9日目は@shimura_atsushiが担当します。

# 昨今
ソフトウェアエンジニアにとって欠かすことができないテキストエディタですが古今東西様々なものがあります。
私はかねてから`Vim`を愛用していますがこの頃は`Microsoft`の`VisualStudioCode`がとても人気で一強の様相です。
私の職場でも`VisualStudioCode`を使っている人が大半でVimを利用しているのは私一人となってしまいました。

Vimはトリッキーで最初はとっつきにくいエディタですが一通りコマンドを覚えてしまえばとて便利なエディタです。
コマンドを覚えるまでが大変なところがありますがゲーム感覚でVimに慣れたり、Vimのコマンドを覚えてしまおうというのが今回紹介する`Vim ゴルフ`です。

# 準備
まずVimがないと話が始まらないので手元のPCでVimを使えるようにしましょう

:::note info
ここから少しVimの説明が入ります。
Vimのことは知ってる！！Vimの説明はいいからVim ゴルフの説明お願いって人は直下のリンクでジャンプ
:::

[Vimゴルフをしよう](#vimゴルフをしよう)

## Mac
Macでは初期状態からVimがインストールされているのでターミナルを開いて`Vim`コマンドを実行すれば立ち上がるはずです。

## Windows
Vimの公式にインストーラーがあるのでインストール後パスを通せばPowerShellやコマンドプロンプトから起動できます。
[Vim公式](https://www.vim.org/download.php#pc)

Windowsの場合、WSL2でLinuxをインストールすれば`Vim`は初期状態からインストールされていることが多いので準備が楽です。

## GUIが欲しい人は...
VimとはいえGUIがほしいという人はGUI版のVimがあります。
以下からインストーラをダウンロードできます。

### Mac
https://github.com/macvim-dev/macvim/

### Windows
https://www.kaoriya.net/software/vim/

### VisualStudioCode
どうしてもVisualStudioCodeがいいんだって方はVisualStudioCodeでVimをエミュレートできるプラグインがありますインストールすることでVimのキーバインドでVisualStudioCodeを操作できます、試してみてください。

https://marketplace.visualstudio.com/items?itemName=vscodevim.vim


# Vimを覚えよう
## モード
Vimには主に3つのモードがあります、それぞれ特徴がありうまく使い分けることがより効率いいテキスト編集を実現します。
初見では理解するのに苦労するかもしれませんがVimを使う上では欠かせない概念です。

### コマンドモード
Vimを起動すると初期状態はこのコマンドモードです。
コマンドを用いてテキストを編集するモードです。

#### 例えば...

- `x`でカーソル上の一文字を削除
  - コマンドモードは`Delete`キーや`BackSpace`キーでは削除できません
- `u`でアンドゥ
- `w`でカーソルを次の単語へジャンプさせる

#### カーソルを移動
コマンドモードではカーソルの移動を上下左右キー(↑↓←→)ではできません。
カーソルの移動もコマンドで行います。

- カーソルを上へ一つ移動
  - kキー
- カーソルを下へ一つ移動
  - jキー
- カーソルを左へ一つ移動
  - hキー
- カーソルを右へ一つ移動
  - lキー

Vimには他にも数多のコマンドが存在します、Googleで調べるなりひとつづつ覚えていきましょう。

### インサートモード
コマンドモートでキーボードの`i`を押すとインサートモードに遷移します。
> エディタの下部に`INSERT`もしくは日本語なら`挿入`と表示されます
文字や記入したり編集したりするのはこのモードで行います、通常のテキストエディタと同じ状態です。
このモードでは`上下左右キー`によるカーソルの移動や`Delete`キー、`BackSpace`キーによる文字の削除ができます。

### ビジュアルモード
テキストの編集をより効率的に行うための要となるモードです。
ビジュアルモードではテキストを範囲選択でき選択した範囲に対して何かしらの操作をするためのモードです。
ビジュアルモードはコマンドモードで`v`を押すことで遷移します。

#### 例えば...
ビジュアルモードで複数の文字を選択した状態で`y`を押すことで選択した範囲をヤンク(コピー)することができます。
ビジュアルモードには通常のビジュアルモードとは別にビジュアルブロックモード、ビジュアルラインモードがあります。

- ビジュアルブロックモード
  - `Ctrl + v`で起動
  - 選択を矩形範囲ですることができます。
- ビジュアルラインモード
  - `Shift + Ctrl + v`で起動
  - 選択を行単位ですることができます。

### Escキー
Vimを扱う上で最も重要度が高いキーと言っても過言ではありません。
Escキーはインサートモードやビジュアルモード滞在時にコマンドモードへ戻る機能を持ちます。
「困ったらEscキー」という格言がVim界にあるようにVimを利用している上でモードや状態に迷子になった時にEscキーを用いることで
コマンドモードへ戻りニュートラルな状態に復帰させることができるためです。

### そして触ってみよう
VimはWebや書籍などの文字ベースである程度の知識を入れたら実践してなれることが上達への圧倒的な近道です、慣れるまではきついかもしれませんが頑張って乗り越えましょう。
特にビジュアルモードは文字での説明ではイメージしづらいので実際に機能に触れてみるのがいいかと思います。


# Vimゴルフをしよう
Vimの基本を押さえたらVimゴルフにトライしましょう！

## Vimゴルフとは？
実際のゴルフは打数が少ないプレイヤーが勝ちですがその要素をVimよるテキスト編集に取り入れたのが`Vimゴルフ`です。
決められた文章に編集するためのストローク数を競う遊びです。
より少ないストロークを狙うためにはVimのコマンドを駆使する必要があるのでゲーム感覚でVimのコマンドに触れ合い覚えることができます。

## 例題
より少ないキーストロークで`スタート`を`ゴール`にしましょう

### Q1

#### スタート

```
1234567890
```
#### ゴール

``` 
1234467890
```

<details><summary>回答例</summary><div>

#### その1

```
# 7打
llllxi4
```

- 解説
  - シンプルにカーソルを`5`まで`l`で移動させ`x`で削除したのち`i`でインサートモードで移行し`4`を入力します。
  - 今回の記事紹介したコマンドで可能な範囲のストロークです。

#### その2

```
# 5打
f5xi4
```

- 解説
  - `f`コマンドで5までカーソルを移動させ`x`で削除し`i`でインサートモード移行したのち`4`を入力
  - `f`は`f`を入力した直後の文字をカーソル以後同じ行を検索し最初にヒットした箇所までカーソルを移動させます。

</div></details>

### Q2

#### スタート

```
ABCDEFG
```

#### ゴール

``` 
G
``` 

<details><summary>回答例</summary><div>

#### その1

```
# 6打
xxxxxx
```

- 解説
  - 愚直に`x`コマンドで1文字づつ6文字削除します。
  - これではVimを利用している意味が薄れてしまいます。

#### その2

```
# 2打
6x
```

- 解説
  - 実行したいコマンドの前に数字を入力することで入力した分の数直後のコマンドを繰り返して実行してくれます。
  - この特性を活かすことでわずか2打で6文字を削除することができます。

</div></details>
 
### Q3

#### スタート

```
1234567890
```

#### ゴール

``` 
1234567890
1234567890
``` 

<details><summary>回答例</summary><div>

#### その1

```
# 12打
i1234567890[ENTER]
```

- 解説
  - `i`でインサートモードへ移行後1-0までの数字を入力しエンターキーで改行します。
  - これではまた`Q2`同様Vimを利用している意味が薄れてしまいます。

#### その2

```
# 3打
yyp
```

- 解説
  - `yy`コマンドで行ヤンク後、`p`コマンドでペーストします。
  - `yy`コマンドはカーソルがある行を一行まるごとヤンクします。
  - `p`コマンドはヤンクされたものをカーソルの次の行へペーストします。

</div></details>
 
### Q4

#### スタート

```
let's play vim
```

#### ゴール

``` 
let's play vi
``` 

<details><summary>回答例</summary><div>

#### その1

```
# 3打
fmx
```

- 解説
  - Q2で登場した`f`コマンドで`m`を検索してカーソルを`m`まで移動させて`x`で削除しています。

#### その2

```
# 2打
$x
```

- 解説
  - `$`コマンドはカーソルを行末まで移動させてくれます、その後`x`で削除することで2打でゴールへたどり着けます。

</div></details>

## 問題を出し合おう
Vimゴルフの要領を得てきましたら自身で問題を作成してみるとよりVimのコマンドについて詳しくなると思います。
今回、Vimの紹介や例題で扱ったコマンドはその1割にも満たないです、まだまだ実戦で使えるコマンドが沢山あるのでVimゴルフを通じで楽しみながら覚えたり慣れることができたらGoodです。

# Vimを使うモチベーション
Vimは他のテキストエディタに比べると圧倒的に学習コストが高いエディタです。
Vimの起動時のモードはコマンドモードなのでカーソルの移動や文字の入力がままならないかもしれません。
いざ文章を作成しても初見では保存やエディタの終了もままならなず、GUIのエディタとは一線を画する作りになっています。

ただそれでもVimを使い続けるのはVimが`手に馴染むエディタ`だからです、Vimはとにかくカスタム性に優れたエディタです。
普段エディタでコーディングなどの作業している時になにかちょっと気持ち悪いなと思った操作感を`.vimrc`という設定ファイルに設定を追加して解消したときの快感は忘れられません。
すべての`Vimmer`は常に自分の手に馴染む設定を模索し`.vimrc`を試行錯誤し`Vim`を`育て`ていくのです、そうなった時あなたはVimを手放せなくなるでしょう。