公式サイトから「Download for Windows」をクリックすると、セットアップウィザードが開くので、手順に従ってインストールしていけばOKです。インストールの途中で細かい設定をする箇所がありますが、そのままの設定で「次へ」をクリックしていってください。インストールが完了すると、Visual Studio Codeが自動的に起動するので、レッスンどおりに進めていきましょう。

動画内ではmacOSを使っているので、Windowsをお使いの方はフォルダの作成方法が異なります。Windowsマシンでレッスンと同じように進めたい場合は、次のようにしてフォルダを作成してください。

• VS Codeで「Open Folder」とする
• エクスプローラーが開くので「デスクトップ」を選択する
• フォルダやファイルではないところで、右クリックする
• 「新規作成」をクリック
• 「フォルダー」をクリック

Visual Studio Codeの動作確認を行いながら、Web系の開発を進めていく手順についてもみていきます。
HTMLの基本については、以下のレッスンを参照してみてください。

• 詳解HTML 基礎文法編
  https://dotinstall.com/lessons/basic_html_tags

VS CodeのVersion: 1.69.0以降にて「!」によるHTMLの雛形が入力できなくなったようです。かわりに「html:5」と打ってからタブキーで入力するようにしてください。

Emmet記法については以下のレッスンで詳しく解説しています。
興味がある方は参照してみてください。

• Emmet入門
  https://dotinstall.com/lessons/basic_emmet_v3

動画内で紹介されている操作ですが、Windowsでは次のショートカットキーをご利用ください。

• リンク先に飛ぶ → Ctrl + Click
• サイドバーを閉じる → Ctrl + B

CSS, JavaScriptの基本については、以下のレッスンを参照してみてください。

• 詳解CSS 基礎文法編
  https://dotinstall.com/lessons/basic_css_styles

• 詳解JavaScript 基礎文法編
  https://dotinstall.com/lessons/basic_javascript_grammer

• 詳解JavaScript DOM編
  https://dotinstall.com/lessons/basic_javascript_dom

動画内で紹介されている操作ですが、Windowsでは次のショートカットキーをご利用ください。

• コメントにする → Ctrl + /

VS Codeのバージョンアップにより、index.htmlのタブをブラウザへドラッグ＆ドロップできなくなったようです。代替手段として、下図のようにサイドバーにてファイル一覧を開き、そこからドラッグ＆ドロップするようにしてください。

それでもうまくいかない場合は、Chromeブラウザを選択した状態で、WindowsならCtrlキー、macOSならcommandキーを押しながら、英語のoキーを押すと、ファイルを選択できるようになります。そこからファイルを開いても OK です。

動画内で紹介している内容がWindowsだと少々異なるので、以下にまとめました。

• 設定画面を開く → SettingsはFileメニューの中にあります
• Font Size → デフォルトでFont Sizeが14なので変更が不要です

動画内で紹介されている操作ですが、Windowsでは次のショートカットキーをご利用ください。

• コマンドパレットを開く → Ctrl + Shift + P

動画内で紹介されている操作ですが、Windowsでは次のショートカットキーをご利用ください。

• 行の移動 → Alt + 上下矢印
• 行の複製 → Shift + Alt + 上下矢印
• 次の行を挿入 → Ctrl + Enter
• 前の行を挿入 → Shift + Ctrl + Enter

動画内で紹介されている操作ですが、Windowsでは次のショートカットキーをご利用ください。

• クリックした箇所にカーソルを増やす → Alt + Click
• 同じ単語を選択する → Ctrl + D
• 同じ単語をいっきに選択する → Ctrl + Shift + L
• カーソルを垂直方向に増やす → Ctrl + Alt + 上下矢印

動画内で紹介されている操作ですが、Windowsでは次のショートカットキーをご利用ください。

• ファイル内での検索 → Ctrl + F
• 次の検索結果に移動 → F3
• 前の検索結果に移動 → Shift + F3
• ファイル内での置換 → Ctrl + H