translate 01-svelte/08-stores into Japanese

Author: tomoam

content/tutorial/01-svelte/08-stores/01-writable-stores/README.md

@@ -2,23 +2,23 @@
 title: Writable stores
 ---
 
-Not all application state belongs inside your application's component hierarchy. Sometimes, you'll have values that need to be accessed by multiple unrelated components, or by a regular JavaScript module.
+すべてのアプリケーションの状態がアプリケーションのコンポーネント階層の内部にあるわけではありません。場合によっては、関連のない複数のコンポーネントや、通常の JavaScript モジュールからアクセスする必要のある値があります。
 
-In Svelte, we do this with _stores_. A store is simply an object with a `subscribe` method that allows interested parties to be notified whenever the store value changes. In `App.svelte`, `count` is a store, and we're setting `count_value` in the `count.subscribe` callback.
+Svelte では、これを *ストア* で行います。ストアとは、単に、値が変化するたびに関係者に通知する`subscribe` メソッドを備えたオブジェクトです。`App.svelte` の `count` はストアであり、`count.subscribe` のコールバックの中で `count_value` を設定しています。
 
-Click the `stores.js` tab to see the definition of `count`. It's a _writable_ store, which means it has `set` and `update` methods in addition to `subscribe`.
+`stores.js` タブをクリックして `count` の定義を見てください。これは書き込み可能なストアです。つまり、 `subscribe` メソッドに加えて、`set` と `update` メソッドも兼ね備えています。
 
-Now go to the `Incrementer.svelte` tab so that we can wire up the `+` button:
+次に、`Incrementer.svelte` タブに移動して、`+` ボタンと連動するようにします。
 
 ```js
 function increment() {
 	count.update((n) => n + 1);
 }
 ```
 
-Clicking the `+` button should now update the count. Do the inverse for `Decrementer.svelte`.
+`+` ボタンをクリックすると、カウントが更新されます。`Decrementer.svelte` に戻す機能を実装してみてください。
 
-Finally, in `Resetter.svelte`, implement `reset`:
+最後に、`Resetter.svelte` で `reset` を実装します。
 
 ```js
 function reset() {

content/tutorial/01-svelte/08-stores/02-auto-subscriptions/README.md

@@ -2,19 +2,19 @@
 title: Auto-subscriptions
 ---
 
-The app in the previous example works, but there's a subtle bug — the store is subscribed to, but never unsubscribed. If the component was instantiated and destroyed many times, this would result in a _memory leak_.
+前の例でアプリは動きましたが、微妙なバグがあります。ストアはサブスクライブされますが、決してアンサブスクライブされません。仮に、コンポーネントが何度もインスタンス化および破棄されるなら、*メモリリーク* が発生することになるでしょう。
 
-Start by declaring `unsubscribe` in `App.svelte`:
+まず、`App.svelte` で `unsubscribe` を宣言します。
 
 ```js
 const unsubscribe = count.subscribe((value) => {
 	count_value = value;
 });
 ```
 
-> Calling a `subscribe` method returns an `unsubscribe` function.
+> `subscribe` メソッドを呼ぶと `unsubscribe` 関数が返ります.
 
-You now declared `unsubscribe`, but it still needs to be called, for example through the `onDestroy` [lifecycle hook](/tutorial/ondestroy):
+`unsubscribe` が宣言されましたが、さらに、例えば `onDestroy` [lifecycle hook](/tutorial/ondestroy) などで呼び出される必要があります。
 
 ```svelte
 <script>
@@ -36,7 +36,7 @@ You now declared `unsubscribe`, but it still needs to be called, for example thr
 <h1>The count is {count_value}</h1>
 ```
 
-It starts to get a bit boilerplatey though, especially if your component subscribes to multiple stores. Instead, Svelte has a trick up its sleeve — you can reference a store value by prefixing the store name with `$`:
+ただし、このやり方は、特にコンポーネントが複数のストアにサブスクライブしている場合に、少し定型的になり始めます。代わりに、Svelte には巧妙な工夫が施されています。ストア名の前に `$` を付けることで、ストアの値を参照できます。
 
 ```svelte
 <script>
@@ -49,8 +49,8 @@ It starts to get a bit boilerplatey though, especially if your component subscri
 <h1>The count is {$count}</h1>
 ```
 
-> Auto-subscription only works with store variables that are declared (or imported) at the top-level scope of a component.
+> 自動サブスクリプションは、コンポーネントの最上位スコープで宣言（またはインポート）されたストア変数でのみ機能します。
 
-You're not limited to using `$count` inside the markup, either — you can use it anywhere in the `<script>` as well, such as in event handlers or reactive declarations.
+`$count` の使用はマークアップ内に限定されません。イベントハンドラやリアクティブ宣言など、`<script>` のどこでも使用できます。
 
-> Any name beginning with `$` is assumed to refer to a store value. It's effectively a reserved character — Svelte will prevent you from declaring your own variables with a `$` prefix.
+> `$` で始まる名前はストア値を参照していると見なされます。これは事実上の予約文字です。Svelte では `$` プレフィックスを使った独自変数を宣言できません。

content/tutorial/01-svelte/08-stores/03-readable-stores/README.md

@@ -2,9 +2,9 @@
 title: Readable stores
 ---
 
-Not all stores should be writable by whoever has a reference to them. For example, you might have a store representing the mouse position or the user's geolocation, and it doesn't make sense to be able to set those values from 'outside'. For those cases, we have _readable_ stores.
+すべてのストアが、それらを参照しているものによって書き込み可能であるべきではありません。たとえば、マウスの位置やユーザーの地理的位置を表すストアがあり、それらの値を「外部」から設定できるのは意味がありません。そのような場合のために、読み取り可能なストアがあります。
 
-Click over to the `stores.js` tab. The first argument to `readable` is an initial value, which can be `null` or `undefined` if you don't have one yet. The second argument is a `start` function that takes a `set` callback and returns a `stop` function. The `start` function is called when the store gets its first subscriber; `stop` is called when the last subscriber unsubscribes.
+`stores.js` タブをクリックしてください。`readable` の第1引数は初期値です。初期値がない場合は `null` や `undefined` をセットできます。第2引数は `set` コールバックを受け取り `stop` 関数を返す `start` 関数です。この `start` 関数は、ストアが最初のサブスクライバーを取得したときに呼び出されます。`stop` 関数は、最後のサブスクライバーがサブスクライブを解除したときに呼び出されます。
 
 ```js
 export const time = readable(new Date(), function start(set) {

content/tutorial/01-svelte/08-stores/04-derived-stores/README.md

@@ -2,10 +2,10 @@
 title: Derived stores
 ---
 
-You can create a store whose value is based on the value of one or more _other_ stores with `derived`. Building on our previous example, we can create a store that derives the time the page has been open:
+`derived` を使用して、1つまたはそれ以上の*他の*ストアに基づいた値のストアを作成することができます。前の例を利用して、ページが開かれている時間を取得するストアを作成することができます。
 
 ```js
 export const elapsed = derived(time, ($time) => Math.round(($time - start) / 1000));
 ```
 
-> It's possible to derive a store from multiple inputs, and to explicitly `set` a value instead of returning it (which is useful for deriving values asynchronously). Consult the [API reference](https://svelte.dev/docs#run-time-svelte-store-derived) for more information.
+> 複数の入力からストアを作成したり、値を返す代わりに `set` を使用して明示的に値をセットすることができます。（これは非同期で値を取得する場合に役立ちます。）詳細については [API reference](/docs#run-time-svelte-store-derived) を参照してください。

content/tutorial/01-svelte/08-stores/05-custom-stores/README.md

@@ -2,9 +2,9 @@
 title: Custom stores
 ---
 
-As long as an object correctly implements the `subscribe` method, it's a store. Beyond that, anything goes. It's very easy, therefore, to create custom stores with domain-specific logic.
+オブジェクトが `subscribe` メソッドを正しく実装していれば、それはストアです。それ以外は何でもありです。したがって、ドメイン固有のロジックを使ってカスタムストアを作成するのはとても簡単です。
 
-For example, the `count` store from our earlier example could include `increment`, `decrement` and `reset` methods and avoid exposing `set` and `update`:
+たとえば、先ほどの例の `count` ストアに `increment`, `decrement`, `reset` メソッドを含めて、`set` と `update` は公開しないようにできます:
 
 ```js
 function createCount() {

content/tutorial/01-svelte/08-stores/06-store-bindings/README.md

@@ -2,22 +2,22 @@
 title: Store bindings
 ---
 
-If a store is writable — i.e. it has a `set` method — you can bind to its value, just as you can bind to local component state.
+ストアが書き込み可能、つまり `set` メソッドを持っている場合は、ローカルコンポーネントの状態にバインドするのと同じように、ストアの値にバインドできます。
 
-In this example we have a writable store `name` and a derived store `greeting`. Update the `<input>` element:
+この例では、書き込み可能なストア `name` と派生ストア（derived store）の `greeting` があります。`<input>` 要素を以下のように更新してください:
 
 ```svelte
 <input bind:value={$name}>
 ```
 
-Changing the input value will now update `name` and all its dependents.
+入力値を変更すると `name` とそれに依存しているもの全てが更新されます。
 
-We can also assign directly to store values inside a component. Add a `<button>` element:
+また、コンポーネント内でストアの値に直接代入することもできます。以下の通り `<button>` 要素を追加してください:
 
 ```svelte
 <button on:click="{() => $name += '!'}">
 	Add exclamation mark!
 </button>
 ```
 
-The `$name += '!'` assignment is equivalent to `name.set($name + '!')`.
+`$name += '!'` の代入は `name.set($name + '!')` と同等です。