Visual Studio Codeの使えるショートカット + 設定した方が良いショートカット

小ネタ
小ネタ

プログラミングの開発・学習に使うエディタ。

私はVisual Studio Code!ショートカットを極めよう。

Pythonをはじめ、多くのプログラミング言語で使用可能なエディタ「Visual Studio code
通称「VS code

Microsoftが開発していて、めちゃくちゃ使いやすいエディタで、使用者もかなり多いソフトウェアです。

VS codeを活用していくうえで切っても切れないのが、ショートカットです。
ショートカットを使いこなせるかどうかで、コーディングのスピードが大きく変わります。

しかし、私をはじめとして初心者プログラマーには、膨大すぎるショートカットのどれを使っていけばよいのか分かりません。

そこで、いろいろ使ってみて、「まず初めに覚えるべきショートカット」を調べてみました。
さらに、「デフォルトにはないけど自分で設定するとめちゃくちゃ捗ったショートカット」も合わせて紹介します。

(※Windows向けの内容になっています。Macの方、すみません・・・最後の項は役にたつと思います。)

1.初心者プログラマへ VS codeのココがオススメ

VS codeは非常に出来ることが多く、その機能性で推奨されていることも多いです。
しかし、初心者にはその機能を使いこなすのは難しいです。(私は使いこなせていません。)
それでも、私はVS codeをオススメします。

初心者の私が考える、ココがオススメ
①:ターミナルがすぐに動かせる。
②:文字をハイライトしてくれるので分かりやすい
③:配色を変えれて楽しい
④:メジャーなエディタなので分からない事は大体ググれば解決できる。

⑤:Windowsだけじゃなく、Mac、Linuxでも使える。
⑥:無料!!

一部を解説します。

①のターミナルとは、プログラムを実行するためのツールです。
Windowsの場合、「コマンドプロンプト」や「PowerShell」がターミナルとして使用されます。

このようなターミナルだけのソフトで実行する場合(Pythonの例)、
①:エディタでプログラムを書く
②:書いたプログラムを「XXXXX.py」の名前で保存する。
③:ターミナルソフトで、python XXXXX.pyとして実行する
という手順が必要になります。

では、VS codeの画面を見てみましょう。

このように、「エディタ」と「ターミナル」がひとつの画面上に存在しています。
ここで右上の「実行ボタン」のクリックするとターミナルで実行されます。

このように、上に書いたプログラムの結果が、ターミナルの方に表示されます。
プログラムを書く上で、とても便利ですね!

③の配色はこんな感じです。

これは4例ですが、配色をダウンロードすることもできるので、膨大な数の配色を選択できます。
どうせやるなら気に入った配色でやるとテンション上がります!

便利な「VS code」ですが、これを使いこなすには「ショートカット」が欠かせません。

2.まず覚えるべきショートカット

まず前提としてVS codeには、大量のショートカットがあります
その中から、私が普段から多様する4つ+今回見つけた便利なショートカット1つを選んでみました。

他のソフトウェアで一般的なショートカット「Ctrl+C → コピー」や「Ctrl + s → セーブ」などは今回はパスします。

ショートカットでいろいろな事ができますが、「エディター」つまり「プログラムを書く」時につかうショートカットを選びました。

①:Tab および Shift + Tab

効果:インデントスペースを入れる、インデントスペースを消す。

いきなりですが、一般的なショートカットです。
というかショートカットに入れて良いかどうかも分かりません。
しかし、プログラミングをする上で極めて重要なので、まず1番に挙げました。
(shift + Tabはあんまり一般的じゃないので、良いですよね。)

いくつかポイントがあります。
複数行を選択することで、複数行一気にスペースを操作できる。
・Tab は設定により、いわゆる「タブ」の挿入になっている場合がある。

2つ目のTabの挙動が変わっている可能性もあるので、コレを覚えておいた方が良いかもしれません。
・『 Ctrl + ] 』→ インデントスペースを入れる = Tab
・『 Ctrl + [ 』→ インデントスペースを入れる = Shift + Tab

②:Alt + ↑ および Alt + ↓

効果:選択した行を上の行と入れ替え、選択した行を下の行と入れ替え

出力する順番を変えたいときってありますよね?
そんな時はこれです。

③:Home および End

効果:カーソルを行の先頭へ移動する、カーソルを行の最後へ移動する

画像では分かりにくいですが、現在のカーソル位置を先頭および最後に移動します。
コードを書く時は、行の先頭や最後を編集するときが多いので、便利です。

④:Shift +Alt + a

効果:複数行をコメントアウト、(再度押すと)複数行を通常表記に戻す

プログラムで重要なのが、「コメント」です。
「コメント」には、「プログラムの説明を記載する」という基本の役割に加えて、「コメント化することでプログラムを無効化する」という使い方も可能です。

例えば、上の右図では、「AAAA = 1、BBBB= 2、CCCC = 3」がプログラム上で無効になっており、print(AAAA)のようにしてもエラーとなります。
これをうまく使用すれば、既存のプログラムの一部を変更する場合などに役立てる事が出来ます。

⑤:Alt + F12

効果:関数の定義を表示

関数の定義・内容を表示します。
上の図では、random.choiceの中身を表示しています。
プログラミングをするとき、関数の書き方や引数を調べることがあると思います。
しかし、これを使えば関数を調べる必要がありません!!

3.ショートカットを作成しよう

ここまでは、既存のショートカットをピックアップしました。
さらにVS codeは独自のショートカットを設定することが出来ます。
いろいろできますが、設定した方が良いショートカットは、
ターミナルの実行
です

では設定していきましょう。
(※Pythonのターミナル実行の例です。他の言語では別の設定方法になります。)

手順①:設定ボタンをクリック

画面左下の歯車のマークをクリックします。

手順②:「キーボードショートカット」をクリック
手順③:検索欄に「terminal」と入力
手順④:ターミナルでPythonファイルを実行を探し、鉛筆マークの「編集ボタン」をクリック

手順⑤:好きなキーの組み合わせを入力してEnterを押す

ここまでです。

既存のショートカットがたくさんあるので、結構かぶってしまいます。
かぶっていた場合、アラートがでるのでいくつか試して良さそうなのを見つけます。
ちなみに私は、ターミナルの実行に「Shift + Ctrl + \(バックスラッシュ)」で設定しています。

これ、めちゃくちゃ捗るので設定してみてください!!

4.次に覚えるショートカット

では、さらに使った方が良いショートカットを見てみましょう。

①:Ctrl + p

効果:ファイル名を検索してファイルを開く

こんな画面が開きます。
開いた検索バーにファイル名を入力することで、ファイルを検索して開けます。

②:Shift + Ctrl + p

効果:コマンドパレットを開く

こんな画面が開きます。
これは「コマンドパレット」といって、動作を検索するバーです。
例えば、「Python」と入力すると、さまざまな動作がずら~っと出てきます。
ある意味、コマンドパレットさえ使いこなせれば、マウスはいらないかもしれません。

③:Ctrl + j

効果:下部パレットを表示、非表示

下部に表示されているターミナルは非常に便利ですが、長いコードを書いている時には邪魔になることもあります。
Ctrl + j を使えば、下部のパレットを表示・非表示にできます。

④:Ctrl + b

効果:サイドバーを表示、非表示

サイドバーでは、ファイル検索や文字列検索、拡張機能の検索などが出来ます。

⑤:Ctrl + home および Ctrl + End

効果:ファイルの先頭に移動する、ファイルの最後に移動する

Home / Endは行内の先頭 / 最後に移動するというショートカットでした。
これにCtrlキーを追加すると、ファイル全体の先頭(1行目)またはファイル全体の最後(最終行)に移動します。

全てのショートカット

全てのショートカットを知るには、ここの情報が最新かつ正確でしょう。
Visual Studio Codeの公式ショートカット集
というより、ショートカット以外の全ての情報がここにあるはずです。
(英語です・・・)

5.まとめ

今回は、Visual Studio Codeの魅力とショートカットのごくごくごく一部をまとめてみました。
実際には、多様なショートカットがあり、使いこなせればほぼマウスを使う必要なく何でもこなせれるのではないでしょうか。(多分、、、私はまだその域には程遠いです)

Let’s Visual Studio Coding

コメント

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