Merge pull request #1 from tomoam/translate-site-into-japanese

日本語翻訳準備

Author: tomoam

content/tutorial/01-svelte/01-introduction/01-welcome-to-svelte/README.md

@@ -1,30 +1,30 @@
 ---
-title: Welcome to Svelte
+title: Svelte にようこそ
 ---
 
-Welcome to the Svelte tutorial! This will teach you everything you need to know to easily build fast, small web applications.
+Svelte チュートリアルにようこそ！ ここでは、高速で小さい Web アプリケーションを簡単に構築するために必要なこと全てを学ぶことができます。(訳注: 「小さい」はバンドルサイズを指しており、作成する Web アプリケーションの規模のことではありません。)
 
-You can also consult the [API docs](https://svelte.dev/docs) and the [examples](https://svelte.dev/examples), or — if you're impatient to start hacking on your machine locally — create a project with `npm init svelte`.
+[API ドキュメント](https://svelte.jp/docs) や [examples](https://svelte.dev/examples) を参照することもできます。また、すぐにローカルで動かしたい場合は、`npm init svelte` を実行してプロジェクトを作成してください。
 
-## What is Svelte?
+## Svelte とは？
 
-Svelte is a tool for building web applications. Like other user interface frameworks, it allows you to build your app _declaratively_ out of components that combine markup, styles and behaviours.
+Svelte は、web アプリケーションを構築するためのツールです。他のユーザーインターフェースフレームワークと同様、マークアップ(markup)、スタイル(styles)、振る舞い(behaviours) を組み合わせたコンポーネントでアプリを _宣言的(declaratively)_ に構築することができます。
 
-These components are _compiled_ into small, efficient JavaScript modules that eliminate overhead traditionally associated with UI frameworks.
+これらのコンポーネントは小さくて効率的な JavaScript モジュールに _コンパイル_ されるため、従来の UI フレームワークには付き物だったオーバーヘッドがありません。
 
-You can build your entire app with Svelte (for example, using an application framework like [SvelteKit](https://kit.svelte.dev)), or you can add it incrementally to an existing codebase. You can also ship components as standalone packages that work anywhere.
+アプリ全体を Svelte で作ることもできますし (例えば [SvelteKit](https://kit.svelte.jp) のようなアプリケーションフレームワークを使用)、既存のコードベースに部分的/段階的に追加することもできます。また、どんな場所でも機能するスタンドアロンパッケージとしてコンポーネントを配布することもできます。
 
-## How to use this tutorial
+## このチュートリアルの使い方
 
-> You'll need to have basic familiarity with HTML, CSS and JavaScript to understand Svelte.
+> Svelte を理解するには、HTML、CSS、JavaScript の基本的な知識が必要です。
 
-This tutorial is split into four main parts:
+このチュートリアルは大きく4つのパートに分かれています:
 
-- [Welcome to Svelte](/tutorial/welcome-to-svelte) (you are here)
+- [Svelte にようこそ](/tutorial/welcome-to-svelte) (現在はこちらです)
 - [Introduction to SvelteKit](/tutorial/introducing-sveltekit)
 - [Advanced Svelte](/tutorial/tweens)
 - [Advanced SvelteKit](/tutorial/optional-params)
 
-Each section will present an exercise designed to illustrate a feature. Later exercises build on the knowledge gained in earlier ones, so it's recommended that you go from start to finish. If necessary, you can navigate via the menu above.
+各セクションには、機能を解説するために作られた練習問題があります。後のセクションの練習問題は、それより前のセクションの練習問題で得た知識を土台として作られているので、最初から最後まで通しで学習することをおすすめします。必要に応じて、上部のメニューから移動することができます。
 
-If you get stuck, you can click the `solve` button to the left of the editor. (It's disabled on sections like this one that don't include an exercise.) Try not to rely on it too much; you will learn faster by figuring out where to put each suggested code block and manually typing it in to the editor.
+行き詰まったら、エディタの左にある `正解を見る` ボタンをクリックすることもできます。(ここのように練習問題がないセクションでは無効化されています。) ただし、これに頼りすぎないようにしてください。提示されたコードブロックをどこに配置するか自分で考え、エディタに手入力することで、より早く学習することができます。

content/tutorial/02-sveltekit/01-concepts/01-introducing-sveltekit/README.md

@@ -1,21 +1,21 @@
 ---
-title: What is SvelteKit?
+title: SvelteKit とは？
 ---
 
-SvelteKit is a framework for building extremely high-performance web apps. Whereas Svelte is a _component framework_, SvelteKit is an _app framework_ (or 'metaframework', depending on who you ask) that solves the tricky problems of building something production-ready:
+SvelteKit は非常にハイパフォーマンスな web アプリを開発するためのフレームワークです。Svelte が _コンポーネントフレームワーク_ であるのに対し、SvelteKit は _アプリケーションフレームワーク_ であり (または、'metaframework' と呼ぶ人もいます)、プロダクションレディ(production-ready)なものを開発する際のややこしい問題を解決します:
 
-- Routing
-- Server-side rendering
-- Data fetching
+- ルーティング
+- サーバーサイドレンダリング
+- データ取得
 - Service workers
-- TypeScript integration
-- Prerendering
-- Single-page apps
-- Library packaging
-- Optimised production builds
-- Deploying to different hosting providers
-- ...and so on
+- TypeScript インテグレーション
+- プリレンダリング
+- シングルページアプリ
+- ライブラリのパッケージング
+- プロダクション向けビルドの最適化
+- 様々なホスティングプロバイダーへのデプロイ
+- ...などなど
 
-SvelteKit apps are server-rendered by default (like traditional 'multi-page apps' or MPAs) for excellent first load performance and SEO characteristics, but can then transition to client-side navigation (like modern 'single-page apps' or SPAs) to avoid jankily reloading everything (including things like third-party analytics code) when the user navigates. They can run anywhere JavaScript runs, though — as we'll see — your users may not need to run any JavaScript at all.
+SvelteKit アプリはデフォルトでは (従来の 'マルチページアプリ'、MPA のように) サーバーでレンダリングを行うため、優れた初期ロードパフォーマンスと SEO 特性を備えており、初回のロードのあとは (モダンな 'シングルページアプリ'、SPA のような) クライアントサイドナビゲーションに移行するため、ユーザーが移動する際の不愉快なフルリロードを回避することができます (サードパーティーの analytics コードを含む)。JavaScript が動作する場所ならどこでも実行できます。ただ、後ほど説明しますが、あなたのユーザーは JavaScript を実行する必要が無いかもしれません。
 
-If that sounds complicated, worry not: SvelteKit is the framework that grows with you! Start simple and add new features as they come. This tutorial will go over the core concepts, while the [Advanced SvelteKit](/tutorial/handle) tutorial teaches you how to tackle more complex use cases.
+複雑そうに聞こえるかもしれませんが、ご心配なく。SvelteKit はあなたとともに成長するフレームワークです！ シンプルに始めてみて、必要に応じて新しい機能を使っていきましょう。このチュートリアルではコアコンセプトを解説し、[Advanced SvelteKit](/tutorial/handle) チュートリアルではより複雑なユースケースに取り組む方法を教えます。

src/routes/+layout.svelte

@@ -20,7 +20,7 @@
 
 <Nav {page} logo="/svelte-logo.svg">
 	<svelte:fragment slot="nav-center">
-		<strong class="large">Work in progress. Here be dragons!</strong>
+		<strong class="large">開発中です。バグがある可能性があります！</strong>
 		<!-- <NavItem href="/tutorial">Tutorial</NavItem>
 		<NavItem href="/docs">Docs</NavItem>
 		<NavItem href="/examples">Examples</NavItem>
@@ -30,7 +30,7 @@
 	</svelte:fragment>
 
 	<svelte:fragment slot="nav-right">
-		<NavItem external="https://kit.svelte.dev">SvelteKit</NavItem>
+		<NavItem external="https://kit.svelte.jp">SvelteKit</NavItem>
 
 		<NavItem external="https://svelte.dev/chat" title="Discord Chat">
 			<span class="small">Discord</span>

src/routes/tutorial/[slug]/+page.svelte

@@ -312,14 +312,14 @@
 	<meta name="twitter:card" content="summary" />
 	<meta name="twitter:site" content="@sveltejs" />
 	<meta name="twitter:creator" content="@sveltejs" />
-	<meta name="twitter:image" content="https://svelte.dev/images/twitter-thumbnail.jpg" />
-	<meta property="twitter:domain" content="learn.svelte.dev" />
-	<meta property="twitter:url" content="https://learn.svelte.dev" />
+	<meta name="twitter:image" content="https://svelte.jp/images/twitter-thumbnail.jpg" />
+	<meta property="twitter:domain" content="learn.svelte.jp" />
+	<meta property="twitter:url" content="https://learn.svelte.jp" />
 
 	<meta property="og:title" content="{data.exercise.title} • Svelte Tutorial" />
-	<meta property="og:url" content="https://learn.svelte.dev" />
+	<meta property="og:url" content="https://learn.svelte.jp" />
 	<meta property="og:type" content="website" />
-	<meta property="og:image" content="https://svelte.dev/images/twitter-thumbnail.jpg" />
+	<meta property="og:image" content="https://svelte.jp/images/twitter-thumbnail.jpg" />
 </svelte:head>
 
 <ContextMenu />
@@ -379,9 +379,9 @@
 								}}
 							>
 								{#if completed && Object.keys(data.exercise.b).length > 0}
-									reset
+									リセット	
 								{:else}
-									solve <Icon name="arrow-right" />
+									正解を見る <Icon name="arrow-right" />
 								{/if}
 							</button>
 						</section>

src/routes/tutorial/[slug]/Sidebar.svelte

@@ -12,7 +12,7 @@
 
 	const dispatch = createEventDispatcher();
 
-	const namespace = 'learn.svelte.dev';
+	const namespace = 'learn.svelte.jp';
 	const copy_enabled = `${namespace}:copy_enabled`;
 
 	/** @type {HTMLElement} */
@@ -77,7 +77,7 @@
 		target="_blank"
 		rel="noreferrer"
 		class="edit"
-		href="https://github.com/sveltejs/learn.svelte.dev/tree/main/{exercise.dir}"
+		href="https://github.com/svelte-jp/learn.svelte.dev/tree/main/{exercise.dir}"
 	>
 		Edit this page
 	</a>
@@ -86,11 +86,11 @@
 {#if show_modal}
 	<Modal on:close={() => (show_modal = false)}>
 		<div class="modal-contents">
-			<h2>Copy and paste is currently disabled!</h2>
+			<h2>コピー&ペーストは現在無効です！</h2>
 
 			<p>
-				We recommend typing the code into the editor to complete the exercise, as this results in
-				better retention and understanding.
+				練習問題を完了する上で、コードをエディタに手入力することをおすすめします。
+				これによって理解が深まり記憶に定着します。
 			</p>
 			<label>
 				<input
@@ -99,7 +99,7 @@
 						sessionStorage[copy_enabled] = e.currentTarget.checked ? 'true' : '';
 					}}
 				/>
-				enable copy-and-paste for the duration of this session
+				このセッションの間、コピー&ペーストを有効にする
 			</label>
 
 			<button on:click={() => (show_modal = false)}>OK</button>