From b8f58612d1401ce3a877a455a9e68b57a9a203cb Mon Sep 17 00:00:00 2001
From: Masayuki Goto <originals0711@gmail.com>
Date: Sat, 2 Feb 2019 17:33:35 +0900
Subject: [PATCH 1/7] translate reference-react-dom

---
 content/docs/reference-react-dom.md | 64 ++++++++++++++---------------
 1 file changed, 32 insertions(+), 32 deletions(-)

diff --git a/content/docs/reference-react-dom.md b/content/docs/reference-react-dom.md
index 4060a6c0e..692e6e250 100644
--- a/content/docs/reference-react-dom.md
+++ b/content/docs/reference-react-dom.md
@@ -6,11 +6,11 @@ category: Reference
 permalink: docs/react-dom.html
 ---
 
-If you load React from a `<script>` tag, these top-level APIs are available on the `ReactDOM` global. If you use ES6 with npm, you can write `import ReactDOM from 'react-dom'`. If you use ES5 with npm, you can write `var ReactDOM = require('react-dom')`.
+`<script>` タグから React をロードすると、以下のトップレベル API をグローバル変数 `ReactDOM` で使用することができます。 npm と ES6 を使用している場合は、`import ReactDOM from 'react-dom'` と記述できます。 npm と ES5 を使用している場合は、`var ReactDOM = require('react-dom')` と記述できます。
 
-## Overview
+## 概要
 
-The `react-dom` package provides DOM-specific methods that can be used at the top level of your app and as an escape hatch to get outside of the React model if you need to. Most of your components should not need to use this module.
+`react-dom` パッケージには、アプリケーションのトップレベルで、また必要に応じて React モデルから抜け出すための避難ハッチとして使用できる DOM 固有のメソッドが用意されています。ほとんどのコンポーネントでは、このモジュールを使用する必要はないはずです。
 
 - [`render()`](#render)
 - [`hydrate()`](#hydrate)
@@ -18,17 +18,17 @@ The `react-dom` package provides DOM-specific methods that can be used at the to
 - [`findDOMNode()`](#finddomnode)
 - [`createPortal()`](#createportal)
 
-### Browser Support
+### ブラウザサポート
 
-React supports all popular browsers, including Internet Explorer 9 and above, although [some polyfills are required](/docs/javascript-environment-requirements.html) for older browsers such as IE 9 and IE 10.
+React は Internet Explorer 9 以降を含む全ての一般的なブラウザをサポートしていますが、 IE 9 や IE 10 といった古いブラウザでは[一部のポリフィルが必要です](/docs/javascript-environment-requirements.html)。
 
-> Note
+> 注意
 >
-> We don't support older browsers that don't support ES5 methods, but you may find that your apps do work in older browsers if polyfills such as [es5-shim and es5-sham](https://github.com/es-shims/es5-shim) are included in the page. You're on your own if you choose to take this path.
+> React は ES5 をサポートしていない古いブラウザをサポートしていませんが、ページ内に [es5-shim や es5-sham](https://github.com/es-shims/es5-shim) のようなポリフィルが含まれている場合、古いブラウザでもアプリケーションが動作することがあります。この手段を選択するかどうかは自己責任で判断してください。
 
 * * *
 
-## Reference
+## リファレンス
 
 ### `render()`
 
@@ -36,23 +36,23 @@ React supports all popular browsers, including Internet Explorer 9 and above, al
 ReactDOM.render(element, container[, callback])
 ```
 
-Render a React element into the DOM in the supplied `container` and return a [reference](/docs/more-about-refs.html) to the component (or returns `null` for [stateless components](/docs/components-and-props.html#functional-and-class-components)).
+提供された `container` の DOM に React 要素をレンダーし、コンポーネントへの [reference](/docs/more-about-refs.html)（[ステートレスコンポーネント](/docs/components-and-props.html#functional-and-class-components)の場合は `null`）を返します。
 
-If the React element was previously rendered into `container`, this will perform an update on it and only mutate the DOM as necessary to reflect the latest React element.
+React 要素がすでに `container` にレンダーされている場合は更新を行い、最新の React 要素を反映するために必要な DOM のみを変更します。
 
-If the optional callback is provided, it will be executed after the component is rendered or updated.
+オプションのコールバックが提供されている場合は、コンポーネントがレンダーまたは更新された後に実行されます。
 
-> Note:
+> 注意:
 >
-> `ReactDOM.render()` controls the contents of the container node you pass in. Any existing DOM elements inside are replaced when first called. Later calls use React’s DOM diffing algorithm for efficient updates.
+> `ReactDOM.render()` は与えられたコンテナの内容を制御します。コンテナ内部のあらゆる既存の DOM 要素は、最初に呼び出された時に置き換えられます。後続する呼び出しでは効率的な更新のために React の DOM 差分アルゴリズムを使用します。
 >
-> `ReactDOM.render()` does not modify the container node (only modifies the children of the container). It may be possible to insert a component to an existing DOM node without overwriting the existing children.
+> `ReactDOM.render()` はコンテナノードを変更しません（コンテナの子要素のみ変更します）。既存の子要素を上書きせずに既存の DOM ノードをコンポーネントに挿入することが可能な場合があります。
 >
-> `ReactDOM.render()` currently returns a reference to the root `ReactComponent` instance. However, using this return value is legacy
-> and should be avoided because future versions of React may render components asynchronously in some cases. If you need a reference to the root `ReactComponent` instance, the preferred solution is to attach a
-> [callback ref](/docs/more-about-refs.html#the-ref-callback-attribute) to the root element.
+> `ReactDOM.render()` は現時点ではルートの `ReactComponent` インスタンスへの reference を返します。
+> しかし、この戻り値を使用する方法は古く、将来のバージョンの React では一部のケースで非同期にコンポーネントをレンダーするようになる可能性があるため、使用は避けるべきです。
+> ルートの `ReactComponent` インスタンスへの reference が必要な場合は、ルート要素に[コールバックの ref](/docs/more-about-refs.html#the-ref-callback-attribute) を追加することを推奨します。
 >
-> Using `ReactDOM.render()` to hydrate a server-rendered container is deprecated and will be removed in React 17. Use [`hydrate()`](#hydrate) instead.
+> サーバーで描画されたコンテナをハイドレートするために `ReactDOM.render()` を使用することは非推奨となり、 React 17 では削除されます。代わりに [`hydrate()`](#hydrate) を使用してください。
 
 * * *
 
@@ -62,15 +62,15 @@ If the optional callback is provided, it will be executed after the component is
 ReactDOM.hydrate(element, container[, callback])
 ```
 
-Same as [`render()`](#render), but is used to hydrate a container whose HTML contents were rendered by [`ReactDOMServer`](/docs/react-dom-server.html). React will attempt to attach event listeners to the existing markup.
+[`render()`](#render) と同様ですが、 [`ReactDOMServer`](/docs/react-dom-server.html) により HTML コンテンツが描画されたコンテナをハイドレートするために使用されます。 React は既存のマークアップにイベントリスナをアタッチしようとします。
 
-React expects that the rendered content is identical between the server and the client. It can patch up differences in text content, but you should treat mismatches as bugs and fix them. In development mode, React warns about mismatches during hydration. There are no guarantees that attribute differences will be patched up in case of mismatches. This is important for performance reasons because in most apps, mismatches are rare, and so validating all markup would be prohibitively expensive.
+React は描画された内容が、サーバー・クライアント間で同一であることを期待します。 React はテキストコンテンツの差異を修復することは可能ですが、その不一致はバグとして扱い、それらを修正すべきです。開発用モードでは、 React はハイドレート中の不一致について警告します。不一致がある場合に属性の差異が修復されるという保証はありません。これはパフォーマンス上の理由から重要です。なぜなら、ほとんどのアプリケーションにおいて不一致が発生というすることは稀であり、全てのマークアップを検証することはとてつもなく高コストになるためです。
 
-If a single element's attribute or text content is unavoidably different between the server and the client (for example, a timestamp), you may silence the warning by adding `suppressHydrationWarning={true}` to the element. It only works one level deep, and is intended to be an escape hatch. Don't overuse it. Unless it's text content, React still won't attempt to patch it up, so it may remain inconsistent until future updates.
+単一要素の属性やテキストコンテンツがサーバー・クライアント間においてやむを得ず差異が生じる場合（例えばタイムスタンプなど）、要素に `suppressHydrationWarning={true}` を追加することで警告の発生を停止させることが可能です。それは 1 階層下の要素まで機能しますが、避難ハッチであることを意図しています。多用しないでください。テキストコンテンツでない限り、 React は修復を試行しようとはしないため、将来の更新まで矛盾が残る可能性があります。
 
-If you intentionally need to render something different on the server and the client, you can do a two-pass rendering. Components that render something different on the client can read a state variable like `this.state.isClient`, which you can set to `true` in `componentDidMount()`. This way the initial render pass will render the same content as the server, avoiding mismatches, but an additional pass will happen synchronously right after hydration. Note that this approach will make your components slower because they have to render twice, so use it with caution.
+サーバーとクライアントで異なるものを描画したい場合は、 2 つのパスに分けた描画を使用することができます。クライアント側の異なるものを描画するコンポーネントでは、 `this.state.isClient` のような state 変数を読み込み、 `componentDidMount()` で `true` を設定することができます。この方法では、最初の描画パスではサーバー側と同一の内容を描画し、不一致を回避しますが、もう一方のパスがハイドレートの直後に発生します。このアプローチでは 2 回描画が発生することによりコンポーネントのパフォーマンスが遅くなりますので、注意して使用して下さい。
 
-Remember to be mindful of user experience on slow connections. The JavaScript code may load significantly later than the initial HTML render, so if you render something different in the client-only pass, the transition can be jarring. However, if executed well, it may be beneficial to render a "shell" of the application on the server, and only show some of the extra widgets on the client. To learn how to do this without getting the markup mismatch issues, refer to the explanation in the previous paragraph.
+低速な接続下でのユーザー体験に留意することを忘れないでください。 JavaScript のコードは初回の HTML の描画より大幅に遅くロードされる可能性があるため、クライアントのみのパスで何か異なるものを描画した場合、その遷移は不快感を与える可能性があります。しかしうまく実行されれば、サーバー上でアプリケーションの「殻」を描画し、クライアント上でのみ追加のウィジェットを表示することが有益になるかもしれません。マークアップの不一致の問題に発生させずにこれを実行する方法については、前の段落の説明をご参照下さい。
 
 * * *
 
@@ -80,28 +80,28 @@ Remember to be mindful of user experience on slow connections. The JavaScript co
 ReactDOM.unmountComponentAtNode(container)
 ```
 
-Remove a mounted React component from the DOM and clean up its event handlers and state. If no component was mounted in the container, calling this function does nothing. Returns `true` if a component was unmounted and `false` if there was no component to unmount.
+DOM からマウントされた React コンポーネントを削除し、イベントハンドラや state をクリーンアップします。コンテナにコンポーネントがマウントされていない場合、このメソッドを呼び出しても何も行いません。コンポーネントがアンマウントされた場合は `true` を返し、アンマウントされなかった場合は `false` を返します。
 
 * * *
 
 ### `findDOMNode()`
 
-> Note:
+> 注意:
 >
-> `findDOMNode` is an escape hatch used to access the underlying DOM node. In most cases, use of this escape hatch is discouraged because it pierces the component abstraction. [It has been deprecated in `StrictMode`.](/docs/strict-mode.html#warning-about-deprecated-finddomnode-usage)
+> `findDOMNode` は基盤となる DOM ノードにアクセスするために使用される避難ハッチです。ほとんどのケースにおいて、この避難ハッチの使用はコンポーネントの抽象化に穴を開けてしまうことになるためおすすめしません。 [`StrictMode` では非推奨になっています。](/docs/strict-mode.html#warning-about-deprecated-finddomnode-usage)
 
 ```javascript
 ReactDOM.findDOMNode(component)
 ```
-If this component has been mounted into the DOM, this returns the corresponding native browser DOM element. This method is useful for reading values out of the DOM, such as form field values and performing DOM measurements. **In most cases, you can attach a ref to the DOM node and avoid using `findDOMNode` at all.**
+DOM にこのコンポーネントがマウントされている場合、このメソッドは対応するネイティブブラウザの DOM 要素を返します。このメソッドはフォームフィールドの値のような DOM の外側の値を読み取ったり DOM の計測を行ったりするのに便利です。**ほとんどのケースにおいて、 DOM ノードに ref をアタッチすることが可能であり、 `findDOMNode` の使用を避けることができます。**
 
-When a component renders to `null` or `false`, `findDOMNode` returns `null`. When a component renders to a string, `findDOMNode` returns a text DOM node containing that value. As of React 16, a component may return a fragment with multiple children, in which case `findDOMNode` will return the DOM node corresponding to the first non-empty child.
+コンポーネントが `null` や `false` を描画する場合、 `findDOMNode` は `null` を返します。コンポーネントが文字列を描画する場合、 `findDOMNode` はその値を含んだテキスト DOM ノードを返します。 React 16 以降、コンポーネントは複数の子要素を含むフラグメントを返すことがありますが、その場合 `findDOMNode` は最初の空でない子要素に対応する DOM ノードを返します。
 
-> Note:
+> 注意:
 >
-> `findDOMNode` only works on mounted components (that is, components that have been placed in the DOM). If you try to call this on a component that has not been mounted yet (like calling `findDOMNode()` in `render()` on a component that has yet to be created) an exception will be thrown.
+> `findDOMNode` はマウントされたコンポーネントに対してのみ機能します（つまり、DOM に配置されたコンポーネント）。まだマウントされていないコンポーネントにおいてこのメソッドを呼ぼうとする場合（まだ作成されていないコンポーネントにおける `render()` の中で `findDOMNode()` を呼びだす場合など）、例外がスローされます。
 >
-> `findDOMNode` cannot be used on function components.
+> `findDOMNode` は関数コンポーネントでは使用できません。
 
 * * *
 
@@ -111,4 +111,4 @@ When a component renders to `null` or `false`, `findDOMNode` returns `null`. Whe
 ReactDOM.createPortal(child, container)
 ```
 
-Creates a portal. Portals provide a way to [render children into a DOM node that exists outside the hierarchy of the DOM component](/docs/portals.html).
+ポータルを作成します。ポータルは [DOM コンポーネントの階層の外側に存在している DOM ノードに対して子要素を描画する](/docs/portals.html)方法を提供します。

From facce61f92a718d3253675cb21387dcd3148175a Mon Sep 17 00:00:00 2001
From: Masayuki Goto <originals0711@gmail.com>
Date: Sun, 3 Feb 2019 08:16:26 +0900
Subject: [PATCH 2/7] trim half-width space after punctuation

---
 content/docs/reference-react-dom.md | 22 +++++++++++-----------
 1 file changed, 11 insertions(+), 11 deletions(-)

diff --git a/content/docs/reference-react-dom.md b/content/docs/reference-react-dom.md
index 692e6e250..de4b81653 100644
--- a/content/docs/reference-react-dom.md
+++ b/content/docs/reference-react-dom.md
@@ -6,7 +6,7 @@ category: Reference
 permalink: docs/react-dom.html
 ---
 
-`<script>` タグから React をロードすると、以下のトップレベル API をグローバル変数 `ReactDOM` で使用することができます。 npm と ES6 を使用している場合は、`import ReactDOM from 'react-dom'` と記述できます。 npm と ES5 を使用している場合は、`var ReactDOM = require('react-dom')` と記述できます。
+`<script>` タグから React をロードすると、以下のトップレベル API をグローバル変数 `ReactDOM` で使用することができます。npm と ES6 を使用している場合は、`import ReactDOM from 'react-dom'` と記述できます。npm と ES5 を使用している場合は、`var ReactDOM = require('react-dom')` と記述できます。
 
 ## 概要
 
@@ -20,7 +20,7 @@ permalink: docs/react-dom.html
 
 ### ブラウザサポート
 
-React は Internet Explorer 9 以降を含む全ての一般的なブラウザをサポートしていますが、 IE 9 や IE 10 といった古いブラウザでは[一部のポリフィルが必要です](/docs/javascript-environment-requirements.html)。
+React は Internet Explorer 9 以降を含む全ての一般的なブラウザをサポートしていますが、IE 9 や IE 10 といった古いブラウザでは[一部のポリフィルが必要です](/docs/javascript-environment-requirements.html)。
 
 > 注意
 >
@@ -52,7 +52,7 @@ React 要素がすでに `container` にレンダーされている場合は更
 > しかし、この戻り値を使用する方法は古く、将来のバージョンの React では一部のケースで非同期にコンポーネントをレンダーするようになる可能性があるため、使用は避けるべきです。
 > ルートの `ReactComponent` インスタンスへの reference が必要な場合は、ルート要素に[コールバックの ref](/docs/more-about-refs.html#the-ref-callback-attribute) を追加することを推奨します。
 >
-> サーバーで描画されたコンテナをハイドレートするために `ReactDOM.render()` を使用することは非推奨となり、 React 17 では削除されます。代わりに [`hydrate()`](#hydrate) を使用してください。
+> サーバーで描画されたコンテナをハイドレートするために `ReactDOM.render()` を使用することは非推奨となり、React 17 では削除されます。代わりに [`hydrate()`](#hydrate) を使用してください。
 
 * * *
 
@@ -62,15 +62,15 @@ React 要素がすでに `container` にレンダーされている場合は更
 ReactDOM.hydrate(element, container[, callback])
 ```
 
-[`render()`](#render) と同様ですが、 [`ReactDOMServer`](/docs/react-dom-server.html) により HTML コンテンツが描画されたコンテナをハイドレートするために使用されます。 React は既存のマークアップにイベントリスナをアタッチしようとします。
+[`render()`](#render) と同様ですが、[`ReactDOMServer`](/docs/react-dom-server.html) により HTML コンテンツが描画されたコンテナをハイドレートするために使用されます。React は既存のマークアップにイベントリスナをアタッチしようとします。
 
-React は描画された内容が、サーバー・クライアント間で同一であることを期待します。 React はテキストコンテンツの差異を修復することは可能ですが、その不一致はバグとして扱い、それらを修正すべきです。開発用モードでは、 React はハイドレート中の不一致について警告します。不一致がある場合に属性の差異が修復されるという保証はありません。これはパフォーマンス上の理由から重要です。なぜなら、ほとんどのアプリケーションにおいて不一致が発生というすることは稀であり、全てのマークアップを検証することはとてつもなく高コストになるためです。
+React は描画された内容が、サーバー・クライアント間で同一であることを期待します。React はテキストコンテンツの差異を修復することは可能ですが、その不一致はバグとして扱い、それらを修正すべきです。開発用モードでは、React はハイドレート中の不一致について警告します。不一致がある場合に属性の差異が修復されるという保証はありません。これはパフォーマンス上の理由から重要です。なぜなら、ほとんどのアプリケーションにおいて不一致が発生というすることは稀であり、全てのマークアップを検証することはとてつもなく高コストになるためです。
 
-単一要素の属性やテキストコンテンツがサーバー・クライアント間においてやむを得ず差異が生じる場合（例えばタイムスタンプなど）、要素に `suppressHydrationWarning={true}` を追加することで警告の発生を停止させることが可能です。それは 1 階層下の要素まで機能しますが、避難ハッチであることを意図しています。多用しないでください。テキストコンテンツでない限り、 React は修復を試行しようとはしないため、将来の更新まで矛盾が残る可能性があります。
+単一要素の属性やテキストコンテンツがサーバー・クライアント間においてやむを得ず差異が生じる場合（例えばタイムスタンプなど）、要素に `suppressHydrationWarning={true}` を追加することで警告の発生を停止させることが可能です。それは 1 階層下の要素まで機能しますが、避難ハッチであることを意図しています。多用しないでください。テキストコンテンツでない限り、React は修復を試行しようとはしないため、将来の更新まで矛盾が残る可能性があります。
 
-サーバーとクライアントで異なるものを描画したい場合は、 2 つのパスに分けた描画を使用することができます。クライアント側の異なるものを描画するコンポーネントでは、 `this.state.isClient` のような state 変数を読み込み、 `componentDidMount()` で `true` を設定することができます。この方法では、最初の描画パスではサーバー側と同一の内容を描画し、不一致を回避しますが、もう一方のパスがハイドレートの直後に発生します。このアプローチでは 2 回描画が発生することによりコンポーネントのパフォーマンスが遅くなりますので、注意して使用して下さい。
+サーバーとクライアントで異なるものを描画したい場合は、2 つのパスに分けた描画を使用することができます。クライアント側の異なるものを描画するコンポーネントでは、`this.state.isClient` のような state 変数を読み込み、`componentDidMount()` で `true` を設定することができます。この方法では、最初の描画パスではサーバー側と同一の内容を描画し、不一致を回避しますが、もう一方のパスがハイドレートの直後に発生します。このアプローチでは 2 回描画が発生することによりコンポーネントのパフォーマンスが遅くなりますので、注意して使用して下さい。
 
-低速な接続下でのユーザー体験に留意することを忘れないでください。 JavaScript のコードは初回の HTML の描画より大幅に遅くロードされる可能性があるため、クライアントのみのパスで何か異なるものを描画した場合、その遷移は不快感を与える可能性があります。しかしうまく実行されれば、サーバー上でアプリケーションの「殻」を描画し、クライアント上でのみ追加のウィジェットを表示することが有益になるかもしれません。マークアップの不一致の問題に発生させずにこれを実行する方法については、前の段落の説明をご参照下さい。
+低速な接続下でのユーザー体験に留意することを忘れないでください。JavaScript のコードは初回の HTML の描画より大幅に遅くロードされる可能性があるため、クライアントのみのパスで何か異なるものを描画した場合、その遷移は不快感を与える可能性があります。しかしうまく実行されれば、サーバー上でアプリケーションの「殻」を描画し、クライアント上でのみ追加のウィジェットを表示することが有益になるかもしれません。マークアップの不一致の問題に発生させずにこれを実行する方法については、前の段落の説明をご参照下さい。
 
 * * *
 
@@ -88,14 +88,14 @@ DOM からマウントされた React コンポーネントを削除し、イベ
 
 > 注意:
 >
-> `findDOMNode` は基盤となる DOM ノードにアクセスするために使用される避難ハッチです。ほとんどのケースにおいて、この避難ハッチの使用はコンポーネントの抽象化に穴を開けてしまうことになるためおすすめしません。 [`StrictMode` では非推奨になっています。](/docs/strict-mode.html#warning-about-deprecated-finddomnode-usage)
+> `findDOMNode` は基盤となる DOM ノードにアクセスするために使用される避難ハッチです。ほとんどのケースにおいて、この避難ハッチの使用はコンポーネントの抽象化に穴を開けてしまうことになるためおすすめしません。[`StrictMode` では非推奨になっています。](/docs/strict-mode.html#warning-about-deprecated-finddomnode-usage)
 
 ```javascript
 ReactDOM.findDOMNode(component)
 ```
-DOM にこのコンポーネントがマウントされている場合、このメソッドは対応するネイティブブラウザの DOM 要素を返します。このメソッドはフォームフィールドの値のような DOM の外側の値を読み取ったり DOM の計測を行ったりするのに便利です。**ほとんどのケースにおいて、 DOM ノードに ref をアタッチすることが可能であり、 `findDOMNode` の使用を避けることができます。**
+DOM にこのコンポーネントがマウントされている場合、このメソッドは対応するネイティブブラウザの DOM 要素を返します。このメソッドはフォームフィールドの値のような DOM の外側の値を読み取ったり DOM の計測を行ったりするのに便利です。**ほとんどのケースにおいて、DOM ノードに ref をアタッチすることが可能であり、`findDOMNode` の使用を避けることができます。**
 
-コンポーネントが `null` や `false` を描画する場合、 `findDOMNode` は `null` を返します。コンポーネントが文字列を描画する場合、 `findDOMNode` はその値を含んだテキスト DOM ノードを返します。 React 16 以降、コンポーネントは複数の子要素を含むフラグメントを返すことがありますが、その場合 `findDOMNode` は最初の空でない子要素に対応する DOM ノードを返します。
+コンポーネントが `null` や `false` を描画する場合、`findDOMNode` は `null` を返します。コンポーネントが文字列を描画する場合、`findDOMNode` はその値を含んだテキスト DOM ノードを返します。React 16 以降、コンポーネントは複数の子要素を含むフラグメントを返すことがありますが、その場合 `findDOMNode` は最初の空でない子要素に対応する DOM ノードを返します。
 
 > 注意:
 >

From c52edf04f8ea2f8a86b7554a134df7089873f414 Mon Sep 17 00:00:00 2001
From: Masayuki Goto <originals0711@gmail.com>
Date: Sun, 3 Feb 2019 08:22:01 +0900
Subject: [PATCH 3/7] fix translation of note

---
 content/docs/reference-react-dom.md | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/content/docs/reference-react-dom.md b/content/docs/reference-react-dom.md
index de4b81653..56c62416d 100644
--- a/content/docs/reference-react-dom.md
+++ b/content/docs/reference-react-dom.md
@@ -22,7 +22,7 @@ permalink: docs/react-dom.html
 
 React は Internet Explorer 9 以降を含む全ての一般的なブラウザをサポートしていますが、IE 9 や IE 10 といった古いブラウザでは[一部のポリフィルが必要です](/docs/javascript-environment-requirements.html)。
 
-> 注意
+> 補足
 >
 > React は ES5 をサポートしていない古いブラウザをサポートしていませんが、ページ内に [es5-shim や es5-sham](https://github.com/es-shims/es5-shim) のようなポリフィルが含まれている場合、古いブラウザでもアプリケーションが動作することがあります。この手段を選択するかどうかは自己責任で判断してください。
 
@@ -42,7 +42,7 @@ React 要素がすでに `container` にレンダーされている場合は更
 
 オプションのコールバックが提供されている場合は、コンポーネントがレンダーまたは更新された後に実行されます。
 
-> 注意:
+> 補足:
 >
 > `ReactDOM.render()` は与えられたコンテナの内容を制御します。コンテナ内部のあらゆる既存の DOM 要素は、最初に呼び出された時に置き換えられます。後続する呼び出しでは効率的な更新のために React の DOM 差分アルゴリズムを使用します。
 >
@@ -86,7 +86,7 @@ DOM からマウントされた React コンポーネントを削除し、イベ
 
 ### `findDOMNode()`
 
-> 注意:
+> 補足:
 >
 > `findDOMNode` は基盤となる DOM ノードにアクセスするために使用される避難ハッチです。ほとんどのケースにおいて、この避難ハッチの使用はコンポーネントの抽象化に穴を開けてしまうことになるためおすすめしません。[`StrictMode` では非推奨になっています。](/docs/strict-mode.html#warning-about-deprecated-finddomnode-usage)
 
@@ -97,7 +97,7 @@ DOM にこのコンポーネントがマウントされている場合、この
 
 コンポーネントが `null` や `false` を描画する場合、`findDOMNode` は `null` を返します。コンポーネントが文字列を描画する場合、`findDOMNode` はその値を含んだテキスト DOM ノードを返します。React 16 以降、コンポーネントは複数の子要素を含むフラグメントを返すことがありますが、その場合 `findDOMNode` は最初の空でない子要素に対応する DOM ノードを返します。
 
-> 注意:
+> 補足:
 >
 > `findDOMNode` はマウントされたコンポーネントに対してのみ機能します（つまり、DOM に配置されたコンポーネント）。まだマウントされていないコンポーネントにおいてこのメソッドを呼ぼうとする場合（まだ作成されていないコンポーネントにおける `render()` の中で `findDOMNode()` を呼びだす場合など）、例外がスローされます。
 >

From 67b961466f34757e813c948dec32bd8ff1a5386b Mon Sep 17 00:00:00 2001
From: Masayuki Goto <originals0711@gmail.com>
Date: Sun, 3 Feb 2019 08:59:33 +0900
Subject: [PATCH 4/7] fix translations pointed out

---
 content/docs/reference-react-dom.md | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

diff --git a/content/docs/reference-react-dom.md b/content/docs/reference-react-dom.md
index 56c62416d..7f5ffbef6 100644
--- a/content/docs/reference-react-dom.md
+++ b/content/docs/reference-react-dom.md
@@ -36,11 +36,11 @@ React は Internet Explorer 9 以降を含む全ての一般的なブラウザ
 ReactDOM.render(element, container[, callback])
 ```
 
-提供された `container` の DOM に React 要素をレンダーし、コンポーネントへの [reference](/docs/more-about-refs.html)（[ステートレスコンポーネント](/docs/components-and-props.html#functional-and-class-components)の場合は `null`）を返します。
+渡された `container` の DOM に React 要素をレンダーし、コンポーネントへの[参照](/docs/more-about-refs.html)（[ステートレスコンポーネント](/docs/components-and-props.html#functional-and-class-components)の場合は `null`）を返します。
 
 React 要素がすでに `container` にレンダーされている場合は更新を行い、最新の React 要素を反映するために必要な DOM のみを変更します。
 
-オプションのコールバックが提供されている場合は、コンポーネントがレンダーまたは更新された後に実行されます。
+オプションのコールバックが渡されている場合は、コンポーネントがレンダーまたは更新された後に実行されます。
 
 > 補足:
 >
@@ -48,11 +48,11 @@ React 要素がすでに `container` にレンダーされている場合は更
 >
 > `ReactDOM.render()` はコンテナノードを変更しません（コンテナの子要素のみ変更します）。既存の子要素を上書きせずに既存の DOM ノードをコンポーネントに挿入することが可能な場合があります。
 >
-> `ReactDOM.render()` は現時点ではルートの `ReactComponent` インスタンスへの reference を返します。
+> `ReactDOM.render()` は現時点ではルートの `ReactComponent` インスタンスへの参照を返します。
 > しかし、この戻り値を使用する方法は古く、将来のバージョンの React では一部のケースで非同期にコンポーネントをレンダーするようになる可能性があるため、使用は避けるべきです。
-> ルートの `ReactComponent` インスタンスへの reference が必要な場合は、ルート要素に[コールバックの ref](/docs/more-about-refs.html#the-ref-callback-attribute) を追加することを推奨します。
+> ルートの `ReactComponent` インスタンスへの参照が必要な場合は、ルート要素に[コールバックの ref](/docs/more-about-refs.html#the-ref-callback-attribute) を追加することを推奨します。
 >
-> サーバーで描画されたコンテナをハイドレートするために `ReactDOM.render()` を使用することは非推奨となり、React 17 では削除されます。代わりに [`hydrate()`](#hydrate) を使用してください。
+> サーバーで描画されたコンテナをクライアントと合わせるために `ReactDOM.render()` を使用することは非推奨となり、React 17 では削除されます。代わりに [`hydrate()`](#hydrate) を使用してください。
 
 * * *
 
@@ -62,15 +62,15 @@ React 要素がすでに `container` にレンダーされている場合は更
 ReactDOM.hydrate(element, container[, callback])
 ```
 
-[`render()`](#render) と同様ですが、[`ReactDOMServer`](/docs/react-dom-server.html) により HTML コンテンツが描画されたコンテナをハイドレートするために使用されます。React は既存のマークアップにイベントリスナをアタッチしようとします。
+[`render()`](#render) と同様ですが、[`ReactDOMServer`](/docs/react-dom-server.html) により HTML コンテンツが描画されたコンテナをクライアントと合わせるために使用されます。React は既存のマークアップにイベントリスナをアタッチしようとします。
 
-React は描画された内容が、サーバー・クライアント間で同一であることを期待します。React はテキストコンテンツの差異を修復することは可能ですが、その不一致はバグとして扱い、それらを修正すべきです。開発用モードでは、React はハイドレート中の不一致について警告します。不一致がある場合に属性の差異が修復されるという保証はありません。これはパフォーマンス上の理由から重要です。なぜなら、ほとんどのアプリケーションにおいて不一致が発生というすることは稀であり、全てのマークアップを検証することはとてつもなく高コストになるためです。
+React は描画された内容が、サーバー・クライアント間で同一であることを期待します。React はテキストコンテンツの差異を修復することは可能ですが、その不一致はバグとして扱い、それらを修正すべきです。開発用モードでは、React は描画された内容をクライアントと合わせている間の不一致について警告します。不一致がある場合に属性の差異が修復されるという保証はありません。これはパフォーマンス上の理由から重要です。なぜなら、ほとんどのアプリケーションにおいて不一致が発生というすることは稀であり、全てのマークアップを検証することはとてつもなく高コストになるためです。
 
 単一要素の属性やテキストコンテンツがサーバー・クライアント間においてやむを得ず差異が生じる場合（例えばタイムスタンプなど）、要素に `suppressHydrationWarning={true}` を追加することで警告の発生を停止させることが可能です。それは 1 階層下の要素まで機能しますが、避難ハッチであることを意図しています。多用しないでください。テキストコンテンツでない限り、React は修復を試行しようとはしないため、将来の更新まで矛盾が残る可能性があります。
 
-サーバーとクライアントで異なるものを描画したい場合は、2 つのパスに分けた描画を使用することができます。クライアント側の異なるものを描画するコンポーネントでは、`this.state.isClient` のような state 変数を読み込み、`componentDidMount()` で `true` を設定することができます。この方法では、最初の描画パスではサーバー側と同一の内容を描画し、不一致を回避しますが、もう一方のパスがハイドレートの直後に発生します。このアプローチでは 2 回描画が発生することによりコンポーネントのパフォーマンスが遅くなりますので、注意して使用して下さい。
+サーバーとクライアントで異なるものを描画したい場合は、2 つのパスに分けた描画を使用することができます。クライアント側の異なるものを描画するコンポーネントでは、`this.state.isClient` のような state 変数を読み込み、`componentDidMount()` で `true` を設定することができます。この方法では、最初の描画パスではサーバー側と同一の内容を描画し、不一致を回避しますが、もう一方のパスがハイドレートの直後に発生します。このアプローチでは 2 回描画が発生することによりコンポーネントのパフォーマンスが遅くなりますので、注意して使用してください。
 
-低速な接続下でのユーザー体験に留意することを忘れないでください。JavaScript のコードは初回の HTML の描画より大幅に遅くロードされる可能性があるため、クライアントのみのパスで何か異なるものを描画した場合、その遷移は不快感を与える可能性があります。しかしうまく実行されれば、サーバー上でアプリケーションの「殻」を描画し、クライアント上でのみ追加のウィジェットを表示することが有益になるかもしれません。マークアップの不一致の問題に発生させずにこれを実行する方法については、前の段落の説明をご参照下さい。
+低速な接続下でのユーザー体験に留意することを忘れないでください。JavaScript のコードは初回の HTML の描画より大幅に遅くロードされる可能性があるため、クライアントのみのパスで何か異なるものを描画した場合、その遷移は不快感を与える可能性があります。しかしうまく実行されれば、サーバー上でアプリケーションの「外枠」を描画し、クライアント上でのみ追加のウィジェットを表示することが有益になるかもしれません。マークアップの不一致の問題を発生させずにこれを実行する方法については、前の段落の説明をご参照ください。
 
 * * *
 

From e69d6c2b93e59c80814c79dcbf1996234b5388b7 Mon Sep 17 00:00:00 2001
From: Masayuki Goto <originals0711@gmail.com>
Date: Tue, 5 Feb 2019 14:10:38 +0900
Subject: [PATCH 5/7] fix a bit

---
 content/docs/reference-react-dom.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/content/docs/reference-react-dom.md b/content/docs/reference-react-dom.md
index 7f5ffbef6..481cb8a7c 100644
--- a/content/docs/reference-react-dom.md
+++ b/content/docs/reference-react-dom.md
@@ -64,11 +64,11 @@ ReactDOM.hydrate(element, container[, callback])
 
 [`render()`](#render) と同様ですが、[`ReactDOMServer`](/docs/react-dom-server.html) により HTML コンテンツが描画されたコンテナをクライアントと合わせるために使用されます。React は既存のマークアップにイベントリスナをアタッチしようとします。
 
-React は描画された内容が、サーバー・クライアント間で同一であることを期待します。React はテキストコンテンツの差異を修復することは可能ですが、その不一致はバグとして扱い、それらを修正すべきです。開発用モードでは、React は描画された内容をクライアントと合わせている間の不一致について警告します。不一致がある場合に属性の差異が修復されるという保証はありません。これはパフォーマンス上の理由から重要です。なぜなら、ほとんどのアプリケーションにおいて不一致が発生というすることは稀であり、全てのマークアップを検証することはとてつもなく高コストになるためです。
+React は描画された内容が、サーバー・クライアント間で同一であることを期待します。React はテキストコンテンツの差異を修復することは可能ですが、その不一致はバグとして扱い、それらを修正すべきです。開発用モードでは、React は描画された内容をクライアントと合わせている間の不一致について警告します。不一致がある場合に属性の差異が修復されるという保証はありません。これはパフォーマンス上の理由から重要です。なぜなら、ほとんどのアプリケーションにおいて不一致が発生するということは稀であり、全てのマークアップを検証することはとてつもなく高コストになるためです。
 
 単一要素の属性やテキストコンテンツがサーバー・クライアント間においてやむを得ず差異が生じる場合（例えばタイムスタンプなど）、要素に `suppressHydrationWarning={true}` を追加することで警告の発生を停止させることが可能です。それは 1 階層下の要素まで機能しますが、避難ハッチであることを意図しています。多用しないでください。テキストコンテンツでない限り、React は修復を試行しようとはしないため、将来の更新まで矛盾が残る可能性があります。
 
-サーバーとクライアントで異なるものを描画したい場合は、2 つのパスに分けた描画を使用することができます。クライアント側の異なるものを描画するコンポーネントでは、`this.state.isClient` のような state 変数を読み込み、`componentDidMount()` で `true` を設定することができます。この方法では、最初の描画パスではサーバー側と同一の内容を描画し、不一致を回避しますが、もう一方のパスがハイドレートの直後に発生します。このアプローチでは 2 回描画が発生することによりコンポーネントのパフォーマンスが遅くなりますので、注意して使用してください。
+サーバーとクライアントで異なるものを描画したい場合は、2 つのパスに分けた描画を使用することができます。クライアント側の異なるものを描画するコンポーネントでは、`this.state.isClient` のような state 変数を読み込み、`componentDidMount()` で `true` を設定することができます。この方法では、最初の描画パスではサーバー側と同一の内容を描画し、不一致を回避しますが、もう一方のパスが描画内容をクライアントと合わせる処理の直後に発生します。このアプローチでは 2 回描画が発生することによりコンポーネントのパフォーマンスが遅くなりますので、注意して使用してください。
 
 低速な接続下でのユーザー体験に留意することを忘れないでください。JavaScript のコードは初回の HTML の描画より大幅に遅くロードされる可能性があるため、クライアントのみのパスで何か異なるものを描画した場合、その遷移は不快感を与える可能性があります。しかしうまく実行されれば、サーバー上でアプリケーションの「外枠」を描画し、クライアント上でのみ追加のウィジェットを表示することが有益になるかもしれません。マークアップの不一致の問題を発生させずにこれを実行する方法については、前の段落の説明をご参照ください。
 

From 53eecd27c9303551bea2cbcf7a69f324757ad74d Mon Sep 17 00:00:00 2001
From: Toru Kobayashi <koba0004@gmail.com>
Date: Wed, 6 Feb 2019 09:36:58 +0900
Subject: [PATCH 6/7] Apply suggestions from code review

Co-Authored-By: gotchane <20318418+gotchane@users.noreply.github.com>
---
 content/docs/reference-react-dom.md | 22 +++++++++++-----------
 1 file changed, 11 insertions(+), 11 deletions(-)

diff --git a/content/docs/reference-react-dom.md b/content/docs/reference-react-dom.md
index 481cb8a7c..8cd00db4b 100644
--- a/content/docs/reference-react-dom.md
+++ b/content/docs/reference-react-dom.md
@@ -10,7 +10,7 @@ permalink: docs/react-dom.html
 
 ## 概要
 
-`react-dom` パッケージには、アプリケーションのトップレベルで、また必要に応じて React モデルから抜け出すための避難ハッチとして使用できる DOM 固有のメソッドが用意されています。ほとんどのコンポーネントでは、このモジュールを使用する必要はないはずです。
+`react-dom` パッケージには、DOM 固有のメソッドが用意されており、アプリケーションのトップレベルや、必要に応じて React モデルから外れるための避難ハッチとして使用できます。ほとんどのコンポーネントでは、このモジュールを使用する必要はないはずです。
 
 - [`render()`](#render)
 - [`hydrate()`](#hydrate)
@@ -20,7 +20,7 @@ permalink: docs/react-dom.html
 
 ### ブラウザサポート
 
-React は Internet Explorer 9 以降を含む全ての一般的なブラウザをサポートしていますが、IE 9 や IE 10 といった古いブラウザでは[一部のポリフィルが必要です](/docs/javascript-environment-requirements.html)。
+React は Internet Explorer 9 以降を含む全ての一般的なブラウザをサポートしていますが、IE 9 や IE 10 といった古いブラウザでは[いくつかのポリフィルが必要です](/docs/javascript-environment-requirements.html)。
 
 > 補足
 >
@@ -46,13 +46,13 @@ React 要素がすでに `container` にレンダーされている場合は更
 >
 > `ReactDOM.render()` は与えられたコンテナの内容を制御します。コンテナ内部のあらゆる既存の DOM 要素は、最初に呼び出された時に置き換えられます。後続する呼び出しでは効率的な更新のために React の DOM 差分アルゴリズムを使用します。
 >
-> `ReactDOM.render()` はコンテナノードを変更しません（コンテナの子要素のみ変更します）。既存の子要素を上書きせずに既存の DOM ノードをコンポーネントに挿入することが可能な場合があります。
+> `ReactDOM.render()` はコンテナノードを変更しません（コンテナの子要素のみ変更します）。既存の子要素を上書きせずにコンポーネントを既存の DOM ノードに挿入することが可能な場合があります。
 >
 > `ReactDOM.render()` は現時点ではルートの `ReactComponent` インスタンスへの参照を返します。
 > しかし、この戻り値を使用する方法は古く、将来のバージョンの React では一部のケースで非同期にコンポーネントをレンダーするようになる可能性があるため、使用は避けるべきです。
 > ルートの `ReactComponent` インスタンスへの参照が必要な場合は、ルート要素に[コールバックの ref](/docs/more-about-refs.html#the-ref-callback-attribute) を追加することを推奨します。
 >
-> サーバーで描画されたコンテナをクライアントと合わせるために `ReactDOM.render()` を使用することは非推奨となり、React 17 では削除されます。代わりに [`hydrate()`](#hydrate) を使用してください。
+> サーバで描画されたコンテナをクライアントで再利用するために `ReactDOM.render()` を使用することは非推奨となり、React 17 では削除されます。代わりに [`hydrate()`](#hydrate) を使用してください。
 
 * * *
 
@@ -62,15 +62,15 @@ React 要素がすでに `container` にレンダーされている場合は更
 ReactDOM.hydrate(element, container[, callback])
 ```
 
-[`render()`](#render) と同様ですが、[`ReactDOMServer`](/docs/react-dom-server.html) により HTML コンテンツが描画されたコンテナをクライアントと合わせるために使用されます。React は既存のマークアップにイベントリスナをアタッチしようとします。
+[`render()`](#render) と同様ですが、[`ReactDOMServer`](/docs/react-dom-server.html) により HTML コンテンツが描画されたコンテナをクライアントで再利用するために使用されます。React は既存のマークアップにイベントリスナをアタッチしようとします。
 
-React は描画された内容が、サーバー・クライアント間で同一であることを期待します。React はテキストコンテンツの差異を修復することは可能ですが、その不一致はバグとして扱い、それらを修正すべきです。開発用モードでは、React は描画された内容をクライアントと合わせている間の不一致について警告します。不一致がある場合に属性の差異が修復されるという保証はありません。これはパフォーマンス上の理由から重要です。なぜなら、ほとんどのアプリケーションにおいて不一致が発生するということは稀であり、全てのマークアップを検証することはとてつもなく高コストになるためです。
+React は描画された内容が、サーバ・クライアント間で同一であることを期待します。React はテキストコンテンツの差異を修復することは可能ですが、その不一致はバグとして扱い、それらを修正すべきです。開発用モードでは、React は描画された内容をクライアントで再利用しようとする際の不一致について警告します。不一致がある場合に属性の差異が修復されるという保証はありません。これはパフォーマンス上の理由から重要です。なぜなら、ほとんどのアプリケーションにおいて不一致が発生するということは稀であり、全てのマークアップを検証することはとてつもなく高コストになるためです。
 
-単一要素の属性やテキストコンテンツがサーバー・クライアント間においてやむを得ず差異が生じる場合（例えばタイムスタンプなど）、要素に `suppressHydrationWarning={true}` を追加することで警告の発生を停止させることが可能です。それは 1 階層下の要素まで機能しますが、避難ハッチであることを意図しています。多用しないでください。テキストコンテンツでない限り、React は修復を試行しようとはしないため、将来の更新まで矛盾が残る可能性があります。
+単一要素の属性やテキストコンテンツがサーバ・クライアント間においてやむを得ず差異が生じる場合（例えばタイムスタンプなど）、要素に `suppressHydrationWarning={true}` を追加することで警告の発生を停止させることが可能です。それは 1 階層下の要素まで機能し、避難ハッチの意図があります。そのため、多用しないでください。テキストコンテンツでない限り、React は修復を試行しようとはしないため、将来の更新まで矛盾が残る可能性があります。
 
-サーバーとクライアントで異なるものを描画したい場合は、2 つのパスに分けた描画を使用することができます。クライアント側の異なるものを描画するコンポーネントでは、`this.state.isClient` のような state 変数を読み込み、`componentDidMount()` で `true` を設定することができます。この方法では、最初の描画パスではサーバー側と同一の内容を描画し、不一致を回避しますが、もう一方のパスが描画内容をクライアントと合わせる処理の直後に発生します。このアプローチでは 2 回描画が発生することによりコンポーネントのパフォーマンスが遅くなりますので、注意して使用してください。
+サーバとクライアントで異なるものを描画したい場合は、2 つのパスに分けた描画を使用できます。クライアント側で異なるものを描画するコンポーネントでは、`this.state.isClient` のような state 変数を読み込み、`componentDidMount()` で `true` を設定することができます。この方法では、最初の描画パスではサーバ側と同一の内容を描画し、不一致を回避しますが、続くパスがクライアントで再利用する処理の直後に発生します。このアプローチでは 2 回描画が発生することによりコンポーネントのパフォーマンスが遅くなりますので、注意して使用してください。
 
-低速な接続下でのユーザー体験に留意することを忘れないでください。JavaScript のコードは初回の HTML の描画より大幅に遅くロードされる可能性があるため、クライアントのみのパスで何か異なるものを描画した場合、その遷移は不快感を与える可能性があります。しかしうまく実行されれば、サーバー上でアプリケーションの「外枠」を描画し、クライアント上でのみ追加のウィジェットを表示することが有益になるかもしれません。マークアップの不一致の問題を発生させずにこれを実行する方法については、前の段落の説明をご参照ください。
+低速な接続下でのユーザー体験に留意することを忘れないでください。JavaScript のコードは初回の HTML の描画より大幅に遅れてロードされる可能性があるため、クライアントでのみ何か異なるものを描画した場合、その変化は不快感を与える可能性があります。しかしうまく実行されれば、サーバ上でアプリケーションの「外枠」を描画し、クライアント上でのみ追加のウィジェットを表示することは有益になるかもしれません。マークアップの不一致の問題を発生させずにこれを実行する方法については、前の段落の説明をご参照ください。
 
 * * *
 
@@ -88,12 +88,12 @@ DOM からマウントされた React コンポーネントを削除し、イベ
 
 > 補足:
 >
-> `findDOMNode` は基盤となる DOM ノードにアクセスするために使用される避難ハッチです。ほとんどのケースにおいて、この避難ハッチの使用はコンポーネントの抽象化に穴を開けてしまうことになるためおすすめしません。[`StrictMode` では非推奨になっています。](/docs/strict-mode.html#warning-about-deprecated-finddomnode-usage)
+> `findDOMNode` は内在する DOM ノードにアクセスするために使用される避難ハッチです。ほとんどのケースにおいて、この避難ハッチの使用はコンポーネントの抽象化に穴を開けてしまうためおすすめしません。[`StrictMode` では非推奨になっています。](/docs/strict-mode.html#warning-about-deprecated-finddomnode-usage)
 
 ```javascript
 ReactDOM.findDOMNode(component)
 ```
-DOM にこのコンポーネントがマウントされている場合、このメソッドは対応するネイティブブラウザの DOM 要素を返します。このメソッドはフォームフィールドの値のような DOM の外側の値を読み取ったり DOM の計測を行ったりするのに便利です。**ほとんどのケースにおいて、DOM ノードに ref をアタッチすることが可能であり、`findDOMNode` の使用を避けることができます。**
+DOM にこのコンポーネントがマウントされている場合、このメソッドは対応するネイティブブラウザの DOM 要素を返します。このメソッドはフォームフィールドの値や DOM の大きさを計測するのに便利です。**ほとんどのケースにおいて、DOM ノードに ref をアタッチすることが可能であり、`findDOMNode` の使用を避けることができます。**
 
 コンポーネントが `null` や `false` を描画する場合、`findDOMNode` は `null` を返します。コンポーネントが文字列を描画する場合、`findDOMNode` はその値を含んだテキスト DOM ノードを返します。React 16 以降、コンポーネントは複数の子要素を含むフラグメントを返すことがありますが、その場合 `findDOMNode` は最初の空でない子要素に対応する DOM ノードを返します。
 

From 313e88d70231e66916c5a4af10bad640b5a1514b Mon Sep 17 00:00:00 2001
From: Soichiro Miki <smiki-tky@umin.ac.jp>
Date: Wed, 6 Feb 2019 19:27:26 +0900
Subject: [PATCH 7/7] Apply suggestions from code review

Co-Authored-By: gotchane <20318418+gotchane@users.noreply.github.com>
---
 content/docs/reference-react-dom.md | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/content/docs/reference-react-dom.md b/content/docs/reference-react-dom.md
index 8cd00db4b..ad4f8324b 100644
--- a/content/docs/reference-react-dom.md
+++ b/content/docs/reference-react-dom.md
@@ -10,7 +10,7 @@ permalink: docs/react-dom.html
 
 ## 概要
 
-`react-dom` パッケージには、DOM 固有のメソッドが用意されており、アプリケーションのトップレベルや、必要に応じて React モデルから外れるための避難ハッチとして使用できます。ほとんどのコンポーネントでは、このモジュールを使用する必要はないはずです。
+`react-dom` パッケージには、DOM 固有のメソッドが用意されており、アプリケーションのトップレベルで使用したり、必要に応じて React モデルから外れるための避難ハッチとして使用できます。ほとんどのコンポーネントでは、このモジュールを使用する必要はないはずです。
 
 - [`render()`](#render)
 - [`hydrate()`](#hydrate)
@@ -64,11 +64,11 @@ ReactDOM.hydrate(element, container[, callback])
 
 [`render()`](#render) と同様ですが、[`ReactDOMServer`](/docs/react-dom-server.html) により HTML コンテンツが描画されたコンテナをクライアントで再利用するために使用されます。React は既存のマークアップにイベントリスナをアタッチしようとします。
 
-React は描画された内容が、サーバ・クライアント間で同一であることを期待します。React はテキストコンテンツの差異を修復することは可能ですが、その不一致はバグとして扱い、それらを修正すべきです。開発用モードでは、React は描画された内容をクライアントで再利用しようとする際の不一致について警告します。不一致がある場合に属性の差異が修復されるという保証はありません。これはパフォーマンス上の理由から重要です。なぜなら、ほとんどのアプリケーションにおいて不一致が発生するということは稀であり、全てのマークアップを検証することはとてつもなく高コストになるためです。
+React はレンダーされる内容が、サーバ・クライアント間で同一であることを期待します。React はテキストコンテンツの差異を修復することは可能ですが、その不一致はバグとして扱い、修正すべきです。開発用モードでは、React は両者のレンダーの不一致について警告します。不一致がある場合に属性の差異が修復されるという保証はありません。これはパフォーマンス上の理由から重要です。なぜなら、ほとんどのアプリケーションにおいて不一致が発生するということは稀であり、全てのマークアップを検証することは許容不可能なほど高コストになるためです。
 
-単一要素の属性やテキストコンテンツがサーバ・クライアント間においてやむを得ず差異が生じる場合（例えばタイムスタンプなど）、要素に `suppressHydrationWarning={true}` を追加することで警告の発生を停止させることが可能です。それは 1 階層下の要素まで機能し、避難ハッチの意図があります。そのため、多用しないでください。テキストコンテンツでない限り、React は修復を試行しようとはしないため、将来の更新まで矛盾が残る可能性があります。
+単一要素の属性やテキストコンテンツがサーバ・クライアント間においてやむを得ず異なってしまう場合（例えばタイムスタンプなど）、要素に `suppressHydrationWarning={true}` を追加することで警告の発生を停止させることが可能です。それは 1 階層下の要素までで機能するものであり、また避難ハッチとして使われるものです。そのため、多用しないでください。テキストコンテンツでない限り、React は修復を試行しようとはしないため、将来の更新まで不整合が残る可能性があります。
 
-サーバとクライアントで異なるものを描画したい場合は、2 つのパスに分けた描画を使用できます。クライアント側で異なるものを描画するコンポーネントでは、`this.state.isClient` のような state 変数を読み込み、`componentDidMount()` で `true` を設定することができます。この方法では、最初の描画パスではサーバ側と同一の内容を描画し、不一致を回避しますが、続くパスがクライアントで再利用する処理の直後に発生します。このアプローチでは 2 回描画が発生することによりコンポーネントのパフォーマンスが遅くなりますので、注意して使用してください。
+サーバとクライアントで異なるものをレンダーしたい場合は、2 パスレンダーを使用できます。クライアント側で異なるものをレンダーするコンポーネントでは、`this.state.isClient` のような state 変数を読み込み、`componentDidMount()` で `true` を設定することができます。こうすると、最初のレンダーパスではサーバ側と同一の内容を描画して不一致を回避しますが、追加のパスが初回レンダーの直後に同期的に発生します。このアプローチでは 2 回レンダーが発生することによりコンポーネントのパフォーマンスが低下しますので、注意して使用してください。
 
 低速な接続下でのユーザー体験に留意することを忘れないでください。JavaScript のコードは初回の HTML の描画より大幅に遅れてロードされる可能性があるため、クライアントでのみ何か異なるものを描画した場合、その変化は不快感を与える可能性があります。しかしうまく実行されれば、サーバ上でアプリケーションの「外枠」を描画し、クライアント上でのみ追加のウィジェットを表示することは有益になるかもしれません。マークアップの不一致の問題を発生させずにこれを実行する方法については、前の段落の説明をご参照ください。
 
@@ -80,7 +80,7 @@ React は描画された内容が、サーバ・クライアント間で同一
 ReactDOM.unmountComponentAtNode(container)
 ```
 
-DOM からマウントされた React コンポーネントを削除し、イベントハンドラや state をクリーンアップします。コンテナにコンポーネントがマウントされていない場合、このメソッドを呼び出しても何も行いません。コンポーネントがアンマウントされた場合は `true` を返し、アンマウントされなかった場合は `false` を返します。
+DOM からマウントされた React コンポーネントを削除し、イベントハンドラや state をクリーンアップします。コンテナにコンポーネントがマウントされていない場合、このメソッドを呼び出しても何も行いません。コンポーネントがアンマウントされた場合は `true` を返し、アンマウントすべきコンポーネントが存在しなかった場合は `false` を返します。
 
 * * *
 
@@ -93,9 +93,9 @@ DOM からマウントされた React コンポーネントを削除し、イベ
 ```javascript
 ReactDOM.findDOMNode(component)
 ```
-DOM にこのコンポーネントがマウントされている場合、このメソッドは対応するネイティブブラウザの DOM 要素を返します。このメソッドはフォームフィールドの値や DOM の大きさを計測するのに便利です。**ほとんどのケースにおいて、DOM ノードに ref をアタッチすることが可能であり、`findDOMNode` の使用を避けることができます。**
+DOM にこのコンポーネントがマウントされている場合、このメソッドは対応するネイティブブラウザの DOM 要素を返します。このメソッドはフォームフィールドの値や DOM の大きさを計測するのに便利です。**ほとんどのケースにおいて、DOM ノードに ref をアタッチすることで `findDOMNode` の使用を避けることができます。**
 
-コンポーネントが `null` や `false` を描画する場合、`findDOMNode` は `null` を返します。コンポーネントが文字列を描画する場合、`findDOMNode` はその値を含んだテキスト DOM ノードを返します。React 16 以降、コンポーネントは複数の子要素を含むフラグメントを返すことがありますが、その場合 `findDOMNode` は最初の空でない子要素に対応する DOM ノードを返します。
+コンポーネントが `null` や `false` をレンダーする場合、`findDOMNode` は `null` を返します。コンポーネントが文字列をレンダーする場合、`findDOMNode` はその値を含んだテキスト DOM ノードを返します。React 16 以降、コンポーネントは複数の子要素を含むフラグメントを返すことがありますが、その場合 `findDOMNode` は最初の空でない子要素に対応する DOM ノードを返します。
 
 > 補足:
 >
@@ -111,4 +111,4 @@ DOM にこのコンポーネントがマウントされている場合、この
 ReactDOM.createPortal(child, container)
 ```
 
-ポータルを作成します。ポータルは [DOM コンポーネントの階層の外側に存在している DOM ノードに対して子要素を描画する](/docs/portals.html)方法を提供します。
+ポータルを作成します。ポータルは [DOM コンポーネントの階層の外側に存在している DOM ノードに対して子要素をレンダーする](/docs/portals.html)方法を提供します。