2025.02.18

初心者にもわかる「VSCode」おすすめショートカットで効率UP！

PC操作

はじめに

Visual Studio Code（VSCode）は、多くの開発者に愛用されている高機能なコードエディタです。普段使用している中で、次のように感じている方もいるのではないでしょうか。

基本的な操作しか知らず、もっと便利に使いたい
ショートカットを活用して作業スピードを上げたい
先輩のようにスムーズに使いこなしたい

Visual Studio Codeではさまざまなショートカットが使用でき、使いこなせるようになると作業の効率化が可能です。多くのショートカットを習得すると、時間のかかるマウス操作を減らし、目的のツールをすぐに表示できるため、作業スピードが向上します。

本記事では、Visual Studio Codeをより快適に使うためのショートカットを図と共に分かりやすく解説していきます。この記事を読み終わるころには、いくつかのショートカットを使えるようになることが目標です。それでは、一緒に学んでいきましょう。

Visual Studio Codeとは

Visual Studio CodeとはMicrosoft社が提供するコードエディターで、通称「VSCode」と呼ばれています。

VSCodeはオープンソースのソフトウェアで、誰でも無料で利用できます。多言語対応、OSを問わず使用可能、多彩な拡張機能といった特徴を持ち、多くの現役エンジニアから支持されています。日本語対応もしているため、初心者でも扱いやすいエディターです。

VSCodeは以下のサイトからダウンロードでき、Mac、Windows、Linuxに対応しています。

Visual Studio Code 公式サイト

https://code.visualstudio.com/download

導入方法や基本操作については、以下の記事で詳しく解説しているので、ぜひ参考にしてください。

初心者にもわかる「VSCode」の導入から基本操作まで解説

https://envader.plus/article/118

VSCodeでショートカットを使うメリット

「ショートカットは便利だけど、覚えるのが大変」と考えている方もいるかと思います。しかし、ショートカットを活用することで、作業効率を大幅に向上させることができます。

例えば、新規ファイルを作成する場合は以下の手順となります。

マウス操作

ファイルメニュー→新規ファイル作成を選択→ファイル名入力
ショートカット使用（Windowsの場合）

ctrl + N→ファイル名入力

時間にしたら数秒の差ですが、細かな時間短縮が積み重なることで、長期間で見ると大きな効率化が実現します。ショートカットは覚えるまで手間がかかりますが、その手間は後から取り返せるため、メリットは大きいといえるでしょう。

VSCodeショートカット4選

VSCodeの操作をスムーズにし、コード記述を効率化するためのショートカットを、以下の4つのカテゴリに分けて紹介します。まずは基本的な操作から試してみましょう。

基本操作のショートカット
ファイル操作のショートカット
カーソル移動のショートカット
知っていると便利なショートカット

基本操作のショートカット

VSCodeを使う上で最初に覚えておくと便利なショートカットです。

機能	Windows	macOS	動作概要
ファイルをクイックオープン	Ctrl + P	Cmd + P	ワークスペース内のファイルや、最近開いたファイルを表示
コマンドパレットの表示	Ctrl + Shift + P	Cmd + Shift + P	VSCodeのすべての機能を検索・実行
サイドバーの表示/非表示	Ctrl + B	Cmd + B	サイドバーの表示を切り替え
ターミナルの表示/非表示	Ctrl + J	Cmd + J	ターミナルの表示を切り替え
エディタを横に分割	Ctrl + \	Cmd + \	画面を左右に分割し、複数ファイルを表示
画面の拡大/縮小	Ctrl + + / -	Cmd + + / -	画面表示を拡大縮小
VSCodeの設定を表示	Ctrl + ,	Cmd + ,	VSCodeの設定を表示

紹介したすべてのショートカットを図と共に補足説明します。

ファイルをクイックオープン

作業中のディレクトリ内のファイルや最近開いたファイルを一覧表示し、矢印キー ↓ または ↑ でファイルを選択し開くことができます。

コマンドパレットの表示

VSCodeの機能やコマンドを検索し、素早く実行できます。設定変更や拡張機能の操作にも便利です。

サイドバーの表示/非表示

サイドバーをワンタッチで表示・非表示できます。

ターミナルの表示/非表示

内蔵ターミナルを簡単に表示・非表示できます。

エディタを横に分割

画面を左右に分割し、複数のファイルを並べて表示できます。

画面の拡大/縮小

画面の表示サイズを拡大・縮小できます。

VSCodeの設定を開く

VSCodeの設定を開き、フォントサイズや自動保存などのカスタマイズができます。

ファイル操作のショートカット

VSCodeだけでなく、PCの基本操作として共通しているショートカットもあります。特に新規作成や保存などは、日々の作業で頻繁に利用します。

機能	Windows	macOS	動作概要
ファイルの新規作成	Ctrl + N	Cmd + N	新しいファイルを作成
ファイルを開く	Ctrl + O	Cmd + O	ファイルを開くダイアログを表示
ファイルを保存	Ctrl + S	Cmd + S	現在のファイルを保存
名前を付けて保存	Ctrl + Shift + S	Cmd + Shift + S	ファイルを別名で保存
すべてのタブを保存	Ctrl + K + S	Cmd + opt + S	複数のファイルを一括保存
ファイルを閉じる	Ctrl + W	Cmd + W	開いているファイルを閉じる
すべてのファイルを閉じる	Ctrl + Shift + W	Cmd + Shift + W	開いているすべてのファイルを閉じる
閉じたファイルを開きなおす	Ctrl + Shift + T	Cmd + Shift + T	直前に閉じたファイルを再度開く

カーソル移動のショートカット

コードを素早く編集するために、目的の位置へ迅速に移動できるショートカットです。長いファイルの編集が格段に楽になります。

機能	Windows	macOS	動作概要
ファイルの先頭/後尾に移動	Ctrl + Home / Ctrl + End	Cmd + ↑ / ↓	ファイルの先頭または後尾へカーソルを移動
行の先頭/後尾に移動	Home / End	Cmd + ← / →	行の先頭または後尾へカーソルを移動
単語単位に移動	Ctrl + ← / →	opt + ← / →	単語単位でカーソルを移動
単語単位で選択	Ctrl + Shift + ← / →	opt + Shift + ← / →	単語単位で選択範囲を拡大
行を指定して移動	Ctrl + G	Cmd + G	指定した行番号へ移動

ここでは、行を指定して移動を図と共に補足説明します。

行を指定して移動

指定した行番号へ素早く移動できます。トラブル対応時など、エラーが発生している箇所を素早く表示する際に便利です。

知っていると便利なショートカット

以下のショートカットを活用すると、コードの記述スピードが向上し、作業効率が大幅にアップします。

機能	Windows	macOS	動作概要
行の移動	Alt + ↑ / ↓	opt + ↑ / ↓	カーソル行や選択行を上下に移動
行の複製	Alt + Shift + ↑ / ↓	opt + Shift + ↑ / ↓	カーソル行や選択行を上下に複製
行の途中で下に改行を挿入	Ctrl + Enter	Cmd + Enter	カーソル位置の直下に新しい行を挿入
行を全て削除（切り取る）	Ctrl + X	Cmd + X	カーソル行を全て削除（切り取る）
行のコメントアウト	Ctrl + /	Cmd + /	カーソル行や選択行をコメントアウト
同じ内容のテキストを選択	Ctrl + D	Cmd + D	一致するテキストを同時選択
ファイル内の記述を検索	Ctrl + Shift + O	Cmd + Shift + O	クラス・関数などの一覧を表示し、該当箇所にジャンプ
変更を取り消し	Ctrl + Z	Cmd + Z	変更した内容をもとに戻す

紹介したすべてのショートカットを図と共に補足説明します。

行の移動

カーソル行や選択行を上下に移動し、コードの順序を調整します。

行の複製

カーソル行や選択行を上下に複製します。

行の途中で下に改行

カーソル位置の直下に新しい行を挿入します。

行を全て削除（切り取る）

カーソル行を全て削除（切り取る）します。

行のコメントアウト

カーソル行や選択行をコメントアウトします。

同じ内容のテキストを選択

一致するテキストをCtrl + DまたはCmd + Dを入力するたびに順に選択します。選択した部分は同時に編集が可能です。

ファイル内の記述を検索

クラス・関数などをリスト表示し、選択した項目にジャンプします。

変更を取り消し

変更した内容をもと状態にしたい際に使用します。このショートカットはVSCode以外の基本PC操作でも使用できる便利なショートカットです。

まとめ

VSCodeのショートカットを活用することで、マウス操作の手間を減らし、よりスムーズにコーディングを進めることができます。最初はすべてを覚える必要はありません。まずはこの記事で紹介したショートカットの中から、特に自分の作業に役立ちそうなものを試してみましょう。

少しずつ使いこなしていくうちに、自然と手が覚えていき、作業効率が格段に向上します。慣れてきたら、自分に合ったカスタマイズや、より高度なショートカットにも挑戦してみるのもおすすめです。

VSCodeにはまだまだ便利な機能がたくさんあります。ぜひ、ショートカットを活用しながら、快適な開発環境を作り上げていってください。

参照資料

以下のリンクは、この記事で説明した手順や概念に関連する参考資料です。より詳しく学びたい方は、ぜひご覧ください。

Visual Studio Code - Keyboard shortcuts for macOS

https://code.visualstudio.com/shortcuts/keyboard-shortcuts-macos.pdf
Visual Studio Code - Keyboard shortcuts for Windows

https://code.visualstudio.com/shortcuts/keyboard-shortcuts-windows.pdf

【番外編】USBも知らなかった私が独学でプログラミングを勉強してGAFAに入社するまでの話

IT未経験者必見 USBも知らなかった私が独学でプログラミングを勉強してGAFAに入社するまでの話

プログラミング塾に半年通えば、一人前になれると思っているあなた。それ、勘違いですよ。「なぜ間違いなの？」「正しい勉強法とは何なの？」ITを学び始める全ての人に知って欲しい。そう思って書きました。是非読んでみてください。

「フリーランスエンジニア」

近年やっと世間に浸透した言葉だ。ひと昔まえ、終身雇用は当たり前で、大企業に就職することは一種のステータスだった。しかし、そんな時代も終わり「優秀な人材は転職する」ことが当たり前の時代となる。フリーランスエンジニアに高価値が付く現在、ネットを見ると「未経験でも年収400万以上」などと書いてある。これに釣られて、多くの人がフリーランスになろうとITの世界に入ってきている。私もその中の1人だ。数年前、USBも知らない状態からITの世界に没入し、そこから約2年間、毎日勉学を行なった。他人の何十倍も努力した。そして、企業研修やIT塾で数多くの受講生の指導経験も得た。そこで私は、伸びるエンジニアとそうでないエンジニアをたくさん見てきた。そして、稼げるエンジニア、稼げないエンジニアを見てきた。

「成功する人とそうでない人の違いは何か？」

私が出した答えは、「量産型エンジニアか否か」である。今のエンジニア市場には、量産型エンジニアが溢れている！！ここでの量産型エンジニアの定義は以下の通りである。

比較的簡単に学習可能なWebフレームワーク（WordPress, Rails）やPython等の知識はあるが、ITの基本概念を理解していないため、単調な作業しかこなすことができないエンジニアのこと。

多くの人がフリーランスエンジニアを目指す時代に中途半端な知識や技術力でこの世界に飛び込むと返って過酷な労働条件で働くことになる。そこで、エンジニアを目指すあなたがどう学習していくべきかを私の経験を交えて書こうと思った。続きはこちらから、、、、