こんにちは！ユウキです。
カナダでWeb系のエンジニアをやっている者です。
この記事は Frog Advent Calendar 2018の24日目になります。
テーマは 自身または職場で使っている技術・Framework・ツールについてということなので、今回は開発環境と使用しているツールについて掘り下げてお話しさせて頂きたいと思います。
開発はCUIのツールを中心に行っているので、特に興味がない人はここでタブをそっ閉じして大丈夫です。
tl;dr
- Vim + tmuxのレベルを上げてコマンドで殴る
- CUI軽くて幸せ
- CUIのレベルを上げる過程で成長→喜び→モチベーション→成長の好循環が生まれる
自己紹介と前提
これからCUIツールについてご紹介するわけですがデザイン業務をやらないというのがCUIに寄せられる一番の要因な気がします。
僕はカナダのWeb系の会社でバックエンドエンジニアをやっています。
主な言語はPHPでLaravelマンです。たまにnode.jsとフロント周りも触ります。デザインはやっていません（二回目）
ワーホリで来て語学学校行った後に就活してビザもらって働いています。そんな分かりやすい感じで来たんですが、気づけば2年半が経っていました。
環境について
開発環境についてですが、個人の開発はMac、会社ではWindows＋WSLで行っています。
また開発ツールは基本的にCUIに寄せることにしています。
理由とメリットは以下の3つです。
- 動作が軽い → 軽いは正義です
- ウィンドウ数を減らせる（tmux必須。主にブラウザとターミナルの2つを使用） → GUIでツールを切り替えて探すストレスが減ります
- コマンドを忘れにくくなる → 作業そのものが捗ります。また習熟していくのでコマンド自体の操作も早くなりドーパミンが出ます
あとは個人的なメリットですが、WindowsとMacの両方を使っているので、作業環境をほぼ統一できるのも強みです。
使用しているツールについて
CUIに寄せる上で使用しているツールを3つ紹介します。
- Vim（エディタ）
- tmux（ターミナルマルチプレクサ）
- tig（gitクライアント)
うち上の2つは必須のツールです。tigはおまけです。
Vim
言わずと知れたテキストエディターです。
viの拡張なので軽い・早い・美味いの三拍子揃っています（最後は個人の感想です）
文字列選択に強く、柔軟にいろんな範囲を選択・削除・置換することが出来ます。
個人的に便利だと思うのはHTMLタグ内の書き換え(cit)、キーワード補完(Ctrl+n/p)や行の補完(Ctrl+x+l)です。
プラグインやツールの導入によって特定の場所への移動も強化出来ます。
詳しくは説明しませんが以下は便利です。
GitGutterプラグイン → Gitの変更箇所に一瞬で飛べます(]c)
また差分をハイライトしたり左側に表示する機能があります（本来はこっちがメインの機能）
IDEでも使えるプラグインがあったりするのでIDE派の人で使ってない人にもおすすめです。ctags → タグを生成しVimでクラスや関数の宣言元に飛べるようになります(Ctrl + ])
IDEに備わっている機能と似たようなことをVimで実現出来ますが、使い勝手は正直IDEの方に軍配が上がるかと思います（僕のVimの修行不足かもしれません）
参考
Vimメモ : vim-gitgutterで差分を左端に表示する
vim＋ctagsでコードのタグジャンプをする方法
新人達を1ヶ月でガチvimmerにした方法
Vimは大抵のLinuxサーバには入っているので使い方だけでも覚えておくと便利です。
また、Vimのキー入力による移動方式はLinuxのコマンドの多くと共通しているので、最低限の操作は必須教養だと思います。
tmux
僕の開発のキモとなるツールです。
CUI上で画面分割や一時的な画面のデタッチなどが出来ます。
主に画面分割をして複数のCUIツールを連携させるのに使っています。
前述の「ウィンドウの数を減らす」ことを実現するのに必要不可欠です。
操作コマンドはVimに似せるよう設定を変更して使用しております。
作業していてよくやるのはGitとの連携です。
Vimで作業中に画面を水平分割→Gitでコミット作業→Vimを全画面に戻す
Vimで作業中に画面を水平分割→git grepでファイルを探す→Vimを全画面に戻して開く
などです。一連の操作を軽量ですばやく処理できるので重宝しています。
こんな感じです。
また、このあと紹介するtigというGitクライアントを最近使い始めたのですが、前述のGitのコミット作業をtigに置き換えるだけで簡単に導入できました。
CUIツール同士の親和性が増すのもメリットかなと思います。
参考
tmuxの使い方
達人に学ぶ.tmux.confの基本設定
〜余談〜
なんか最近のVim(8.1)はターミナルが開けるらしく、友人はvim上で:terminalした上でtmuxを動かしていました。どちらが良いのかは好みだと思いますが、僕は なるべく画面数を減らしたいというコンセプトなので今の所tmuxにVimを乗せています。
tig
先程少し触れましたが、CUIのGitクライアントになります。むちゃくちゃサクサク動きます。
CUIながら、変更内容をプレビューしながらインデックス・アンインデックスが簡単にできます。
こういったツールはたいてい覚えるコマンドが多くてハードルが高かったりしますが、tigは使い始めるのに覚える事が少なくて始めやすいです。
とりあえず s -> 選択&Enter -> d -> 選択&u(or 1) -> q だけできれば使い始められると思います。
sとdとuとqの4つの意味を覚えるだけです。分かりづらいですね。説明が下手ですみません。使ってみてください。
1行単位での追加も簡単にできるので、コミットの粒度を調整するのが苦手な人（僕です）とか、 git add -pに疲れてきた人には特におすすめです。
ただしコミット・プッシュ機能がないので、僕は git addを便利にするツールとして使っています。
参考
まとめ
今回はCUIにまとめて作業するというコンセプトで、開発環境の一部を紹介させて頂きました。
CUIは慣れるまでに練習が必要ですが、サーバ作業を行う上で必須のスキルもいくつかあります。
また、慣れていくうちに生産性はもちろん向上する上に、上達による中毒性があるので成長→モチベーション向上→成長の好循環が生まれやすいと思います。
いままでGUIツールばかりだった方はこれを機会に触ってみてはいかがでしょうか。
告知（身内向け）
来年2018年の1月19日にMasaが行うVue.js講座のお手伝いをします。
Frogからイベントの告知があると思いますので、興味がある方はふるってご参加ください！