本記事ではPythonでVSCodeを使う方法を紹介します。
VSCodeについて
本記事ではVSCodeの基本的な操作について解説します。
この記事を見れば、VSCodeの基本的な操作や機能、仕組みについて網羅的に習得することができます。
ダウンロード
こちらのダウンロードサイトにアクセスして手持ちのPCのOSに合ったインストーラーをダウンロードします。
インストール
続いて、インストールです。
- Step.1インストール前に使用許諾契約書の同意を求められるので、同意するを選び次へをクリックします。
- Step.2インストール設定の選択を求められますが、基本的にはデフォルトのままで問題ありません。
- Step.3インストール準備が完了したらインストールをクリックします
- Step.4インストールが完了しました
Explorer
続いて、左端のバーのアイコンについて解説してゆきます。
まずは一番上のExplorerです。
WORKING
- Step.1Open Folderをクリックしてファイル編集を行う作業フォルダを適当に選択します。
- Step.2選択したフォルダ内のファイルが左のWORKINGの中に表示されます。
OUTLINE
その下のOUTLINEの中には現在開いているファイルのアウトラインが表示されています。 
Pythonファイルの場合はファイル内のクラス名とメソッド名が表示されます。
クラス名かメソッド名をクリックすると、それらを定義している箇所にカーソルが遷移します。
Pythonファイルの場合はファイル内のクラス名とメソッド名が表示されます。
クラス名かメソッド名をクリックすると、それらを定義している箇所にカーソルが遷移します。
アウトラインを表示させるためにはPythonプラグインをインストールしておく必要があります。（後ほど解説）
TIMELINE
TIMELINEから編集の履歴を確認することができます。
ひとつ前のタイムラインをクリックすると変更差分を確認することができます。
その他のサイドバーアイコン
EXPLORER以外のサイドバーアイコンについての概略を解説しておきます。
検索
上から二番目のアイコンは検索画面です。検索欄に文字列を入力することで文字列を検索できます。
バージョン管理
上から３番目のアイコンをクリックするとバージョン管理についての画面が表示されます。
デバッグ
上から四番目のアイコンはデバッグ画面です。
拡張機能
上から五番目のアイコンは拡張機能です。ここからプラグインを自由に追加できます。
以上の五つがデフォルトでvscodeに備わっているアイコンです。そのほかにも拡張機能を追加することで表示されるアイコンもあります。
サイドバーの設定変更
アイコンの非表示
右クリックからチェック付きの項目を選びます。
サイドバーの位置変更
サイドバーは位置変更することもできます。
右クリックからMove Primary Side Bar Rightをクリックします。
サイドバーの非表示
サイドバーが不要なら非表示にすることもできます。
上のバーのViewからAppearanceを選び、Activity Bar PositionのHiddenを選択します。
アカウント機能
また、サイドバーの一番下から二番目のアイコンにはアカウント機能のアイコンがあります。
アカウントを作成してログインすれば異なる端末間でvscodeの設定を同期することができます。
設定機能について
テーマの変更
サイドバーの一番下は設定アイコンです。
設定アイコンからはテーマの変更ができます。
ThemesからColor Themeをクリックすると、
テーマの一覧が表示されるので好きなものを選びます。
すると、テーマが変更されます。
設定エディタ
設定アイコンからSettingsを選択すると設定画面が表示されます。ここからvscodeの設定を変更できます。
フォルダの作成
続いてフォルダの作成です。
EXPLORERのWORKINGタブの左から二番目のアイコンをクリックします。
適当なフォルダ名を入力してエンターを押すとフォルダが作成されます。
ファイル作成、拡張子について
ファイル作成
右クリックからNew Fileを選びます。
そして適当なファイル名を入力します。
するとファイルが作成されます。
拡張子について
今度は拡張子を.pyにしたうえでファイルを作成します。
すると拡張子から自動的にpythonファイルとして検知されます。
ファイルの保存
ファイルの上書き保存
上のバーのFileからSaveをクリックすると、ファイルを上書き保存できます。
名前を付けて保存
また、FileからSave Asを選ぶと別名でファイルを保存できます。
自動保存について
FileからAuto Saveを選択すると、ファイルを編集した場合に自動的にファイルが保存されるようになります。
パネルについて
左下の罰点の部分をクリックすると現在、vscode上で生じている問題について確認できます。
コーディングミスなどがあればここに表示されます。
下のステータスバー
行、列について
下のステータスバーには現在当たっているカーソルの行と列が表示されます。
ここをクリックすると、行数を入力できるようになります。
インデントの設定
下のステータスバーには現在のインデントの設定が表示されています。
ここをクリックすると、インデントの設定を変更できます。
試しにスペースを選んで８を選びます。
するとインデントがスペース８つに設定されます。
フィードバックについて
vscode側から何らかの通知がある場合、右下のベルをクリックすることで通知が表示されます。
ステータスバーの表示、非表示
ステータスバーの非表示
ステータスバーは右クリックからHide Status Barで非表示にすることもできます。
ステータスバーの表示
非表示にしたステータスバーは上のバーのVIew、Appearance、Status Barをクリックすることで再度表示させることができます。
検索（ファイル内、フォルダ内）
Ctrl+Fで検索欄が表示されるので文字を入力すると検索が行えます。
サイドバーの虫メガネアイコンをクリックし、検索欄に文字を入力するとフォルダ内全体を検索できます。
置換について
先程はCtrl+Fで検索を行いました。
検索欄の左の矢印をクリックすると置換が行えます。
VSCodeの終了
FileからExitを選ぶとvscodeを終了できます。
ショートカット
ここでは良く使うショートカットを紹介します。
| 動作 | ショートカットキー |
| カット | Ctrl+X |
| ペースト | Ctrl+V |
| コピー | Ctrl+C |
| ファイル内検索 | Ctrl+F |
| ファイル内置換 | Ctrl+H |
| フォルダ内検索 | Ctrl+Shift+F |
| フォルダ内置換 | Ctrl+Shift+H |
| コメントアウト・コメントアウトを解除 | Ctrl+/ |
| ブロックコメントアウト・ブロックコメントアウトの解除 | Shift+Alt+A |
| 全選択 | Ctrl+A |
| 上または下に現在の行をコピー | Shift+Alt+上キーまたは下キー |
| 現在の行を上または下の行と入れ替える | Alt+上キーまたは下キー |
