VScode「表示」メニュー完全ガイド!最強の『コマンドパレット』と作業画面のカスタマイズ術
こんにちは。ゆうせいです。
これまで「ファイル」でプロジェクトを開き、「編集」や「選択」でコードを自在に操る方法を学んできましたね。だいぶVScodeに慣れてきたのではないでしょうか?
さて今回は、メニューバーの「表示」を見ていきます。
もし「編集」メニューが「コードを書く」ための機能なら、「表示」メニューは「コードを書きやすくする」ために、VScodeの作業環境そのものをカスタマイズする機能が詰まっています。
例えるなら、あなたの作業デスクのレイアウトを自由自在に変更するコントロールパネルのようなもの。これを使いこなせば、作業効率が劇的に向上しますよ!
VScode最強の機能:「コマンド パレット」
この「表示」メニューの中で、いえ、VScodeの全機能の中で、初心者が真っ先に覚えるべき最強の機能がこれです。
コマンド パレット... (Ctrl+Shift+P)
これは、VScodeの「魔法の杖」あるいは「なんでも検索ボックス」です。
専門用語解説:コマンド パレット (Command Palette)
VScodeには、私たちが今学んでいるメニュー項目以外にも、何百、何千という機能(コマンド)が隠されています。「コマンド パレット」は、それら全ての機能を「名前で検索して実行できる」万能ツールです。
- 使いどころ:
- 「Gitのあのコマンド、どこだっけ?」
- 「テーマの色を変えたいけど、設定はどこ?」
- 「ファイルの拡張子(言語モード)を切り替えたい」
- 「ショートカットキーを忘れた!」
こんな時、Ctrl+Shift+P を押して、ぼんやりとやりたいこと(例:「色」「git commit」「折り返し」)を日本語や英語で入力してみてください。
VScodeが賢く候補を絞り込み、あなたが実行したい機能をすぐに見つけ出してくれます。
正直、他のショートカットをすべて忘れても、Ctrl+Shift+P さえ覚えていれば、VScodeの全機能にアクセスできるんです!
5つの主要ツール:「サイドバー」を使いこなす
次に重要なのが、VScodeの左側に縦に並んだアイコン群、通称「サイドバー」です。「表示」メニューからは、これらのパネルの表示/非表示を切り替えられます。
特に重要な5つを紹介します。
- エクスプローラー (Ctrl+Shift+E):「ファイル」メニューの「フォルダーを開く」で開いたプロジェクトの、ファイルやフォルダが一覧表示される場所です。あなたの「地図」であり、最も多く使うパネルです。
- 検索 (Ctrl+Shift+F):「編集」メニューでも登場した「フォルダーを指定して検索」です。プロジェクト全体から特定の単語を探す、強力な検索機能ですね。
- ソース管理 (Ctrl+Shift+G):これは「Git」というバージョン管理ツールを操作するためのパネルです。コードの変更履歴を記録(コミット)したり、チームメンバーと共有(プッシュ/プル)したりします。チーム開発では必須の機能ですよ。
- 実行 (Ctrl+Shift+D):これは「デバッグ」という、プログラムのバグ(エラー)を見つけて修正する作業を支援するパネルです。
- 拡張機能 (Ctrl+Shift+X):VScodeの「アプリストア」です! VScodeは「拡張機能」を追加することで、どんどん賢くなります。例えば、
- コードを自動でキレイに整形してくれる機能
- 特定言語(PythonやPHPなど)のサポートを強化する機能
- エディタの見た目をカッコよくする「テーマ」などを、ここからインストールできます。
隠れた主役:「パネル」を制覇する
「サイドバー」が左側なら、「パネル」はVScodeの「下側」に表示されるエリアです。プログラムの実行結果やエラーメッセージが表示される、非常に重要な場所です。
1. ターミナル (Ctrl+@)
これも「コマンド パレット」に匹敵するほど超重要な機能です。
専門用語解説:ターミナル (Terminal)
「ターミナル」とは、キーボードで命令(コマンド)を打ち込んで、コンピュータに直接指示を出すための「黒い画面」のことです。(WindowsのコマンドプロンプトやPowerShell、Macのターミナルと同じもの)
- なぜ重要か?
- プログラムを実行する
- Gitコマンドを打つ
- 必要なツール(パッケージ)をインストールする (npm install など)といった、開発に必須の作業のほとんどを、このターミナル上で行います。
VScodeは、このターミナルをエディタ内に内蔵しています。つまり、コードを書きながら、わざわざ別のウィンドウに切り替えることなく、シームレスにコマンドを実行できるんです! これがどれほど便利か、すぐに実感できるはずです。
2. 問題 (Ctrl+Shift+M)
VScodeがあなたのコードを自動でチェックし、「ここ、文法が間違ってるかも?」「この変数は使われてないよ」といったエラーや警告を一覧表示してくれる場所です。
赤い波線が出たら、まずこの「問題」パネルを確認する癖をつけましょう。
読みやすさ向上:「右端での折り返し」
右端での折り返し (Alt+Z)
コードを書いていると、1行が長くなりすぎて画面の右端を突き抜けてしまい、横スクロールしないと読めなくなることがありますよね。
Alt+Z を押すと、「折り返し(Word Wrap)」がONになり、長すぎる行が画面の幅に合わせて自動で折り返して表示されるようになります。
これはコードの動作には一切影響しません。純粋に「読みやすさ」のための機能です。横スクロールが嫌いな人(私もです!)には必須のトグル(ON/OFF切り替え)機能です。
まとめと今後の学習指針
「表示」メニューは、あなたの作業環境を最適化するための宝庫です。
- 最優先:
Ctrl+Shift+P(コマンド パレット)をマスターし、あらゆる機能を名前で呼び出せるようにしましょう。 - 必須:
Ctrl+@(ターミナル)を開き、VScode内でコマンドを実行することに慣れましょう。 - 効率化:
Ctrl+Shift+E(エクスプローラー)でファイルを、「拡張機能」でVScode自体を管理しましょう。 - 快適性:
Alt+Z(折り返し)で、コードを読みやすく表示しましょう。
まずは、「コマンド パレット」で Ctrl+Shift+P を押し、「layout(レイアウト)」や「split(分割)」と入力してみてください。
「エディター レイアウト」関連のコマンドが見つかるはずです。
例えば「エディターを2列に分割」を選べば、2つのファイルを左右に並べて同時に編集できますよ。ぜひ試してみてください!
セイ・コンサルティング・グループの新人エンジニア研修のメニューへのリンク
投稿者プロフィール
- 代表取締役
-
セイ・コンサルティング・グループ株式会社代表取締役。
岐阜県出身。
2000年創業、2004年会社設立。
IT企業向け人材育成研修歴業界歴20年以上。
すべての無駄を省いた費用対効果の高い「筋肉質」な研修を提供します!
この記事に間違い等ありましたらぜひお知らせください。
最新の投稿
山崎講師2025年11月1日P値とは?新人エンジニア必見!「白いカラス」で学ぶ仮説検定の第一歩
山崎講師2025年11月1日VScode「表示」メニュー完全ガイド!最強の『コマンドパレット』と作業画面のカスタマイズ術
山崎講師2025年11月1日VScode「選択」メニュー攻略!カーソルを自在に操り、編集速度をハックしよう
山崎講師2025年11月1日VScodeの「編集」メニュー徹底解説!これぞエンジニアの三種の神器