VSCode インターフェース説明
1、スタートページ
VSCode のインストールが完了したら、VSCode アイコンをクリックすると、起動画面は次のようになります：
上の図は Visual Studio Code（VS Code）のウェルカム画面を示しています。これはコードエディタのスタートページであり、さまざまな機能やリソースへのクイックアクセスを提供します。
以下は、画像内の各部分の説明です：
アクティビティバー（Activity Bar）：
- 左側にあり、複数のアイコンが含まれています。各アイコンは VS Code の機能ビューを表します。
- 画像では赤い矢印で4つの機能が示されています：
- ドキュメント管理：エクスプローラーを指す場合があり、ファイルやフォルダーを管理するために使用されます。
- 検索：ワークスペース全体でファイルやテキストを検索するために使用されます。
- バージョン管理：通常はGitと統合され、コードのバージョン管理に使用されます。
- デバッグ：デバッグセッションを開始し、コードのデバッグを行うために使用されます。
起動（Start）：
- アクティビティバーの上にあり、よく使う機能のショートカットが含まれています。
- 画像では赤い枠で3つのオプションが示されています：
- 新しいファイル：新しいファイルを作成します。
- 開く...：ファイルまたはフォルダーを開きます。
- コマンドの実行...：コマンドパレットを使用してコマンドを実行します。
最近開いたディレクトリ（最近）：
- 最近開いたフォルダーのリストが表示され、以前の作業ディレクトリにすばやく切り替えることができます。
- 画像では赤い枠で最近開いたディレクトリ（例："サンプル-test"）が示されています。
チュートリアル（Tutorial）：
- ウェルカム画面の右側にあり、ユーザーがVS Codeを理解して使用するのに役立つクイックリンクを提供します。
- 画像では赤い枠で3つのリンクが示されています：
- VS Code を使い始める：カスタマイズ方法とVS Code専用の使用方法についてのガイドを提供します。
- 基本知識を学ぶ：VS Code の基本知識へのリンクで、ユーザーが必須機能を理解するのに役立ちます。
- 作業効率を向上させる：VS Code の使用効率を向上させるためのアドバイスを提供します。
vscode ドキュメント：
- チュートリアル部分の上にあり、VS Code 公式ドキュメントへのリンクの可能性があります。
2、編集ページ
コードを開いたり編集したりする画面は次のようになります：
アクティビティバーとサイドバー
画面左側では、アイコンでさまざまな機能モジュールを切り替えます：
- エクスプローラー（最初のアイコン）：画像にはプロジェクトのファイル構造が表示されており、次のものが含まれます：
サンプル-TESTフォルダー：現在のワークスペースのプロジェクトフォルダー。test.htmlファイル：現在編集中の HTML ファイル。
- 検索（2番目のアイコン）：ファイル内容をグローバルに検索するために使用されます（未アクティブ）。
- ソースコード管理（3番目のアイコン）：Git の状態を表示し、コードのバージョン管理を容易にします。
- 実行とデバッグ（4番目のアイコン）：ブレークポイントを設定してコードを実行できます。
- 拡張機能（5番目のアイコン）：プラグインのインストールと管理に使用されます。
アクティビティバーのすぐ右側には、現在の機能モジュールの具体的な内容が表示されます：
- 現在表示されているのはエクスプローラー。
- プロジェクト構造が明確に表示され、次のものが含まれます：
サンプル-TESTフォルダー内のすべてのファイル。- 現在編集中のファイル
test.html。
編集エリア
画面の中央にあり、ファイルの内容を表示および編集するために使用されます：
- 編集エリアには
test.htmlファイルのコードが表示されます。 - 構文ハイライトをサポートします（例：
DOCTYPE htmlと<h1>タグ）。 - カーソルは11行目にあります（下部のステータスバーに「行 11」と表示されています）。
ステータスバー
下部にあり、現在のファイルと編集環境の情報を表示します：
- Git 状態：現在のブランチは
main（左下隅）。 - ファイル情報：
- エンコーディング形式：UTF-8。
- 改行コード：LF。
- 現在のファイルタイプ：HTML。
- ターミナル状態：現在開いているターミナルのタイプは
zsh。