インストール直後の最初にやるべきこと¶
VS Code をインストールして、まずは普通の Windows アプリケーションと同様に実行する。
Attention
Visual Studio Code 利用ノート 冒頭の前提条件に留意すること。
公式文書群に目を通す¶
ブラウザーで Documentation for Visual Studio Code 以下にある文書群すべてを閲覧するのがいいだろう。画面左側の列に見出しがあるが、そのうち次のものは絶対に一読するべきだ。
- Overview
特に Intro Videos は全編視聴するといい。言葉だけの説明では伝わらない部分を映像で補うことができる。
- SETUP
なにはさておき VS Code を利用可能な状態に持っていかねばならない。
- GET STARTED
VS Code にまつわる基本的な用語をまずは習得する。
- USER GUIDE
一読だけではなく、後で何度もここに戻ってくる。
- SOURCE CONTROL
Git を念頭に置くことになるが、バージョン管理システムとの連携を理解する。
- TERMINAL
内蔵端末の特徴を知っておく。
なお、本ノートはこの構成に可能な限り則って VS Code の諸要素について述べていく。
Get Started にある一連の課題を消化する¶
VS Code メインメニューの を開く。使い始めの頃は Welcome ページの右側に Walkthroughs というものが出てくる。これらのチュートリアルを一つ一つ愚直に消化することで VS Code 上の作業を体に覚え込ませる。あとで拡張機能をインストールするときに、ここに Walkthrough が追加されることもある。
また、 を開いて、VS Code の特徴的な編集機能各種を説明とテキストフィールドで体感する。これを利用して、次の機能を会得する：
- マルチカーソル編集
ブロック選択、出現箇所全選択、カーソル追加などを試せる。
- IntelliSense
編集中のコードと外部モジュールに対する、コード支援と引数の提案をする機能である IntelliSense を試せる。
- 行アクション
行を素速く移動して、コードの並び替えを行うチュートリアルだ。
- リネームリファクタリング
コードベース全体のシンボルの名前を高速に変更することができることを知る。
- 整形
ドキュメントまたは選択に対する整形コマンドを習得する。
- コード折りたたみ
他の部分を折りたたんで、コードの最も関連性の高い部分に焦点を当てたいときに使える。
- エラーと警告
編集中にエラーと警告を表示する。
- スニペット
スニペットと呼ばれるコード片を使って編集時間を短縮する。
- Emmet
Emmet というコード補完機能の支援により、HTML/CSS 編集能力を次の水準へ引き上げる。
- JavaScript 型チェック
TypeScript を使用して JavaScript ファイルの型チェックを設定なしで実行する。
UI 言語を英語に固定する¶
理由、手順については ロケール を参照。
拡張機能をインストールする¶
別項 に記す。
