開発者が必ず知っておくべきVSCodeのショートカット10選(Windows & Mac共通)

Webサービス/ツール系

VSCode(Visual Studio Code)は開発者のほとんどが利用しているコードエディタの一つです。マウス操作だと効率が悪いですが、うまくショートカットを利用し、自身のタスクを素早く実行する必要があります。

今回は、このVSCodeの必ず知っておくべきショートカットを紹介します。

\プログラミングを学びたい方におすすめ/


Udemy公式サイト

知っておくべきショートカット

コーディング集中モード「禅モード」

OS コマンド
Windows 「Ctrl」 + 「K」 → 「Z」
Mac 「Command」 + 「K」 → 「Z」

“Zen Mode(禅モード)”はサイドバーやステータスバーといったUI要素をすべて隠し、エディター部分を全画面表示にすることでコードディングに集中できるようにする機能となります。

HTML定型分を作成する

OS コマンド
Windows 「!」入力後に「tab」
Mac 「!」入力後に「tab」

HTMLファイルを新規で作成する際にデフォルトのHTML定型分を自動で入力されるショートカット。
「!(びっくりマーク)」を半角で入力後に「tab」を押下すると定型分が自動で入力されます。

コマンドパレットを表示する

OS コマンド
Windows 「Ctrl」 + 「Shift」 + 「P」
または
「F1」
Mac 「Command」 + 「Shift」 + 「P」
または
「F1」

様々な機能にアクセスするための「コマンドパレット」を開くショートカット。
文字エンコーディングの変更やファイルの保存など、キーボードで処理を行うことができます。

コメント化

OS コマンド
Windows 「Ctrl」 + 「/」
Mac 「Command」 + 「/」

行をすべてコメント化する場合に利用するショートカット。コーディング時には必須のショートカットキーのため、必ず覚えておくと良いでしょう。

画面の2分割

OS コマンド
Windows 「Ctrl」 + 「\」
Mac 「Command」 + 「Alt」 + 「Control」 + 「¥」

画面を2分割に分割するショートカットキーとなります。
エディタを分割表示すると、離れた場所に書かれたソースコードを、同時に確認しながらコーディングできるので、利便性が上がります。

行を一瞬で削除する

OS コマンド
Windows 「Ctrl」 + 「Shift」 + 「K」
Mac 「Command」 + 「Shift」 + 「K」

毎回行をマウスで選択してデリートキーを押す作業はとても面倒ですが、それを解消してくれるのが今回のショートカット。一瞬で行を削除してくれます。

コード内検索

OS コマンド
Windows 「Ctrl」 + 「F」
Mac 「Command」 + 「F」

コード内で文字列を検索したい場合に利用します。
結構文字列検索は利用しますが、VSCodeでは同じGUIで置換もできてしまいます。

ショートカットキー一覧表示

OS コマンド
Windows 「Ctrl + 「K」 → 「Ctrl」 + 「S」
Mac 「Command + 「K」 → 「Command」 + 「S」

VSCodeのショートカットキーの一覧を表示するショートカットとなります。もし、他のショートカットキーが知りたい場合は、上記ショートカットキーで表示します。

ズームイン / ズームアウト

ズームイン

OS コマンド
Windows 「Ctrl」 + 「+」
Mac 「Command」 + 「+」

ズームアウト

OS コマンド
Windows 「Ctrl」 + 「-」
Mac 「Command」 + 「-」

画面上のコードをズームイン/ズームアウトするショートカットとなります。文字が見づらくなった場合などはズームインして確認します。

コード整形

OS コマンド
Windows 「Shift」 + 「Alt」 +「F」
Mac 「Shift」 + 「Alt」 +「F」

コードを書いていると、インデントを揃えたいと言うことが多々出てきます。そう言う時に利用するのがこのショートカットとなります。
1発で綺麗なコードに整形してくれます。

最後に

いかがでしたでしょうか?
ショートカットは作業効率化する上でもかなり便利な機能ですので是非覚えて利用してください。

\プログラミングを学びたい方におすすめ/


Udemy公式サイト

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