Merge pull request #5 from tomoam/translate-01-svelte-01-introduction-04-styling-into-japanese

02-sveltekit/02-routing 配下を翻訳

Author: tomoam

content/tutorial/02-sveltekit/01-concepts/03-server-and-client/README.md

@@ -2,12 +2,12 @@
 title: Server and client
 ---
 
-SvelteKit アプリは、2つの異なる存在が連携して動作していると考えることができます。つまりそれは _サーバー_ と _クライアント_ です。
+SvelteKit アプリは、_サーバー_ と _クライアント_ の2つが連携して動作していると考えることができます。
 
-'サーバー' は、もしかしたら混乱を招く言葉かもしれません。なぜなら、アプリが _サーバーレス(serverless)_ 環境 (cloud/edge functions) で実行されたり、完全に静的なファイルのセットとしてデプロイされたりするからです。しかし、これがベストな言葉です。サーバーの基本的な仕事は、リクエストをレスポンスに変換することです。
+'サーバー' という言葉は、もしかしたら混乱を招くかもしれません。なぜなら、アプリが _サーバーレス(serverless)_ 環境 (cloud/edge functions) で実行されたり、完全に静的なファイルのセットとしてデプロイされたりするからです。しかし、これがベストな言葉です。サーバーの基本的な仕事は、リクエストをレスポンスに変換することです。
 
 'クライアント' は、ブラウザに読み込まれる JavaScript を指します。
 
 SvelteKit はこの2つをお互いにシームレスに通信させるようにします。最初のページロードでは、サーバーが HTML をレンダリングし、コンテンツを可能な限り早く表示させます。その後、'ハイドレーション(hydration)' と呼ばれるプロセスでクライアントが引き継ぐため、以降のナビゲーションではページをフルで再読み込みすることはありません。クライアントは、必要に応じて追加のコードやデータをサーバーにリクエストします。
 
-> 必要に応じて [この動作を調整](https://kit.svelte.jp/docs/page-options) することができます。SvelteKit は非常に多機能です！
+> 必要に応じて[この動作を調整](https://kit.svelte.jp/docs/page-options)することができます。SvelteKit は非常に多機能です！

content/tutorial/02-sveltekit/02-routing/01-pages/README.md

@@ -2,13 +2,13 @@
 title: Pages
 ---
 
-SvelteKit uses filesystem-based routing, which means that the _routes_ of your app — in other words, what the app should do when a user navigates to a particular URL — are defined by the directories in your codebase.
+SvelteKit はファイルシステムベースのルーティングを採用しており、アプリの _ルート(routes)_ (言い換えると、ユーザーが特定の URL に移動したときにアプリがすべきこと) については、コードベースのディレクトリで定義します。
 
-The routes are located within `src/routes`. Every directory within which contains a `+page.svelte` file creates a route in your app.
+ルート(routes)は `src/routes` の中に置きます。`+page.svelte` ファイルを含む全てのディレクトリが、アプリのルート(routes)となります。
 
-In this app we currently have one route — `src/routes/+page.svelte`, which maps to `/`.
+このアプリには、現在はルート(route)が1つだけあります。それは `src/routes/+page.svelte` で、`/` にマップされています。
 
-Let's add a second route, `src/routes/about/+page.svelte`, which maps to `/about`:
+2つ目のルート(route)として、`src/routes/about/+page.svelte` を追加してみましょう。これは `/about` にマップされます。
 
 ```svelte
 /// file: src/routes/about/+page.svelte
@@ -21,6 +21,6 @@ Let's add a second route, `src/routes/about/+page.svelte`, which maps to `/about
 <p>this is the about page.</p>
 ```
 
-We can now navigate between `/` and `/about`.
+これによって `/` と `/about` の間を移動できるようになりました。
 
-> Unlike traditional multi-page apps, navigating to `/about` and back updates the contents of the current page, like a single-page app. This gives us the best of both worlds — fast server-rendered startup, then instant navigation. (This behaviour can be [configured](https://kit.svelte.dev/docs/page-options).)
+> 従来のマルチページアプリとは違い、`/about` に移動してから戻ると、シングルページアプリのように現在のページのコンテンツが更新されます。これにより、サーバーレンダリングによるスタートアップと、瞬時のナビゲーションという、両方の長所を得ることができます。(この動作は[設定で変更できます](https://kit.svelte.jp/docs/page-options)。)

content/tutorial/02-sveltekit/02-routing/02-layouts/README.md

@@ -2,9 +2,9 @@
 title: Layouts
 ---
 
-Different routes of your app will often share common UI. Instead of repeating it in each `+page.svelte` component, we can use a `+layout.svelte` component that applies to all routes in the same directory.
+アプリの別々のルート(routes)が共通の UI を共有することがあると思います。その共通の UI を `+page.svelte` コンポーネントに繰り返し書く代わりに、同じディレクトリ内の全てのルート(routes)に適用される `+layout.svelte` コンポーネント を使用することができます。
 
-In this app we have two routes, `src/routes/+page.svelte` and `src/routes/about/+page.svelte`, that contain the same navigation UI. Let's create a new file, `src/routes/+layout.svelte`...
+このアプリには2つのルート(routes) `src/routes/+page.svelte` と `src/routes/about/+page.svelte` があり、どちらにも同じナビゲーション UI があります。新たに `src/routes/+layout.svelte` ファイルを作成してみましょう…
 
 ```diff
 src/routes/
@@ -14,7 +14,7 @@ src/routes/
 └ +page.svelte
 ```
 
-...and move the duplicated content from the `+page.svelte` files into the new `+layout.svelte` file. The `<slot />` element is where the page content will be rendered:
+…そして2つの `+page.svelte` ファイルで重複しているコンテンツを新たに作成した `+layout.svelte` ファイルに移動しましょう。`<slot />` 要素は、ページコンテンツがレンダリングされる場所です。
 
 ```svelte
 /// file: src/routes/+layout.svelte
@@ -26,4 +26,4 @@ src/routes/
 <slot />
 ```
 
-A `+layout.svelte` file applies to every child route, including the sibling `+page.svelte` (if it exists). You can nest layouts to arbitrary depth.
+`+layout.svelte` ファイルは全ての子ルート(route)に適用されます。同じ階層にある `+page.svelte` にも適用されます(もし存在していれば)。レイアウトは任意の深さまでネストすることができます。

content/tutorial/02-sveltekit/02-routing/03-params/README.md

@@ -3,15 +3,15 @@ title: Route parameters
 path: /blog
 ---
 
-To create routes with dynamic parameters, use square brackets around a valid variable name. For example, a file like `src/routes/blog/[slug]/+page.svelte` will create a route that matches `/blog/one`, `/blog/two`, `/blog/three` and so on.
+動的なパラメータ付きのルート(routes)を作成するには、角括弧を使用して有効な変数名を囲みます。例えば、`src/routes/blog/[slug]/+page.svelte` というファイルは、`/blog/one`、`/blog/two`、`/blog/three` などにマッチするルート(route)を作成します。
 
-Let's create that file:
+そのファイルを作成してみましょう。
 
 ```svelte
 /// file: src/routes/blog/[slug]/+page.svelte
 <h1>blog post</h1>
 ```
 
-We can now navigate from the `/blog` page to individual blog posts. In the next chapter, we'll see how to load their content.
+これで、`/blog` ページから個々のブログ記事に移動できるようになりました。次の章では、そのコンテンツをロードする方法を見ていきます。
 
-> Multiple route parameters can appear _within_ one URL segment, as long as they are separated by at least one static character: `foo/[bar]x[baz]` is a valid route where `[bar]` and `[baz]` are dynamic parameters.
+> 少なくとも1つの静的な文字で区切られていれば、1つの URL セグメント内に複数のルートパラメータを使用することができます。`foo/[bar]x[baz]` は有効なルートで、`[bar]` と `[baz]` は動的なパラメータです。