「はじめてのWeb開発」の節を改訂

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

@@ -11,11 +11,13 @@ import createFolderOnMacVideo from "./create-folder-on-mac.mp4";
 import openFolderOnWindowsVideo from "./open-folder-on-windows.mp4";
 import openFolderOnMacVideo from "./open-folder-on-mac.mp4";
 
+Web開発を始めるには、いくつかのアプリケーションが必要です。学習を始めていく前に、これらのアプリケーションを準備しましょう。
+
 ## Google Chromeのインストール
 
-**Google Chrome**は、Google社が開発するウェブブラウザです。現在多くの人に使われています。他のウェブブラウザを使うことも出来ますが、この教材ではGoogle Chromeの使用を前提として話を進めていきます。
+[[**Google Chrome**]]は、Google社が開発する[[ウェブブラウザ]]です。多くのユーザーに利用されています。他の[[ウェブブラウザ]]を使うこともできますが、この教材では[[Google Chrome]]の使用を前提として話を進めていきます。
 
-Google Chromeは、[公式サイト](https://www.google.com/intl/ja_jp/chrome/)からインストールできます。まだインストールが終わっていない場合はインストールしておきましょう。
+[[Google Chrome]]は、[公式サイト](https://www.google.com/intl/ja_jp/chrome/)からインストールできます。公式サイトの指示に従ってインストールを行ってください。
 
 <Tabs groupId="os">
   <TabItem value="win" label="Windows">
@@ -28,9 +30,9 @@ Google Chromeは、[公式サイト](https://www.google.com/intl/ja_jp/chrome/)
 
 ## Visual Studio Codeのインストール
 
-**Visual Studio Code** (以下VS Code) は、Microsoft社が開発するテキストエディタです。多くの開発者に使用されています。
+[[**Visual Studio Code**]]（以下VS Code）は、Microsoft社が開発する[[コードエディタ]]です。多くの開発者に利用されています。
 
-Visual Studio Codeは、[公式サイト](https://code.visualstudio.com)からインストールできます。まだインストールが終わっていない場合はインストールしておきましょう。
+[[VS Code]]は、[公式サイト](https://code.visualstudio.com/)からインストールできます。公式サイトの指示に従ってインストールを行ってください。
 
 <Tabs groupId="os">
   <TabItem value="win" label="Windows">
@@ -43,28 +45,42 @@ Visual Studio Codeは、[公式サイト](https://code.visualstudio.com)から
 
 ## プロジェクトを格納するフォルダを作成する
 
-これから皆さんはたくさんのプログラムを書いていくことになります。プログラムは他のファイルと扱い方がかなり異なるので、専用のフォルダを作っておきましょう。ユーザーフォルダ (Windows) /ホームフォルダ (macOS) の中に`projects`という名前のフォルダを作り、その中にプロジェクトごとのフォルダを作っていくと良いです。ユーザーフォルダ (Windows) /ホームフォルダ (macOS) の場所については次の動画をご確認ください。
-
-次の例では、`hello-world`の名前でプロジェクト用のフォルダを作成しています。
-
 <Tabs groupId="os">
   <TabItem value="win" label="Windows">
+
+    これから皆さんはたくさんのプログラムを書いていくことになります。プログラムは他のファイルと扱い方がかなり異なるので、専用のフォルダを作っておきましょう。ユーザーフォルダの中に、`projects`という名前のフォルダを作り、その中にプロジェクトごとのフォルダを作っていくと良いです。
+
+    次の動画に従って、ユーザーフォルダの中に`projects`フォルダを作成し、その中に`hello-world`の名前でプロジェクトを格納するフォルダを作成してください。
+
     <video src={createFolderOnWindowsVideo} controls />
+
+    :::warning
+
+    これ以降作成するプロジェクトを格納するフォルダは、必ず先ほど作成した`projects`フォルダの中に作成するようにしてください。これは、ドキュメントフォルダなどのフォルダはOneDriveなどのクラウドストレージサービスによって自動的に同期されることがあり、[[VS Code]]などの開発ツールが期待通りに動作しなくなってしまうからです。
+
+    :::
+
   </TabItem>
   <TabItem value="mac" label="macOS">
+
+    これから皆さんはたくさんのプログラムを書いていくことになります。プログラムは他のファイルと扱い方がかなり異なるので、専用のフォルダを作っておきましょう。ホームフォルダの中に、`projects`という名前のフォルダを作り、その中にプロジェクトごとのフォルダを作っていくと良いです。
+
+    次の動画に従って、ホームフォルダの中に`projects`フォルダを作成し、その中に`hello-world`の名前でプロジェクトを格納するフォルダを作成してください。
+
     <video src={createFolderOnMacVideo} controls />
-  </TabItem>
-</Tabs>
 
-:::info
+    :::warning
 
-これから作成するプログラムは、さきほど作成したユーザーフォルダ (Windows) /ホームフォルダ (macOS) の中の`projects`フォルダの中に保存するようにしてください。これは、ドキュメントフォルダなどのフォルダはクラウドストレージサービスによって自動的に同期されることがあり、Visual Studio Codeなどの開発ツールが期待通りに動作しなくなってしまうことがあるからです。
+    これ以降作成するプロジェクトを格納するフォルダは、必ず先ほど作成した`projects`フォルダの中に作成するようにしてください。これは、ドキュメントフォルダなどのフォルダはiCloudなどのクラウドストレージサービスによって自動的に同期されることがあり、[[VS Code]]などの開発ツールが期待通りに動作しなくなってしまうからです。
 
-:::
+    :::
+
+  </TabItem>
+</Tabs>
 
-## Visual Studio Codeでプロジェクトフォルダを開く
+## VS Codeでプロジェクトを格納するフォルダを開く
 
-`File`メニューから`Open Folder...`をクリックして、先ほど作成したフォルダをVS Codeで開きます。
+先ほど作成した`hello-world`フォルダを[[VS Code]]で開くには、**File > Open Folder...** を選択します。
 
 <Tabs groupId="os">
   <TabItem value="win" label="Windows">
@@ -77,6 +93,6 @@ Visual Studio Codeは、[公式サイト](https://code.visualstudio.com)から
 
 :::info
 
-最初にフォルダを開いたとき、`Do you trust the authors of the files in this folder?`と聞かれるのは、インターネットからダウンロードした悪意のあるフォルダをVS Codeで開いたとき、VS Codeによって勝手に実行されてしまうのを防ぐためです。自分で作成したフォルダの場合は問題ありません。
+最初にフォルダを開いたとき、`Do you trust the authors of the files in this folder?`と聞かれるのは、インターネットからダウンロードした悪意のあるフォルダを[[VS Code]]で開いたとき、[[VS Code]]によって勝手に実行されてしまうのを防ぐためです。自分で作成したフォルダの場合は問題ないので、`Yes, I trust the authors`を選択してください。
 
 :::

docs/1-trial-session/04-javascript/index.mdx

@@ -4,16 +4,15 @@ title: JavaScriptことはじめ
 
 import helloWorldByJavascriptVideo from "./hello-world-by-javascript.mp4";
 
-## <Term>JavaScript</Term>
+## JavaScript
 
-{/* prettier-ignore */}
-<Term>HTML</Term>がウェブサイトの構造を表す言語だとすれば、<Term>**JavaScript**</Term>はウェブサイトに振る舞いを与える言語といえます。ブラウザさえあれば環境に関係なく同じように実行可能な、強力なプログラミング言語です。
+[[HTML]]がウェブサイトの構造を表す言語だとすれば、[[**JavaScript**]]はウェブサイトに振る舞いを与える言語といえます。ブラウザさえあれば環境に関係なく同じように実行可能な、強力なプログラミング言語です。
 
 ![Web開発で用いられる言語](../02-html/web-development-languages.drawio.svg)
 
-## <Term>JavaScript</Term>でHello World!
+## JavaScriptでHello World!
 
-プログラミングの世界では、まず画面に`Hello World!`と表示させることが慣例になっています。<Term>JavaScript</Term>を用いて画面に`Hello World!`を表示してみましょう。
+プログラミングの世界では、まず画面に`Hello World!`と表示させることが慣例になっています。[[JavaScript]]を用いて画面に`Hello World!`を表示してみましょう。
 
 まずは、`index.html`を次のように書き換えます。
 
@@ -40,26 +39,25 @@ document.write("Hello World!");
 
 <video src={helloWorldByJavascriptVideo} controls />
 
-## <Term>JavaScript</Term>が動く仕組み
+## JavaScriptが動く仕組み
 
-<Term>HTML</Term>ファイルの中に、以下のような記述があります。
+[[HTML]]ファイルの中に、以下のような記述があります。
 
 ```html title="index.html"
 <script src="./script.js"></script>
 ```
 
-まず、この記述によって、`script.js`ファイルがブラウザによって読み込まれます。この`script.js`に記述されているのが<Term>JavaScript</Term>です。
+まず、この記述によって、`script.js`ファイルがブラウザによって読み込まれます。この`script.js`に記述されているのが[[JavaScript]]です。
 
 :::info
 
-この講座の中では、`script`<Term>要素</Term>を常に **`body`<Term>要素</Term>の末尾** に記述するようにします。これは、<Term>JavaScript</Term>が読み込まれるタイミングで他のすべての<Term>HTML要素</Term>がすでに表示されていることを保証するためです。
+この講座の中では、`script`[[要素]]を常に **`body`[[要素]]の末尾** に記述するようにします。これは、[[JavaScript]]が読み込まれるタイミングで他のすべての[[HTML要素]]がすでに表示されていることを保証するためです。
 
 :::
 
-## <Term>JavaScript</Term>の基本文法
+## JavaScriptの基本文法
 
-{/* prettier-ignore */}
-<Term>JavaScript</Term>のプログラムで、セミコロンで区切られた部分を<Term>文</Term>と呼びます。<Term>JavaScript</Term>の実行環境は、プログラム中に含まれる<Term>文</Term>を上から下に向けて順番に実行していきます。
+[[JavaScript]]のプログラムで、セミコロンで区切られた部分を[[文]]と呼びます。[[JavaScript]]の実行環境は、プログラム中に含まれる[[文]]を上から下に向けて順番に実行していきます。
 `document.write`はブラウザの画面に出力するための命令です。
 
 ```javascript title="script.js"