translate 01-svelte/01-introduction into Japanese

Author: tomoam

content/tutorial/01-svelte/01-introduction/03-dynamic-attributes/README.md

@@ -2,31 +2,31 @@
 title: Dynamic attributes
 ---
 
-Just like you can use curly braces to control text, you can use them to control element attributes.
+テキストをコントロールするのに中括弧を使えるのと同じように、要素の属性をコントロールするのに中括弧を使うことができます。
 
-Our image is missing a `src` — let's add one:
+画像 (image) に `src` がありません。これを追加してみましょう。
 
 ```svelte
 <img +++src={src}+++ />
 ```
 
-That's better. But Svelte is giving us a warning:
+これでよくなりました。ただし、まだ警告が表示され続けています。
 
 > A11y: &lt;img&gt; element should have an alt attribute
 
-When building web apps, it's important to make sure that they're _accessible_ to the broadest possible userbase, including people with (for example) impaired vision or motion, or people without powerful hardware or good internet connections. Accessibility (shortened to a11y) isn't always easy to get right, but Svelte will help by warning you if you write inaccessible markup.
+Webアプリケーションは、例えば視覚や動作に障害のある方や、高スペックな端末や高速なインターネット回線を持っていない方など、可能な限り幅広いユーザーにとって*使いやすいものである*ことが重要です。アクセシビリティ(Accessibility、略:a11y)を正しく行うことは簡単ではありませんが、Svelteは警告を表示してa11yを正しく行う手助けをしてくれます。
 
-In this case, we're missing the `alt` attribute that describes the image for people using screenreaders, or people with slow or flaky internet connections that can't download the image. Let's add one:
+この場合、スクリーンリーダー(画面読み上げソフト)を使用するユーザーやインターネット回線が低速・不安定で画像をダウンロードできないユーザーに必要な`alt`という画像を説明する属性が足りていません。追加しましょう。
 
 ```svelte
 <img src={src} +++alt="A man dances."+++ />
 ```
 
-We can use curly braces _inside_ attributes. Try changing it to `"{name} dances."` — remember to declare a `name` variable in the `<script>` block.
+要素の*中*でも中括弧を使用することができます。`<script>`ブロックの中に`name`変数を宣言し、`A man dances.`を`"{name} dances."`に変更してみましょう。
 
 ## Shorthand attributes
 
-It's not uncommon to have an attribute where the name and value are the same, like `src={src}`. Svelte gives us a convenient shorthand for these cases:
+`src={src}`のように、属性の名前と値の変数が一致することは珍しくありません。このような場合、Svelteでは省略して書くことができます。
 
 ```svelte
 <img +++{src}+++ alt="A man dances." />

content/tutorial/01-svelte/01-introduction/04-styling/README.md

@@ -2,7 +2,7 @@
 title: Styling
 ---
 
-HTMLと同じように、コンポーネントには `<style>` タグを置くことができます。`<p>` 要素にいくつかスタイルを追加してみましょう。
+HTMLと同じように、コンポーネントには`<style>`タグを置くことができます。`<p>`要素にいくつかスタイルを追加してみましょう。
 
 ```svelte
 <p>This is a paragraph.</p>
@@ -16,4 +16,4 @@ HTMLと同じように、コンポーネントには `<style>` タグを置く
 </style>
 ```
 
-重要なのは、これらのスタイルが _このコンポーネントにのみ適用されるということです_ 。次のステップで説明しますが、別の箇所の `<p>` 要素のスタイルに影響を与えてしまうようなことはありません。
+重要なのは、これらのスタイルが*このコンポーネントにのみ適用されるということです*。次のステップで説明しますが、別の箇所の`<p>`要素のスタイルに影響を与えてしまうようなことはありません。

content/tutorial/01-svelte/01-introduction/05-nested-components/README.md

@@ -2,23 +2,23 @@
 title: Nested components
 ---
 
-It would be impractical to put your entire app in a single component. Instead, we can import components from other files and include them in our markup.
+アプリ全体を単一のコンポーネントにまとめるのは現実的ではありません。代わりに、他のファイルからコンポーネントをインポートし、マークアップでそれを使用することができます。
 
-Add a `<script>` tag that imports `Nested.svelte`...
+`<script>` タグを追加して `Nested.svelte` をインポートしましょう…
 
 ```svelte
 +++<script>
 	import Nested from './Nested.svelte';
 </script>+++
 ```
 
-...and include a `<Nested />` component:
+…そして `<Nested />` コンポーネントを使用します。
 
 ```svelte
 <p>This is a paragraph.</p>
 +++<Nested />+++
 ```
 
-Notice that even though `Nested.svelte` has a `<p>` element, the styles from `App.svelte` don't leak in.
+`Nested.svelte` には `<p>` 要素がありますが、`App.svelte` のスタイルが適用されていないことに注目してください。
 
-> Component names are always capitalised, to distinguish them from HTML elements.
+> HTML 要素と区別するため、コンポーネントの名前は常に大文字で始まっています 

content/tutorial/01-svelte/01-introduction/06-html-tags/README.md

@@ -2,14 +2,14 @@
 title: HTML tags
 ---
 
-Ordinarily, strings are inserted as plain text, meaning that characters like `<` and `>` have no special meaning.
+通常、文字列はプレーンテキストとして挿入され、`<`や`>`のような文字は特別な意味を持ちません。
 
-But sometimes you need to render HTML directly into a component. For example, the words you're reading right now exist in a markdown file that gets included on this page as a blob of HTML.
+しかし、HTMLをコンポーネントに直接レンダリングする必要がある場合もあります。例えば、あなたが今読んでいる文章はマークダウンファイルに存在し、HTMLのblobとしてこのページに含まれています。
 
-In Svelte, you do this with the special `{@html ...}` tag:
+Svelteでは、`{@html ...}` という特別なタグを使ってこれを行います。
 
 ```svelte
 <p>{+++@html+++ string}</p>
 ```
 
-> Svelte doesn't perform any sanitization of the expression inside `{@html ...}` before it gets inserted into the DOM. In other words, if you use this feature it's critical that you manually escape HTML that comes from sources you don't trust, otherwise you risk exposing your users to XSS attacks.
+> Svelte は DOM に挿入される前に `{@html ...}` 内の式のサニタイズを行いません。違う言い方をすれば、この機能を使用する場合は信頼できないソースから来た HTML を手動でエスケープすることが重要です、そうしなければユーザーをXSS攻撃にさらす危険性があります。