やっはろー
みんなは、コードを書くとき何のエディターを使っていますかー?
僕は、Visual Studio Code(VSコード)を使用してます!
使っていけば早く描ける様になりますが、より便利にエディターを活用する為に今回は、良く使用するショートカットキーを紹介していくよ。


MacとWindows両方とも紹介してくださいね!VSコードのインストールをしていない人は、こちらからインストールして使ってみてね!インストールや使用は無料だから安心して!
-
-
Contents
おすすめエディタ!Visual Studio Code の基本設定 : Mac版
続きを見る
ショートカットキー一覧(Mac版)
まずは、Mac版のコードを書く時によく使う、使えるショートカットキーの紹介です。身につける事でコードが効率的に早く書く事ができます。文字で説明するより表で見た方が分かりやすく、確認が早いと思うので、下記で一覧にて記載します。
基本操作のショートカットキー
| キー | 動作 |
|---|---|
| command + N | 新規ファイルを開く |
| command + S | ファイルの保存 |
| command + (+) | 表示画面のズームイン |
| command + (-) | 表示画面のズームアウト |
| command + F | 検索 |
| command + shift + P | コマンドパレットを開く |
テキスト編集と選択のショートカットキー
| キー | 動作 |
|---|---|
| command + X | 行の切り取り |
| command + C | 行のコピー |
| command + V | ペースト(貼り付け) |
| shift + command + K | カーソルを合わせている行の削除 |
| command + Z | 一つ前に戻る |
| option + ↑ | カーソルを合わせている行を上に移動 |
| option + ↓ | カーソルを合わせている行を下に移動 |
| option + shift + ↑ | カーソルを合わせている行を上に複製 |
| option + shift + ↓ | カーソルを合わせている行を下に複製 |
| command + D | 選択している文字と 次にくる同じ文字が選択される ※複数回押す事が可能。選択文字を変えると選択した箇所全て変わる |
| command + shift + L | 選択している文字と同じ文字が全て選択される ※複数回押す事が可能。選択文字を変えると選択した箇所全て変わる |
| command + / | 選択位置のコメントアウト |
| command + A | 全選択 |
| shift + カーソル(↑・↓・←・→) | カーソル移動時に選択 |
| shift + Home | 行の最後までを選択 |
| shift + End | 行の最初までを選択 |
| command + shift + ↑ | カーソル位置より上を全選択 |
| command + shift + ↓ | カーソル位置より下を全選択 |
| shift + option + F | コードをきれいに整える |
ショートカットキー一覧(Windows版)
次はWindows版です。Mac版と同じ様に記載していきますので、手早く確認していきましょう。
基本操作のショートカットキー
| キー | 動作 |
|---|---|
| Ctrl + N | 新規ファイルを開く |
| Ctrl + S | ファイルの保存 |
| Ctrl + (+) | 表示画面のズームイン |
| Ctrl+ (-) | 表示画面のズームアウト |
| Ctrl + F | 検索 |
| F11 | フルスクリーン表示 |
| Ctrl + shift + p | コマンドパレットを開く |
テキスト編集と選択のショートカットキー
| キー | 動作 |
|---|---|
| Ctrl + X | 行の切り取り |
| Ctrl + C | 行のコピー |
| Ctrl + V | ペースト(貼り付け) |
| shift + Ctrl + K | カーソルを合わせている行の削除 |
| Ctrl + Z | 一つ前に戻る |
| Alt + ↑ | カーソルを合わせている行を上に移動 |
| Alt + ↓ | カーソルを合わせている行を下に移動 |
| Alt + shift + ↑ | カーソルを合わせている行を上に複製 |
| oAlt + shift + ↓ | カーソルを合わせている行を下に複製 |
| Ctrl + / | 選択位置のコメントアウト |
| Ctrl + A | 全選択 |
| shift + カーソル(↑・↓・←・→) | カーソル移動時に選択 |
| shift + Home | 行の最後までを選択 |
| shift + End | 行の最初までを選択 |
| Ctrl + shift + ↑ | カーソル位置より上を全選択 |
| Ctrl + shift + ↓ | カーソル位置より下を全選択 |
| shift + Alt + F | コードをきれいに整える |
ショートカットキーのカスタマイズ方法
最後にショートカットキーを自分好みにカスタムする方法も記載しておきます。既存のショートカットではなく自分にあったショートカットキーを設定する事でより早く、より使いやすくなると思います。
- 手順.1 command + shift + P でコマンドパレットを開く
- 手順.2 Key と入力する
- 手順.3 Preferences: Open Keyboard Shortcuts を選択する
※この時Preferences: Open Keyboard Shortcuts(JSON)も出てくるがこちらは選びません。 - 手順.4 変更したいショートカットキーまたは追加したいショートカットを検索
- 手順.5 検索結果が出てきたら、検索結果左側の鉛筆マークをクリック
- 手順.6 ショートカットキーに設定したいキーを入力してEnterキーを押すと完了
簡単な箇条書きになりましたが、何も難しいことはありません!上記手順にて進めればショートカットキーを変更する事が可能です。
まとめ
今回は、VSコードのショートカットキーを紹介したのですが、エディタには他にもたくさんの便利な機能がたくさんあります。全てをしっかり使いこなすのはとても難しいです。まずは、ショートカットを身につけてコードを早く、丁寧に描ける様にして、そこから色々な機能を試していくのが最善の道かと思います。