Visual Studio Code ダウンロードページよりダウンロードします。→
すると、ダウンロードフォルダに VSCodeUserSetup-x64-1.***.*.exe がダウンロードされます。
インストールした状態では英語表示なので、日本語化などの設定をします。 参考サイト
　　 【VScode アイコン】

日本語化した VS Code をクリックするとすると、右図の様な初期画面(ウェルカムページ)が表示され、VSCode の使い方等も学習できます。

＊日本語化などの拡張機能は、拡張機能ボタン(Extensions) を押して、「Japanese Language Pack for VS Code」などの拡張機能を「Install」をクリックしてインストールし、再起動して有効にします。

①. アクティビティバー
　主に使用する機能アイコンを表示
②. サイドバー (表示制御可)
　選択したアクティビティバーの内容を表示
③. エディター
　ファイルの内容表示、作業する画面
④. パネル (表示制御可)
　警告やエラー内容、デバック情報などを表示
⑤. ステータスバー
　文字コードなどのファイル情報を表示

VSCode エディタとしても多機能なエディタです。詳細は、参考１ 　参考２などをご参考に。

① 拡張機能アイコンから Live Serverを探して、Live Server をインストールし、再起動すると Live Serverを利用できます。→
② Live Serverが利用できる状態で、VScode を起動すると右下に「Go Live」が表示され、ライブリロードが利用可能となります。参考→
③ VScode を起動したら、「フォルダーを開く」でフォルダー開き、「ファイルを開く」などでファイルを開きます。
④ ライブリロードが可能となると、「Go Live」の表示は「port : 5500」等のポート表示に変ります。 　参考サイト

① HTML ファイルを編集中に「Go Live」をクリックすると、「127.0.0.1:5500/」でページが開き、ライブリロードが可能となります。参考→
② この状態で HTML を編集・保存すると、自動的にブラウザ表示も新ページを表示します
③ 右下の「port : 5500」ボタンを押すと、ライブリロードは終了し、「Go Live」表示に戻り、「127.0.0.1」ページでは、ブラウザ表示出来なくなります。
④ また編集ファイル内で右クリックすると制御窓が開くので、そこで「Open with Live Server」や「Stop Live Server」を押すと、それぞれ「Go Live」や「port : 5500」ボタンを押すのと同じ動作をします。

① 事前に XAMPPをインストールしておきます。
② 拡張機能アイコンから 「PHP Server」を探して、PHP Server をインストールします。→
③ さらに拡張機能アイコンから 「PHP Intelephense」を探して、インストールしておきます。→
④ 再起動すると PHP Server と PHP Intelephense も利用できるようになります。→
⑤ path が通っていれば、PHP ファイルを選択すると、右上に青いPHP アイコンが表示され、これをクリックすると、PHP ファイルが表示されます。→

① さらに、インストール済みの XAMPPを駆動するために、path を設定しておきます。
② 左のアクティビティバー下方の設定アイコンをクリックし、→「設定」→「PHP Server configuration」→「PHP Path」で path を指定します。参考 →
③ path が正しく設定されていないと、「PHP not found」と表示されることがあります。

① http://localhost:3000 がローカルサーバーのアドレスとなります。
③ ファイル内で右クリックするとPHP Server: Stop server などの制御窓が出て来るので、それによりサーバーの開閉が出来ます。 →
③ 参考サイト