開発効率をアップする方法っていくつかあると思います。
開発言語の勉強をする
アルゴリズムを学ぶ
フレームワークを学ぶ
どれも大切ですが、多くの時間が必要です。
そんな中、ほとんど時間を必要とせずに開発効率をアップさせる方法が
キーボードショートカットをマスターすることです！！
エディタを切り替えたり、ファイルを開いたり、エクスプローラーを移動したりをマウスでやるのもいいですが、キーボードショートカットをマスターしてしまえば、いちいちキーボードから手を離してマウスを使って、またキーボードに手を戻してということが不要になります。
今までマウスを使ってやってた事をキーボードだけで操作できるようになるので驚くほど、開発効率がアップします。
キーボードショートカットをマスターして開発効率をギア2ndにアップしましょう！！
おすすめですので、ぜひ試してください。ちなみにPCはMacです。
VSCodeのキーボード設定方法
キーボードショートカットがデフォルト設定で使いづらい場合は、下記記事を参考に変更してください。
【VSCode】キーボードでエクスプローラーとエディタとターミナルを移動する – フリーランス チャレンジ！！
VSCodeのキーバインドを調べる方法
自分のVSCodeのキーバインドが何になってるか？を調べる方法です。
今回の例はcmd+dは何かを調べてます。
キーボードアイコン押下後にcmd+dで設定が表示されますよ。
www.youtube.com
開発効率をアップさせるキーボードショートカット
選択してる単語と同じ単語を選択(cmd+d)
タブを分割(cmd+t)
※設定カスタマイズしてます。
www.youtube.com
現在表示されてるエディタが右に分割され、フォーカスも右に移ります。
私はこの後、分割元（左のエディタ）にフォーカスを移動して、別のファイル（エディタで表示してる別のタブ）を表示します。
このへんのショートカットもこの後登場します。
分割した次のエディタグループに移動(option + tab)
※設定カスタマイズしてます。
www.youtube.com
動画では、左のエディタグループから右のエディターグループへ移動し、最後に左に戻ってます。
こういうのマウスカーソルでやってたのをキーボードでできるだけで、だいぶ効率良くなったと実感してます。
対応する括弧に移動(shift + cmd + ¥)
※設定は2つ出てきてますが、上の方ですね。（When列のeditorFocusの方）
www.youtube.com
9行目、18行目を行ったり来たり。
定義に移動(F12)
※設定3つあるんですが、多分1番上です。
www.youtube.com
開発するならこれは覚えるの必須ですね。
前の位置に戻る(option + cmd + 左)
※設定2つあって、２個目の方ですね。
動画は「次の位置に進む」にまとめてます。
次の位置に進む(option + cmd + 右)
※こちらも2つ目の方の設定
www.youtube.com
最初にF12で移動した後、option + cmd + 左、右で行ったり来たりしてます。
右のタブに移動(shift + cmd + ])
※設定カスタマイズしてます。2つ目の方です。
www.youtube.com
左のタブに移動(shift + cmd + [)
※設定カスタマイズしてます。2つ目の方です。
www.youtube.com
行移動(cmd + l)
※設定カスタマイズしてます。
www.youtube.com
ボックスが出てくるので、そこに移動したい行数を打ち込めば移動できます。
最後に(ブラウザもキーボードで操作)
ちなみにブラウザもキーボードで操作してます。
外付けディスプレイ使っててMacのタッチパッドだけだとカーソル操作が大変なんですがVSCodeとブラウザ操作はほぼキーボードだけでなんとかなるので、マウス不要って感じです。
【書籍】
コメント