Update description of installation in get-started

docs/1-trial-session/01-get-started/index.md

@@ -2,17 +2,52 @@
 title: はじめての Web 開発
 ---
 
-import installVscodeVideo from "./install-vscode.mp4";
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
+import installChromeOnMacVideo from "./install-chrome-on-mac.mp4";
+import installChromeOnWindowsVideo from "./install-chrome-on-windows.mp4";
+import installVscodeOnMacVideo from "./install-vscode-on-mac.mp4";
+import installVscodeOnWindowsVideo from "./install-vscode-on-windows.mp4";
 import createFolderVideo from "./create-folder.mp4";
 import openFolderVideo from "./open-folder.mp4";
 
+## Google Chrome のインストール
+
+**Google Chrome** は、Google 社が開発するウェブブラウザです。現在多くの人に使われています。他のウェブブラウザを使うことも出来ますが、この教材では Google Chrome の使用を前提として話を進めていきます。
+
+Google Chrome は、[公式サイト](https://www.google.com/intl/ja_jp/chrome/)からインストールできます。まだインストールが終わっていない場合はインストールしておきましょう。
+
+<Tabs groupId="os">
+  <TabItem value="mac" label="macOS">
+
+<video src={installChromeOnMacVideo} controls />
+
+  </TabItem>
+  <TabItem value="win" label="Windows">
+
+<video src={installChromeOnWindowsVideo} controls />
+
+  </TabItem>
+</Tabs>
+
 ## Visual Studio Code のインストール
 
 **Visual Studio Code** (以下 VS Code) は、Microsoft 社が開発するテキストエディタです。多くの開発者に使用されています。
 
 Visual Studio Code は、[公式サイト](https://code.visualstudio.com)からインストールできます。まだインストールが終わっていない場合はインストールしておきましょう。
 
-<video src={installVscodeVideo} controls />
+<Tabs groupId="os">
+  <TabItem value="mac" label="macOS">
+
+<video src={installVscodeOnMacVideo} controls />
+
+  </TabItem>
+  <TabItem value="win" label="Windows">
+
+<video src={installVscodeOnWindowsVideo} controls />
+
+  </TabItem>
+</Tabs>
 
 ## プロジェクトを格納するフォルダを作成する