はじめに
開発効率を向上させる上で、エディタの操作速度は無視できない要素です。
思考と実装のタイムラグを最小限に抑えるためには、キーボードとマウス・トラックパッドの切り替えを減らし、ホームポジションからできるだけ離れずに操作を完結させることが重要です！⌨️
本記事では、macOS環境のVisual Studio Code（以下、VS Code）において、コーディング速度を向上させるためのショートカットキーと運用テクニックを解説します！
対象読者
- Mac で VS Code を使用しているエンジニア
- コーディング中にマウスやトラックパッドへの手の移動頻度を減らしたい方
1. 行操作の最適化
コード編集において最も頻度が高い「行」単位の操作。
これらを Cmd + C / Cmd + V で行っている場合、改善の余地が大きくあります。
行の入れ替え・移動
ロジックの順序変更や、プロパティの並び替えに利用します。選択範囲を作る必要はありません。
-
ショートカット:
Option+↑/↓ -
メリット: カット（
Cmd + X）＆ペースト（Cmd + V）を行うよりも手順が少ない
行の複製
似た構造のコードを連続して記述する際に有効です。
-
ショートカット:
Shift+Option+↑/↓ - メリット: カーソル位置を保ったまま、上下に素早く複製を作成できる
行の削除
行末まで選択して Delete する、あるいは行番号をクリックして削除する操作は不要です。
-
ショートカット:
Cmd+Shift+K - メリット: カーソルが行のどこにあっても、その1行を瞬時に削除する
2. カーソル移動の高速化
矢印キーの連打は時間の浪費です。
macOS標準のテキスト操作とVS Code固有の機能を組み合わせることで、意図した場所に最短距離で到達します。
単語単位の移動・選択
キャメルケースやスネークケースの変数名を修正する際、一文字ずつ移動するのは非効率です。
-
単語移動:
Option+←/→ -
単語選択:
Shift+Option+←/→
行頭・行末への移動
Macのキーボードには物理的な Home / End キーがない場合が多いですが、以下のコンビネーションが同等の役割を果たします。
-
行頭へ移動:
Cmd+← -
行末へ移動:
Cmd+→
インデントの調整や、行末へのセミコロン追加などで使用できます。
対応する括弧へのジャンプ
ネストの深いJSONや長い関数定義において、ブロックの始点と終点を行き来する操作です。
-
ショートカット:
Cmd+Shift+¥
閉じ括弧 } がどこに対応しているかを視覚的に探す必要がなくなります。
3. マルチカーソル
VS Codeの強力な機能の一つがマルチカーソルです。複数の箇所を同時に編集することで、リファクタリングの速度が飛躍的に向上します。
同一単語の連続選択
特定の変数名をリネームしたい場合や、複数の箇所に同じ修正を加えたい場合に使用します。
-
ショートカット:
Cmd+D - 操作: 対象の単語にカーソルを置き、押下するたびに次の同一単語が選択範囲に追加されます。
1行ずつ修正しなくて済むので便利です！
全一致箇所の選択
ファイル内にある特定のキーワードを一括で操作したい場合に有効です。
-
ショートカット:
Cmd+Shift+L - 操作: 選択している単語と同じものを、ファイル全体からすべて選択状態にします。
-
活用例:
printをすべて選択し、Cmd + Shift + Kで一括削除する。
検索→置換よりもこっちの方が速いと思います！
矩形（ボックス）カーソルの追加
縦に並んだデータに対して、一括でプレフィックスを付与する際などに使用します。
-
ショートカット:
Option+Cmd+↑/↓ - 操作: 現在のカーソル位置から垂直方向にカーソルを複製します。
選択解除したい時は、escで戻れます！
4. UI操作とナビゲーション
画面スペースを有効活用するため、サイドバーやパネルは必要な時だけ表示し、マウスを使わずに制御します。
サイドバーの開閉
コーディングに集中する際はエクスプローラーを閉じ、視界ノイズを減らします。
-
ショートカット:
Cmd+B
ターミナルの表示切替
Gitコマンドの実行やサーバー起動時のみターミナルを呼び出します。
-
ショートカット:
Cmd+J
ファイルのクイックオープン
ディレクトリツリーから目視でファイルを探す操作は、プロジェクト規模が大きくなるほど非効率になります。
-
ショートカット:
Cmd+P -
操作: ファイル名の一部を入力（あいまい検索対応）して
Enterで開きます。
ディレクトリ階層を意識する必要がなくなるので探しやすくなります。
また、検索候補のファイルを移動する際はCtrl + Nで下候補に移動・Ctrl + Pで上候補に移動が可能です。
5. リファクタリング
検索置換機能を使うよりも、言語サーバー（LSP）の機能を活用したほうが安全です。
シンボルのリネーム
変数名や関数名を変更する際、参照先も含めて安全にリネームします。
-
ショートカット:
F2
※Touch Bar搭載モデルや設定によってはFn+F2 - メリット: 文字列置換とは異なり、スコープやコンテキストを理解した上で変更されるため、同名の別変数を巻き込む事故を防げます。
おわりに
これらのショートカットを一度にすべて暗記する必要はありません。
まずは「1日1つ、特定の操作だけは絶対にショートカットで行う」と決めて実践することをおすすめします！
最初はマウス操作の方が速く感じるかもしれませんが、指が操作を覚えてくると、圧倒的にショートカットの方が速くなると思います！
他にもVScodeで効率爆上げの操作があればコメント等で教えていただきたいです！！💻
最後までお読みいただきありがとうございました！✨