勢いでMac買っちゃった人のためのWebプログラミング開発環境構築
同級生（昭和54年生まれ）の友達が最近プログラミングに興味を持っていて「Mac買おうかなー」と迷っていたのでまとめました。プログラミング楽しいよ。
私とプログラミング
2019年1月からMacBook Pro(15)に乗り換えました。以前の13インチに比べて5cmくらい？画面が大きくなり、しばらく満足していたのですが1週間も経つともっと画面広かったらなーと思うようになりました。しばらくコワーキングで仕事しているのでデュアルディスプレイでないのが少しさびしい。
これからはしばらくFirebaseを中心にWebアプリケーションをいくつか作る予定です。フロントエンドはVue.jsを中心にJavaScriptをしっかりやろうと思っています。あとたまにPHPのコードも書きます。そんなわけで必要なツールはエディターとターミナルとブラウザがあれば十分です。というわけで以下のアプリをインストールしました。
エディタ（VS Code）
エディタはこれまでAtomを使っていましたが（今も使っていますが）VS Codeに乗り換えました。
デフォルトでも機能が十分ですがVimプラグインなどを入れてプログラマーっぽくしています。他にはGitLensとかGit系の拡張を入れたり、FirebaseとかVueとかのJSまわりのプラグインをいくつかインストールしました。
WakaTime
VS Codeにはプログラミングの時間を計測してくれるWakaTimeプラグインもインストールしてみました。
ちなみに私の最近のプログラミング時間はこんなかんじ。
https://wakatime.com/@murayama333
DAILY AVERAGE 2 hrs 56 mins
最近だと毎日3Hくらいコーディングの時間を確保できているみたい。5Hくらいいきたい。これからプログラミング始める人にもおすすめのプラグインです。
Dash
JavaScriptとかAPIよくわかっていないのでDash入れてみました。
ショートカットキーが安定していないけど、cmd + shift + spaceとかでAPIをひけるようにしています。あとスニペット機能も優秀みたいだけどまだあまり試していない。
ターミナル（iTerm2）
続いてターミナル編。デフォルトのターミナルでも良いような気がしますがプログラマーっぽくありたいのでiTerm2をインストールしました。
CUIベースでコード書くのもカッコいいのでVimでいくべきか迷うのですが、Vim素人なので今はVS Codeでコードを書くようにしています。そうするとエディタとiTerm2の切り替えが頻繁に発生するのでiTerm2のホットキー設定を有効にしています。Alt + SpaceでいつでもiTtem2が表示されるので気持ち良いです。ctrlキー連打で開くのもありみたいです。
Homebrew
Macだとお約束のパッケージ管理ツールHomebrewをインストールします。
インストールは上記のページを参考に。インストールが完了するとbrewコマンドでパッケージを追加できるようになります。以下はwgetコマンドをインストールする例です。
$ brew install wget
zsh
デフォルトのシェルはzshに変更しています。複数のターミナル間でコマンドのヒストリを共有できるのが有り難いです。たしかzshもbrewでインストールしたような気がします。
$ brew install zsh
tmux
iTermの中ではtmuxをインストールしています。
$ brew install tmux
tmuxを使えば、iTermの画面表示を分割したりタブ移動したり便利です。プレフィックスキーはこれまでctrl + tを使っていましたが、今回からはctrl + spaceに変更しました。余談ですがVimのleaderもspaceキーに変更していてspace駆動で操作できるように設定しています。
以下のサイトを参考にしています。
tmuxのステータスバーにバッテリーとかWi-Fiとかいろんな情報を表示すると楽しいです。
peco
シェルではctrl + rでコマンドの履歴を検索したいのでpecoを入れておきました。brewでインストールできます。
$ brew install peco
以下のサイトを参考にしています。
ctrl + x でcdコマンドを補完できるのが地味に便利です。
Vim
やっぱりVimの設定も楽しいです。LIGさんの設定がシンプルで良かったです。
上記のページでも紹介がありましたが、少し古い記事ですが「Vimの生産性を高める12の方法」も面白かったです。
ブラウザ（Chrome）
とりあえずChromeを入れました。あんまりカスタマイズはしていないです。はてなブックマーク拡張は入れています。あとはVueの開発用の拡張とか。
ユーティリティ系
ウィンドウのリサイズにはSpectacleがちょうどいいです。
あとはVS Codeでctrl + m での改行が上手く効いてくれないのでキーのリマップもやろうか迷い中。Karabinerのお世話になるかも。
画面を広く使いたい
ここまでベタなアプリの設定ばかりだったので。ライフハック？的なやつも。
これからしばらくMac1台で仕事をするので画面を広く効率的に使いたいところです。なので、まずMacの「システム環境設定」で以下のとおり変更します。
- Dockを隠す
- メニューバーを隠す
そうすると画面が少し広くなります。
次にiTerm2からタイトルバーを消します。iTerm2の環境設定Profile=>WindowにあるStyleで No Title Barを選びます。
タイトルバーが消えて1cmくらいだけでも画面が広くなると嬉しいです。
調べてみたらVS CodeやAtomもタイトルバーをプラグインで消すことができました。
VS Codeの拡張は再起動時に警告が出るけどとりあえず無視しています。
以上でこんなかんじになります。
ちなみに画面を広く使って集中していると「今何時？」となることが多いので、ターミナルとかエディタのステータスバーに時刻を表示するようにしています。
