viviONグループでは、DLsiteやcomipoなど、二次元コンテンツを世の中に届けるためのサービスを運営しています。
ともに働く仲間を募集していますので、興味のある方はこちらまで。
概要
みなさんは普段どのようなIDEを使っていますか？
僕はかれこれ6年ほどVSCode様の靴をペロペロさせていただいています。
今回は、自分が普段よく使っているVSCodeのショートカットをまとめてました。
みんなもショートカットを使いこなしてQoP（Quality of Programming）を向上させよう💪
今回紹介するものをすべて知っていた方は「ふ～ん。俺は知ってるけどね」と後方彼氏面をしていてください
※Windows準拠で記載していますが、基本的にはCtrl → Cmd、Alt → Optionに読み替えていただければMacでも使えると思います。多分。
検索系
Ctrl + F, Ctrl + Shift + F
アクティブファイル内の検索窓を開きます。
Shiftと組み合わせるとワークスペース内の検索窓が開きます。
テキストを選択状態でショートカットを起動すると、自動で選択した文字列を検索してくれます。
ちなみにアクティブファイル内の検索をしてるときはEnterを押すことで次の検索候補に表示が移ります。
Ctrl + P, Ctrl + Shift + P
ファイルの検索窓が開き、特定のファイル名を検索してそのファイルを開けます。
Shiftと組み合わせるとコマンドパレットが開き、実行したいコマンドを検索して実行できます。
Ctrl + LeftClick 参照を確認
特定の変数や関数の参照を確認できます。
ワークスペース内のコードがVSCodeに正しく認識されている必要があります
メモリがパンパンなときなど、たまに反応してくれないことがある。お茶目さんなので。
そういうときはVSCodeを再起動すれば大体改善します。
Ctrl + G
行/列の検索窓が開き、アクティブファイルの特定の位置に移動できます。
正直列の移動はほぼ使ったことがないので、行移動だけ覚えておけばOKです。
マルチカーソル系
Ctrl + D
選択中の文字列と一致する部分にカーソルが生えます。
一致する文字列が複数存在する場合は、Ctrl + Dを連打するとその分カーソルが生えます。
Ctrl + U
先ほどのショートカットを調子に乗って連打しすぎてしまった、そこのあなた。
このショートカットで余計に生やしてしまったカーソルをひとつ戻すことができます。やったね
Ctrl + Shift + L
ちょうどいま腱鞘炎になってしまい、Ctrl + Dを連打するのがしんどいよ～という方。
このショートカットなら、選択中の文字列に一致する部分すべてにカーソルを生やせます。やったね
腱鞘炎のときはキーボードなんか触らずにしっかり体を休めましょう。
Ctrl + Alt + ↑ or ↓
上もしくは下の行に現在のカーソルと同じ位置のカーソルを生やします。
保存系
Ctrl + K → Ctrl + Shift + S
コードの自動フォーマットを実行せずにファイルを保存します。
僕は基本Format on saveをONにしているんですが、肥大化してるコードを編集するときは、自動フォーマットにメモリを持っていかれないようにこの方法で保存してから最後に別途フォーマットしてます。
Ctrl + K → S
未保存の変更があるファイルをすべて一括で保存します。
Format on saveをONにしている場合すべての保存に対して自動フォーマットがかかるので、メモリよわよわPCくんを使っているときは要注意。
表示系
Ctrl + Shift + B
プライマリサイドバー（エクスプローラーとかがあるとこ）の表示/非表示を切り替えます。
僕は表示領域を確保するために普段は非表示にしていて、必要な時は対応したアクティビティのショートカットを使って適宜表示してます。
Ctrl + Shift + E（エクスプローラー）/ F（検索窓）/ G（ソース管理）/ X（拡張機能） etc
あとサイドバーなしでVSCodeを使えるようになると、ちょっと玄人みが出て自己肯定感が上がります（諸説あり）
Ctrl + \
アクティブファイルを分割表示します。
デフォルトでは水平分割ですが、Ctrl + Kのあとに押すと垂直分割になります。
Ctrl + Tab
アクティブファイルを切り替えます。Windows のwindows + Tabと同じ感じ。
エディタを分割している場合は、アクティブグループ内のファイルが切り替え対象になります。
操作系
（操作系ってなんだ....？）
Alt + ← or →
定義や参照のジャンプやアクティブファイルの切り替えなどの操作を一つ戻す or 進めます。
実際に試してみるのがわかりやすいと思うので、お手元でぜひ。意外と便利です。
Alt + ↑ or ↓, Alt + Shift + ↑ or ↓
カーソルがある行を上もしくは下の行と入れ替えます（インデントも自動で合わせてくれます）。
Shiftを組み合わせると上もしくは下に行を複製します。正直めちゃ便利。これすき。
Ctrl + /
みんなおなじみ、コメントアウトの切り替えができるとてもえらいショートカットです。なにもない行にカーソルがあるときはコメントアウトを生成します。
言語に合わせたコメントアウトをしてくれるのがほんとうにえらい。かわいい（？）
Ctrl + Tab, Ctrl + Shift + Tab
みんなおなじみ、選択しているすべての行のインデントをひとつ深くします。
Shiftと組み合わせると逆にインデントが浅くなります。Markdownの箇条書きとかと同じ。
おまけ
ターミナルにフォーカス
VSCodeのショートカットには「ターミナルにフォーカス」というはちゃめちゃに便利なショートカットが存在するんですが、既定ではキーバインドが設定されていません。
これを設定しておくと、キーボードから手を放す時間が減って少し幸せになれます。
僕はCtrl + Shift + Enterを割り当ててます。
あとがき（「後からきたガキ」の略ではない）
いかがでしたでしょうか？
今回紹介した以外にもVSCodeにはたくさんのショートカットがありますが、この記事がみなさんのQoP向上に少しでも貢献できていれば幸いです。
それでは 
一緒に二次元業界を盛り上げていきませんか
株式会社viviONでは、フロントエンドエンジニアを募集しています。
また、フロントエンドエンジニアに限らず、バックエンド・SRE・スマホアプリなど様々なエンジニア職を募集していますので、ぜひ採用情報をご覧ください。