【保存版】VSCodeのショートカットキー一覧

プログラミング・IT

Visual Studio Code(VSCode)は、世界で最も人気のある無料コードエディタです。

しかし、マウスだけで使っているともったいない!

ショートカットキーを覚えるメリット

  • 作業スピードが2-3倍向上
  • 手をキーボードから離さず集中できる
  • プロのような滑らかな操作
  • VSCodeの隠れた機能も発見

この記事では、初心者でも今すぐ使える実用的なショートカットを厳選して紹介します。

覚え方のコツ

  1. 一度に全部覚えようとしない
  2. 毎日3-5個ずつ練習
  3. よく使う操作から優先
  4. 手が覚えるまで繰り返し
スポンサーリンク

絶対に覚えたい基本ショートカット

超重要!毎日使う基本操作

操作内容Windows/LinuxMac使用頻度
ファイルを開くCtrl + PCmd + P⭐⭐⭐⭐⭐
コマンドパレットCtrl + Shift + PCmd + Shift + P⭐⭐⭐⭐⭐
保存Ctrl + SCmd + S⭐⭐⭐⭐⭐
設定を開くCtrl + ,Cmd + ,⭐⭐⭐⭐
ターミナル表示`Ctrl + “`Ctrl + “⭐⭐⭐⭐⭐

各ショートカットの詳しい使い方

1. ファイルを開く(Ctrl + P)

使用例:
Ctrl + P → "index.html" と入力 → Enter
  • プロジェクト内のファイルを瞬時に検索・開く
  • ファイル名の一部だけでもOK
  • 最近使ったファイルも表示される

2. コマンドパレット(Ctrl + Shift + P)

使用例:
Ctrl + Shift + P → "format" と入力 → Enter
  • VSCodeのすべての機能にアクセス
  • 拡張機能のコマンドも実行可能
  • 迷ったときの万能ツール

3. ターミナル表示(Ctrl + `)

使用例:
Ctrl + ` → コマンド実行 → 再度 Ctrl + ` で非表示
  • VSCode内でコマンドライン操作
  • 複数のターミナルを管理可能

コーディングを効率化するショートカット

コピー・移動・削除

操作内容Windows/LinuxMac説明
行全体をコピーShift + Alt + ↓/↑Option + Shift + ↓/↑選択せずに行をコピー
行を移動Alt + ↓/↑Option + ↓/↑行の順序を入れ替え
行を削除Ctrl + Shift + KCmd + Shift + Kカーソル行を瞬時に削除
複数行を選択Alt + クリックOption + クリック複数箇所を同時編集

実用例:行の移動とコピー

// 元のコード
function hello() {
    console.log("Hello");
    console.log("World");
}

// Alt + ↓ で2行目を下に移動
function hello() {
    console.log("World");
    console.log("Hello");
}

// Shift + Alt + ↓ で行をコピー
function hello() {
    console.log("World");
    console.log("World");  // ← コピーされた行
    console.log("Hello");
}

コメント・整形

操作内容Windows/LinuxMac説明
コメントアウトCtrl + /Cmd + /行コメントのON/OFF
ブロックコメントShift + Alt + AOption + Shift + A複数行コメント
コード整形Shift + Alt + FOption + Shift + F自動でコードを整列
インデント追加Ctrl + ]Cmd + ]選択行のインデント
インデント削除Ctrl + [Cmd + [インデントを戻す

実用例:コメントアウト

// 通常のコード
console.log("Hello");
console.log("World");

// Ctrl + / でコメントアウト
// console.log("Hello");
console.log("World");

// 再度 Ctrl + / でコメント解除
console.log("Hello");
console.log("World");

検索・置換のショートカット

基本的な検索

操作内容Windows/LinuxMac説明
検索Ctrl + FCmd + F現在のファイル内検索
置換Ctrl + HCmd + H文字列の置き換え
次を検索F3 または Ctrl + GCmd + G検索結果の次へ
前を検索Shift + F3Cmd + Shift + G検索結果の前へ
全選択して検索Ctrl + DCmd + D同じ単語を順次選択

高度な検索

操作内容Windows/LinuxMac説明
プロジェクト全体検索Ctrl + Shift + FCmd + Shift + F全ファイルから検索
プロジェクト全体置換Ctrl + Shift + HCmd + Shift + H全ファイルで置換
シンボル検索Ctrl + Shift + OCmd + Shift + O関数・変数名で検索

実用例:同じ単語を一括変更

// 元のコード
let userName = "John";
console.log(userName);
alert(userName);

// "userName"にカーソルを置いて Ctrl + D を繰り返し押す
// → 同じ単語がすべて選択される
// → 一度に変更可能

let userEmail = "John";
console.log(userEmail);
alert(userEmail);

ファイル・タブ管理のショートカット

タブ操作

操作内容Windows/LinuxMac説明
新しいファイルCtrl + NCmd + N無題ファイルを作成
タブを閉じるCtrl + WCmd + W現在のタブを閉じる
タブ切り替えCtrl + TabCmd + Option + →/←開いているタブを移動
閉じたタブを復元Ctrl + Shift + TCmd + Shift + T最近閉じたタブを再開
すべて保存Ctrl + K, SCmd + Option + S開いている全ファイル保存

ウィンドウ・ペイン操作

操作内容Windows/LinuxMac説明
エディタ分割Ctrl + \Cmd + \画面を縦に分割
エディタ移動Ctrl + 1/2/3Cmd + 1/2/3分割したエディタ間移動
サイドバー表示切替Ctrl + BCmd + Bファイルエクスプローラの表示/非表示
アクティビティバー切替Ctrl + Shift + E/F/GCmd + Shift + E/F/Gエクスプローラ/検索/Git

ターミナル操作のショートカット

ターミナル基本操作

操作内容Windows/LinuxMac説明
ターミナル表示/非表示`Ctrl + “`Ctrl + “統合ターミナルの切り替え
新しいターミナル`Ctrl + Shift + “`Cmd + Shift + “複数ターミナルを作成
ターミナル分割Ctrl + Shift + 5Cmd + Shift + 5ターミナルを横に分割
ターミナル間移動Alt + ←/→Cmd + ←/→複数ターミナル間の移動

実用例:開発ワークフロー

# ターミナル1:開発サーバー起動
npm start

# Ctrl + Shift + ` で新しいターミナル
# ターミナル2:Git操作
git add .
git commit -m "Update feature"

# 再度 Ctrl + Shift + ` で3つ目
# ターミナル3:テスト実行
npm test

デバッグのショートカット

デバッグ制御

操作内容Windows/LinuxMac説明
デバッグ開始F5F5デバッガーを起動
デバッグ停止Shift + F5Shift + F5デバッグセッション終了
ブレークポイントF9F9ブレークポイントの設定/解除
ステップオーバーF10F10次の行へ進む
ステップインF11F11関数の中に入る
ステップアウトShift + F11Shift + F11関数から出る

デバッグの基本的な流れ

  1. F9でブレークポイントを設定
  2. F5でデバッグ開始
  3. F10で1行ずつ実行確認
  4. 変数の値をウォッチ
  5. Shift + F5で終了

Git操作のショートカット

ソース管理

操作内容Windows/LinuxMac説明
ソース管理を開くCtrl + Shift + GCmd + Shift + GGitパネルを表示
コミットCtrl + EnterCmd + Enter変更をコミット(Git パネル内)
クイックGitCtrl + Shift + P → “Git”Cmd + Shift + P → “Git”Gitコマンドを素早く実行

カスタマイズとその他のショートカット

表示・設定

操作内容Windows/LinuxMac説明
コマンドパレットCtrl + Shift + PCmd + Shift + P全機能へのアクセス
設定を開くCtrl + ,Cmd + ,設定画面を表示
ショートカット一覧Ctrl + K, Ctrl + SCmd + K, Cmd + Sキーボード設定
拡張機能Ctrl + Shift + XCmd + Shift + X拡張機能パネル
全画面表示F11Cmd + Ctrl + Fフルスクリーンモード

クイック操作

操作内容Windows/LinuxMac説明
行の選択Ctrl + LCmd + L行全体を選択
単語の選択Ctrl + DCmd + D単語を選択(繰り返しで追加選択)
全選択Ctrl + ACmd + Aファイル全体を選択
元に戻すCtrl + ZCmd + Zアンドゥ
やり直しCtrl + YCmd + Shift + Zリドゥ

トラブルシューティング

ショートカットが効かない場合

原因1:他のアプリがキーを使用

対処法:
- 他のアプリを終了
- VSCodeの設定でキーバインドを確認

原因2:拡張機能の競合

対処法:
- 拡張機能を一時的に無効化
- キーバインドの競合を確認

原因3:言語設定の問題

対処法:
- キーボードレイアウトを確認
- VSCodeの言語設定を確認

まとめ

習得レベル別まとめ

初心者レベル(必須5個)

  • Ctrl + P – ファイルを開く
  • Ctrl + S – 保存
  • Ctrl + / – コメント
  • Ctrl + F – 検索
  • `Ctrl + “ – ターミナル

中級者レベル(+10個)

  • 上記5個 + 編集・移動・置換操作

上級者レベル(+15個以上)

  • デバッグ、Git、カスタマイズまで活用

コメント

タイトルとURLをコピーしました