演習 - Visual Studio Code のユーザー インターフェイスについて詳しく調べる
Visual Studio Code には、始めたばかりの開発者向けのツールが用意されていますが、プロの開発者にとっては十分に拡張可能で高度です。
この演習では、Visual Studio Code を開き、ユーザー インターフェイスのクイック ツアーを完了します。
Visual Studio Code を開き、[ようこそ] ページを確認する
Windows の [スタート] メニューを使用して Visual Studio Code を開きます。
Windows の [スタート] メニューを開くと、最近追加されたアプリケーションとして Visual Studio Code が一覧表示されます。 下にスクロールして Visual Studio Code を見つけることもできます。
もう 1 つのオプションは、画面の下部にある起動トレイの Windows 検索ボックスに Visual Studio Code を入力することです。
Visual Studio Code が開き、一部のリンクやその他の情報を含む "ようこそ" ページが開きます。
Visual Studio Code を初めて開くと、[ようこそ] ページには、 VS Code の概要 コンテンツなどの便利なチュートリアルが表示されます。 この情報は、別の時間に確認できます。
[ようこそ] ページを閉じるには、[閉じる] ボタン (インターフェイスに X として表示) を選択します。
エディターで開いている各ページには、ページ タイトルの右側にある [閉じる] ボタン (X) が含まれています。 [ ようこそ ] ページ タブは、Visual Studio Code ウィンドウの左上のメイン メニューの下に表示されます。 マウス ポインターを X の上に置くと、[ 閉じる ] という単語が表示されます。
アクティビティ バーとサイド バーを調べる
アクティビティ バーの右側にあるサイド バーが折りたたまれていることがわかります。
アクティビティ バーは、Visual Studio Code ウィンドウの左端にあるアイコンの垂直リストであることを思い出してください。 サイド バーの内容は、アクティビティ バーから現在選択されている内容によって異なります。
アクティビティ バーの上にマウス ポインターを置き、各アイコンの上にマウス ポインターを置いてラベルを表示します。
アイコンの上にマウス ポインターを置くと、ラベルが表示されます。 次の図に、アクティビティ バーのボタンが表示されます。
上から下のアクティビティ バーのアイコンは、 エクスプローラー、 検索、 ソース管理、 実行とデバッグ、 拡張機能、 アカウント、 管理です。
アクティビティ バーで、[エクスプローラー] を選択します。
サイド バーが開き、コンテキスト情報が表示されます。
サイド バーに EXPLORER というラベルが付けられます。
エクスプローラー ビューは、プロジェクト フォルダーとコード ファイルにアクセス/探索するために使用されます。
Visual Studio Code では、作業履歴が記憶され、開いたときに最新のプロジェクト ファイルが開きます。 Visual Studio Code を初めて開いたので、プロジェクト フォルダーは開かなくなります。
アクティビティ バーで、[拡張機能] を選択します。
サイド バーに EXTENSIONS というラベルが付けられます。
EXTENSIONS ビューに表示される情報を少し調べます。
Visual Studio Code 拡張機能を使用すると、開発ワークフローをサポートするために、コーディング言語、デバッガー、およびその他のツールを環境に追加できます。 このモジュールの後半で C# 拡張機能をインストールします。
アクティビティ バーで、[拡張機能] サイド バーを閉じるには、[拡張機能] を選択します。
上部のメニュー オプションを確認する
[ファイル] メニューオプションを表示するには、[ファイル] を選択 します。
[ファイル] メニューに表示されている [新規]、[開く]、[保存]、および [閉じる] オプションに注目してください。
少し時間を取って [編集] メニュー オプションを調べ、その後、他の各最上位メニュー項目を確認します。
いくつかのメニューには、コードを操作するためのオプションが含まれています。
例えば次が挙げられます。
- [編集] メニューには、コード コメントの検索、置換、切り替え、および標準の切り取り、コピー、貼り付け、元に戻す、やり直しのオプションが含まれています。
- [選択] メニューには、コード行を選択および操作するためのオプションが含まれています。
- [実行] メニューには、アプリケーションを実行およびデバッグするためのオプションが含まれています。
[ ターミナル ] メニューの [ 新しいターミナル] を選択します。
ターミナル パネルの内容を調べるのに少し時間がかかります。
タブ (PROBLEMS、OUTPUT、DEBUG CONSOLE、TERMINAL) を切り替えて、ボタンの上にマウス ポインターを置くと (右上)、ボタン ラベルが表示されます。
ターミナル パネルにコマンド プロンプトが含まれていることに注意してください。
ターミナル パネルを使用して、コマンド ライン インターフェイス (CLI) コマンドを実行できます。 このモジュールでは、後で .NET CLI コマンドを使用します。
[ターミナル] パネルの右上隅にある [ X ] (パネルを閉じる) を選択します。
[表示] メニューの [コマンド パレット] を選択します。
コマンド パレットを使用すると、あらゆる種類の便利なコマンドを検索して実行できます。 ここでそれらを詳しく調べる時間 (または必要) はありませんが、コマンド パレットを見つける場所を把握することをお勧めします。
コマンド パレット プロンプトで、「extensions」と入力します。
コマンドの一覧がエントリに基づいてフィルター処理されていることに注意してください。
フィルター処理されたコマンドの一覧を更新するには、拡張機能を変更してヘルプを表示します。
コマンド オプションの一覧から、[ ヘルプ: 対話型エディタープレイグラウンド] を選択します。
エディターで開く Editor Playground ドキュメントには、対話型アクティビティの一覧が含まれています。
対話型アクティビティの箇条書きリストから、[ 書式設定] を選択します。
書式設定オプションについては、1 分間お読みください。
C# プログラミングの詳細については、アクティビティ中にコード書式設定コマンドを使用します。
Editor Playground ドキュメントを閉じます。
これで、Visual Studio Code ユーザー インターフェイスのツアーが完了します。 コーディングを開始すると、トレーニング資料では、Visual Studio Code が生産性を向上させる方法を引き続き指摘します。