diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md
index ec0f78a8d..389836199 100644
--- a/content/docs/add-react-to-a-website.md
+++ b/content/docs/add-react-to-a-website.md
@@ -25,7 +25,7 @@ React は段階的に導入することができるように最初からデザ
 
 複雑なツール類や事前にインストールしておかなければいけないものはありません。**インターネットへの接続さえあれば、1 分間でこのセクションを終わらせることができます。**
 
-オプション：[お手本をダウンロードする (2KB ZIP圧縮)](https://gist.github.com/gaearon/6668a1f6986742109c00a581ce704605/archive/f6c882b6ae18bde42dcf6fdb751aae93495a2275.zip)
+オプション：[お手本をダウンロードする (2KB ZIP 圧縮)](https://gist.github.com/gaearon/6668a1f6986742109c00a581ce704605/archive/f6c882b6ae18bde42dcf6fdb751aae93495a2275.zip)
 
 ### ステップ 1：HTML に DOM コンテナを追加する {#step-1-add-a-dom-container-to-the-html}
 
@@ -94,19 +94,19 @@ React の導入についてもっと知るには、次のセクションも見
 
 **[完成したソースコードをみる](https://gist.github.com/gaearon/6668a1f6986742109c00a581ce704605)**
 
-**[完成したソースコードをダウンロードする (2KB ZIP圧縮)](https://gist.github.com/gaearon/6668a1f6986742109c00a581ce704605/archive/f6c882b6ae18bde42dcf6fdb751aae93495a2275.zip)**
+**[完成したソースコードをダウンロードする (2KB ZIP 圧縮)](https://gist.github.com/gaearon/6668a1f6986742109c00a581ce704605/archive/f6c882b6ae18bde42dcf6fdb751aae93495a2275.zip)**
 
 ### ヒント：コンポーネントを再利用する {#tip-reuse-a-component}
 
-React コンポーネントを HTML ページの一箇所だけではなくいろいろな箇所で使いたくなることがあるかもしれません。そこで「いいね」ボタンを3回繰り返し表示し、さらにそこにちょっとしたデータを渡すプログラムを用意しました。
+React コンポーネントを HTML ページの一箇所だけではなくいろいろな箇所で使いたくなることがあるかもしれません。そこで「いいね」ボタンを 3 回繰り返し表示し、さらにそこにちょっとしたデータを渡すプログラムを用意しました。
 
 [ソースコードをみる](https://gist.github.com/gaearon/faa67b76a6c47adbab04f739cba7ceda)
 
-[ソースコードをダウンロードする (2KB ZIP圧縮)](https://gist.github.com/gaearon/faa67b76a6c47adbab04f739cba7ceda/archive/9d0dd0ee941fea05fd1357502e5aa348abb84c12.zip)
+[ソースコードをダウンロードする (2KB ZIP 圧縮)](https://gist.github.com/gaearon/faa67b76a6c47adbab04f739cba7ceda/archive/9d0dd0ee941fea05fd1357502e5aa348abb84c12.zip)
 
 >補足
 >
->このようなやり方は、主に React を利用する DOM コンテナがページ内でお互いに干渉していない場合において便利な手段です。 React 単体のコードとしては、[コンポーネントを組み合わせる](/docs/components-and-props.html#composing-components) やり方のほうが手軽です。
+>このようなやり方は、主に React を利用する DOM コンテナがページ内でお互いに干渉していない場合において便利な手段です。React 単体のコードとしては、[コンポーネントを組み合わせる](/docs/components-and-props.html#composing-components) やり方のほうが手軽です。
 
 ### ヒント：本番環境用に JavaScript を圧縮する {#tip-minify-javascript-for-production}
 
@@ -176,7 +176,7 @@ JSX をプロジェクトに追加するためには、バンドルツールや
 >
 >ここでは **JSX プリプロセッサをインストールするためだけに npm を使っています**。それ以外の用途では必要ありません。React のソースコードもアプリケーションコードも引き続き `<script>` タグの中にそのまま書くことができます。
 
-お疲れ様です！　これで**本番環境用の JSX の設定**をプロジェクトに追加することができました。
+お疲れ様です！ これで**本番環境用の JSX の設定**をプロジェクトに追加することができました。
 
 
 ### JSX プリプロセッサを実行する {#run-jsx-preprocessor}
diff --git a/content/docs/addons-shallow-renderer.md b/content/docs/addons-shallow-renderer.md
index ca4567cff..575e074e2 100644
--- a/content/docs/addons-shallow-renderer.md
+++ b/content/docs/addons-shallow-renderer.md
@@ -59,7 +59,7 @@ expect(result.props.children).toEqual([
 
 shallowRenderer は、テストしているコンポーネントをレンダーするための「場所」と捉えることができ、そこからコンポーネントの出力を抽出できます。
 
-`shallowRenderer.render()` は [`ReactDOM.render()`](/docs/react-dom.html#render) に似ていますが、 DOM を必要とせず、1 階層だけレンダーします。つまり、テスト対象のコンポーネントが持つ子コンポーネントの実装から分離してテストを実行できます。
+`shallowRenderer.render()` は [`ReactDOM.render()`](/docs/react-dom.html#render) に似ていますが、DOM を必要とせず、1 階層だけレンダーします。つまり、テスト対象のコンポーネントが持つ子コンポーネントの実装から分離してテストを実行できます。
 
 ### `shallowRenderer.getRenderOutput()` {#shallowrenderergetrenderoutput}
 
diff --git a/content/docs/code-splitting.md b/content/docs/code-splitting.md
index 330cf678a..52b2902a0 100644
--- a/content/docs/code-splitting.md
+++ b/content/docs/code-splitting.md
@@ -6,7 +6,7 @@ permalink: docs/code-splitting.html
 
 ## バンドル {#bundling}
 
-多くの React アプリケーションは、[Webpack](https://webpack.js.org/)や [Browserify](http://browserify.org/) などの
+多くの React アプリケーションは、[Webpack](https://webpack.js.org/) や [Browserify](http://browserify.org/) などの
 ツールを使ってファイルを「バンドル」しています。
 バンドルはインポートされたファイルをたどって、それらを 1 つのファイルにまとめるプロセスです。
 このバンドルされたファイルを Web ページ内に置くことによって、アプリ全体を一度に読み込むことができます。
@@ -92,9 +92,9 @@ import("./math").then(math => {
 > 現時点ではまだ言語標準となっていません。
 > 近い将来での標準化が期待されています。
 
-Webpackがこの構文を見つけると、自動的にアプリのコードを分割します。
+Webpack がこの構文を見つけると、自動的にアプリのコードを分割します。
 Create React App を使用している場合はすでに設定がされているため、[すぐに使用を開始することができます。](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#code-splitting)
-Next.jsも同様です。
+Next.js も同様です。
 
 もし Webpack を自分でセットアップしていた場合には、Webpack の[コード分割に関するガイド](https://webpack.js.org/guides/code-splitting/)を読むと良いでしょう。
 きっとあなたの Webpack の設定はだいたい[このように](https://gist.github.com/gaearon/ca6e803f5c604d37468b0091d9959269)なると思います。
diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md
index 45d81c6ee..fc6617574 100644
--- a/content/docs/components-and-props.md
+++ b/content/docs/components-and-props.md
@@ -95,7 +95,7 @@ ReactDOM.render(
 
 コンポーネントは自身の出力の中で他のコンポーネントを参照できます。これにより、どの詳細度のレベルにおいても、コンポーネントという単一の抽象化を利用できます。ボタン、フォーム、ダイアログ、画面：React アプリでは、これらは共通してコンポーネントとして表現されます。
 
-例えば、 `Welcome` を何回もレンダリングする `App` コンポーネントを作成できます：
+例えば、`Welcome` を何回もレンダリングする `App` コンポーネントを作成できます：
 
 ```js{8-10}
 function Welcome(props) {
@@ -255,8 +255,8 @@ function withdraw(account, amount) {
 }
 ```
 
-React は柔軟ですが、1つだけ厳格なルールがあります：
+React は柔軟ですが、1 つだけ厳格なルールがあります：
 
 **全ての React コンポーネントは、自己の props に対して純関数のように振る舞わねばなりません。**
 
-もちろんアプリケーションの UI は動的で、時間に応じて変化するものです。[next section](/docs/state-and-lifecycle.html)では、"state" という新しい概念を紹介します。state により React コンポーネントは上述のルールを壊すことなく、時間と共にユーザのアクション、ネットワークのレスポンスや他の様々な事に反応して、出力を変更することができます。
\ No newline at end of file
+もちろんアプリケーションの UI は動的で、時間に応じて変化するものです。[next section](/docs/state-and-lifecycle.html) では、"state" という新しい概念を紹介します。state により React コンポーネントは上述のルールを壊すことなく、時間と共にユーザのアクション、ネットワークのレスポンスや他の様々な事に反応して、出力を変更することができます。
\ No newline at end of file
diff --git a/content/docs/composition-vs-inheritance.md b/content/docs/composition-vs-inheritance.md
index 47b81bed9..28d1ad497 100644
--- a/content/docs/composition-vs-inheritance.md
+++ b/content/docs/composition-vs-inheritance.md
@@ -47,7 +47,7 @@ function WelcomeDialog() {
 
 **[Try it on CodePen](https://codepen.io/gaearon/pen/ozqNOV?editors=0010)**
 
-`<FancyBorder>` JSX タグの内側のあらゆる要素は `FancyBorder` に `children` という props として渡されます。 `FancyBorder` は `<div>` の内側に `{props.children}` をレンダリングするので、渡された要素が出力されます。
+`<FancyBorder>` JSX タグの内側のあらゆる要素は `FancyBorder` に `children` という props として渡されます。`FancyBorder` は `<div>` の内側に `{props.children}` をレンダリングするので、渡された要素が出力されます。
 
 あまり一般的ではありませんが、複数の箇所に子要素を追加したいケースも考えられます。そのようなケースでは以下のように `children` の props の代わりに独自の props を作成して渡すことができます。
 
diff --git a/content/docs/create-a-new-react-app.md b/content/docs/create-a-new-react-app.md
index 9c30b0f1d..03b952714 100644
--- a/content/docs/create-a-new-react-app.md
+++ b/content/docs/create-a-new-react-app.md
@@ -73,7 +73,7 @@ Gatsby の[オフィシャルガイド](https://www.gatsbyjs.org/docs/) およ
 
 - **[Neutrino](https://neutrinojs.org/)** は [webpack](https://webpack.js.org/) のパワーとプリセットのシンプルさを兼ね備えています。プリセットには [React アプリ](https://neutrinojs.org/packages/react/) と [React コンポーネント](https://neutrinojs.org/packages/react-components/)用のものがあります。
 
-- **[nwb](https://github.com/insin/nwb)** は [npm で React コンポーネントを公開する](https://github.com/insin/nwb/blob/master/docs/guides/ReactComponents.md#developing-react-components-and-libraries-with-nwb)ことに特に優れています。React アプリを作成するのにも[利用](https://github.com/insin/nwb/blob/master/docs/guides/ReactApps.md#developing-react-apps-with-nwb)できます。 
+- **[nwb](https://github.com/insin/nwb)** は [npm で React コンポーネントを公開する](https://github.com/insin/nwb/blob/master/docs/guides/ReactComponents.md#developing-react-components-and-libraries-with-nwb)ことに特に優れています。React アプリを作成するのにも[利用](https://github.com/insin/nwb/blob/master/docs/guides/ReactApps.md#developing-react-apps-with-nwb)できます。
 
 - **[Parcel](https://parceljs.org/)** は高速な、ゼロ設定のウェブアプリケーションバンドラであり、[React と共に利用](https://parceljs.org/recipes.html#react)できます。
 
diff --git a/content/docs/faq-ajax.md b/content/docs/faq-ajax.md
index e64fab565..664bcfdda 100644
--- a/content/docs/faq-ajax.md
+++ b/content/docs/faq-ajax.md
@@ -12,11 +12,11 @@ category: FAQ
 
 ### コンポーネントのどのライフサイクルで AJAX コールすべきか？ {#where-in-the-component-lifecycle-should-i-make-an-ajax-call}
 
-AJAX コールによるデータ取得は[`componentDidMount`](/docs/react-component.html#mounting)のライフサイクルメソッドで行うべきです。データ取得後に `setState` でコンポーネントを更新できるようにするためです。
+AJAX コールによるデータ取得は [`componentDidMount`](/docs/react-component.html#mounting) のライフサイクルメソッドで行うべきです。データ取得後に `setState` でコンポーネントを更新できるようにするためです。
 
 ### 例：ローカル state に AJAX の通信結果をセットする {#example-using-ajax-results-to-set-local-state}
 
-下記のコンポーネントは、 `componentDidMount` で AJAX コールして得られたデータをローカルコンポーネントの state に流し込んでいます。 
+下記のコンポーネントは、`componentDidMount` で AJAX コールして得られたデータをローカルコンポーネントの state に流し込んでいます。
 
 このサンプル API が返す JSON オブジェクトはこのようになります：
 
diff --git a/content/docs/faq-build.md b/content/docs/faq-build.md
index 6acedb2df..9d9f60159 100644
--- a/content/docs/faq-build.md
+++ b/content/docs/faq-build.md
@@ -8,11 +8,11 @@ category: FAQ
 
 ### React では JSX を使用する必要がありますか？ {#do-i-need-to-use-jsx-with-react}
 
-いいえ！　詳細は ["JSX なしで React を使う"](/docs/react-without-jsx.html) をご覧ください。
+いいえ！ 詳細は ["JSX なしで React を使う"](/docs/react-without-jsx.html) をご覧ください。
 
 ### React では ES6（もしくはそれ以降のバージョン）を使用する必要がありますか？ {#do-i-need-to-use-es6--with-react}
 
-いいえ！　詳細は ["ES6 なしで React を使う"](/docs/react-without-es6.html) をご覧ください。
+いいえ！ 詳細は ["ES6 なしで React を使う"](/docs/react-without-es6.html) をご覧ください。
 
 ### JSX の中にコメントを記述するには？ {#how-can-i-write-comments-in-jsx}
 
diff --git a/content/docs/forms.md b/content/docs/forms.md
index be2e289ab..14d6fd6c8 100644
--- a/content/docs/forms.md
+++ b/content/docs/forms.md
@@ -25,7 +25,7 @@ redirect_from:
 
 ## 制御されたコンポーネント {#controlled-components}
 
-HTMLでは `<input>`、`<textarea>`、そして `<select>` のようなフォーム要素は通常、自身で状態を保持しており、ユーザーの入力に基づいてそれを更新します。React では、変更されうる状態は通常はコンポーネントの state プロパティに保持され、[`setState()`](/docs/react-component.html#setstate) 関数でのみ更新されます。
+HTML では `<input>`、`<textarea>`、そして `<select>` のようなフォーム要素は通常、自身で状態を保持しており、ユーザーの入力に基づいてそれを更新します。React では、変更されうる状態は通常はコンポーネントの state プロパティに保持され、[`setState()`](/docs/react-component.html#setstate) 関数でのみ更新されます。
 
 React の state を "信頼できる唯一の情報源 (single source of truth)" とすることで、上述の 2 つの状態を結合させることができます。そうすることで、フォームをレンダーしている React コンポーネントが、後続するユーザー入力でフォームで起きることも制御できるようになります。このような方法で React によって値が制御される入力フォーム要素は「制御されたコンポーネント」と呼ばれます。
 
@@ -86,7 +86,7 @@ HTML では、`<textarea>` 要素はテキストを子要素として定義し
 </textarea>
 ```
 
-Reactでは、`<textarea>` は代わりに `value` 属性を使用します。こうすることで、`<textarea>` を使用するフォームは単一行の入力フォームと非常に似た書き方ができるようになります：
+React では、`<textarea>` は代わりに `value` 属性を使用します。こうすることで、`<textarea>` を使用するフォームは単一行の入力フォームと非常に似た書き方ができるようになります：
 
 ```javascript{4-6,12-14,26}
 class EssayForm extends React.Component {
@@ -185,7 +185,7 @@ class FlavorForm extends React.Component {
 
 > 補足
 >
-> `value` 属性に配列を渡すことで、 `select` タグ内の複数のオプションを選択することができます：
+> `value` 属性に配列を渡すことで、`select` タグ内の複数のオプションを選択することができます：
 >
 >```js
 ><select multiple={true} value={['B', 'C']}>
@@ -193,7 +193,7 @@ class FlavorForm extends React.Component {
 
 ##file input タグ {#the-file-input-tag}
 
-HTMLでは、`<input type="file">` によってユーザにデバイス内の 1 つ以上のファイルを選ばせて、それをサーバにアップロードしたり [File API](https://developer.mozilla.org/en-US/docs/Web/API/File/Using_files_from_web_applications) を使って JavaScript で操作したりすることができます。
+HTML では、`<input type="file">` によってユーザにデバイス内の 1 つ以上のファイルを選ばせて、それをサーバにアップロードしたり [File API](https://developer.mozilla.org/en-US/docs/Web/API/File/Using_files_from_web_applications) を使って JavaScript で操作したりすることができます。
 
 ```html
 <input type="file" />
@@ -293,7 +293,7 @@ setTimeout(function() {
 
 ## 制御されたコンポーネントの代替手段 {#alternatives-to-controlled-components}
 
-制御されたコンポーネントは、あらゆる種類のデータの変更に対してイベントハンドラを書き、あらゆる入力状態を React コンポーネントに通してやる必要があるため、時としてうんざりすることがあります。このことは既存のコードベースを React に変換する場合や、React アプリケーションを非 React のライブラリと統合する場合に、特に問題化します。これらの状況においては、 入力フォームを実装する代替手段である[非制御コンポーネント](/docs/uncontrolled-components.html)を検討してみてください。
+制御されたコンポーネントは、あらゆる種類のデータの変更に対してイベントハンドラを書き、あらゆる入力状態を React コンポーネントに通してやる必要があるため、時としてうんざりすることがあります。このことは既存のコードベースを React に変換する場合や、React アプリケーションを非 React のライブラリと統合する場合に、特に問題化します。これらの状況においては、入力フォームを実装する代替手段である[非制御コンポーネント](/docs/uncontrolled-components.html)を検討してみてください。
 
 ## 本格的なソリューション {#fully-fledged-solutions}
 
diff --git a/content/docs/fragments.md b/content/docs/fragments.md
index ad9bf196e..7051f8142 100644
--- a/content/docs/fragments.md
+++ b/content/docs/fragments.md
@@ -38,7 +38,7 @@ class Table extends React.Component {
 }
 ```
 
-レンダーされる HTML が正しいものであるためには、`<Columns />` は複数の `<td>` 要素を返す必要があります。 `<Columns />` 中の `render()` 内で親の div 要素を使ってしまうと、結果として出力される HTML は不正なものとなってしまいます。
+レンダーされる HTML が正しいものであるためには、`<Columns />` は複数の `<td>` 要素を返す必要があります。`<Columns />` 中の `render()` 内で親の div 要素を使ってしまうと、結果として出力される HTML は不正なものとなってしまいます。
 
 ```jsx
 class Columns extends React.Component {
@@ -117,7 +117,7 @@ class Columns extends React.Component {
 
 ### key 付きフラグメント {#keyed-fragments}
 
-明示的に `<React.Fragment>` と宣言したフラグメントでは key を持つことができます。 これはコレクションをフラグメントの配列に変換するときに有用です。たとえば定義リストを作成する時に利用します：
+明示的に `<React.Fragment>` と宣言したフラグメントでは key を持つことができます。これはコレクションをフラグメントの配列に変換するときに有用です。たとえば定義リストを作成する時に利用します：
 
 ```jsx
 function Glossary(props) {
diff --git a/content/docs/getting-started.md b/content/docs/getting-started.md
index b4bfb763d..131f86dd3 100644
--- a/content/docs/getting-started.md
+++ b/content/docs/getting-started.md
@@ -32,7 +32,7 @@ redirect_from:
 
 ## React を試す {#try-react}
 
-React は初めから既存のプロジェクトに徐々に追加していけるようなデザインとなっています。 **あなたは React をどれだけ使っても問題ありません。** 触りだけやってみるもよし、シンプルな HTML のページにインタラクティブな機能を追加するのに使うもよし、React をフル活用した複雑なアプリを作成するもよし。どのような目的にしても、このページにあるリンクが役に立つでしょう。
+React は初めから既存のプロジェクトに徐々に追加していけるようなデザインとなっています。**あなたは React をどれだけ使っても問題ありません。**触りだけやってみるもよし、シンプルな HTML のページにインタラクティブな機能を追加するのに使うもよし、React をフル活用した複雑なアプリを作成するもよし。どのような目的にしても、このページにあるリンクが役に立つでしょう。
 
 ### Web 上で試せるオンラインエディタ {#online-playgrounds}
 
@@ -65,7 +65,7 @@ React を学びたい人には様々な背景があり、それぞれいろん
 
 ### React 初心者向けのガイド {#react-for-beginners}
 
-もし、React の公式ドキュメントのペースが早すぎると感じた場合は、[Tania Rascia氏によって書かれた React の概要](https://www.taniarascia.com/getting-started-with-react/)を読んでみましょう。React の重要なコンセプトについて詳細に説明されており、初心者にもとても易しい作りとなっています。それが終わったら、もう一度公式ドキュメントを読んでみましょう！
+もし、React の公式ドキュメントのペースが早すぎると感じた場合は、[Tania Rascia 氏によって書かれた React の概要](https://www.taniarascia.com/getting-started-with-react/)を読んでみましょう。React の重要なコンセプトについて詳細に説明されており、初心者にもとても易しい作りとなっています。それが終わったら、もう一度公式ドキュメントを読んでみましょう！
 
 ### デザイナー向けのガイド {#react-for-designers}
 
@@ -99,7 +99,7 @@ JavaScript について自分がどれだけ知っているかを知るために
 
 ### 高度なコンセプト {#advanced-concepts}
 
-React の[基本コンセプト](#main-concepts)について慣れてきて、実際に手で動かしてみたら、今度はさらに高度な内容にも手を出したいと思うかもしれません。この資料では強力な、しかし普段使われることのない [コンテキスト](/docs/context.html) や [ref](/docs/refs-and-the-dom.html) といった React のさらなる機能について紹介します。 
+React の[基本コンセプト](#main-concepts)について慣れてきて、実際に手で動かしてみたら、今度はさらに高度な内容にも手を出したいと思うかもしれません。この資料では強力な、しかし普段使われることのない [コンテキスト](/docs/context.html) や [ref](/docs/refs-and-the-dom.html) といった React のさらなる機能について紹介します。
 
 ### API リファレンス {#api-reference}
 
@@ -107,7 +107,7 @@ React の[基本コンセプト](#main-concepts)について慣れてきて、
 
 ### 用語集と FAQ {#glossary-and-faq}
 
-この[用語集](/docs/glossary.html)にはこのドキュメントにてよく使われる単語等が記載されています。 FAQもあり、[AJAX リクエストについて](/docs/faq-ajax.html)、[コンポーネントの state](/docs/faq-state.html)、[ファイル構成](/docs/faq-structure.html)などのよくある質問とそれらに対する回答が記載されています。
+この[用語集](/docs/glossary.html)にはこのドキュメントにてよく使われる単語等が記載されています。FAQ もあり、[AJAX リクエストについて](/docs/faq-ajax.html)、[コンポーネントの state](/docs/faq-state.html)、[ファイル構成](/docs/faq-structure.html)などのよくある質問とそれらに対する回答が記載されています。
 
 ## 最新の情報を追いたい人へ {#staying-informed}
 
@@ -123,4 +123,4 @@ React の[基本コンセプト](#main-concepts)について慣れてきて、
 
 ## 他に聞きたいことは？ {#something-missing}
 
-ドキュメントに記載されていないことがあったり、わかりにくい箇所があったりしたら、 困ったことや改善案等を[この公式ドキュメントのリポジトリ](https://github.com/reactjs/reactjs.org/issues/new)に issue として立てるか、もしくは公式の [@reactjs](https://twitter.com/reactjs) までご連絡ください。あなたのご意見をお待ちしております！
+ドキュメントに記載されていないことがあったり、わかりにくい箇所があったりしたら、困ったことや改善案等を[この公式ドキュメントのリポジトリ](https://github.com/reactjs/reactjs.org/issues/new)に issue として立てるか、もしくは公式の [@reactjs](https://twitter.com/reactjs) までご連絡ください。あなたのご意見をお待ちしております！
diff --git a/content/docs/handling-events.md b/content/docs/handling-events.md
index 15aeee18d..77d0863fa 100644
--- a/content/docs/handling-events.md
+++ b/content/docs/handling-events.md
@@ -97,7 +97,7 @@ JSX のコールバックにおける `this` の意味に注意しなければ
 
 これは React に限った動作ではなく、[JavaScript における関数の仕組み](https://www.smashingmagazine.com/2014/01/understanding-javascript-function-prototype-bind/)の一部です。一般的に、`onClick={this.handleClick}` のように `()` を末尾に付けずに何らかのメソッドを参照する場合、そのメソッドはバインドしておく必要があります。
 
-`bind` の呼び出しが苦痛なら、それを回避する方法が2つあります。実験的な[パブリッククラスフィールド構文](https://babeljs.io/docs/plugins/transform-class-properties/)を使用しているなら、コールバックを正しくバインドするのにクラスフィールドを利用できます：
+`bind` の呼び出しが苦痛なら、それを回避する方法が 2 つあります。実験的な[パブリッククラスフィールド構文](https://babeljs.io/docs/plugins/transform-class-properties/)を使用しているなら、コールバックを正しくバインドするのにクラスフィールドを利用できます：
 
 ```js{2-6}
 class LoggingButton extends React.Component {
diff --git a/content/docs/hooks-effect.md b/content/docs/hooks-effect.md
index 1a4777741..464e5cfd6 100644
--- a/content/docs/hooks-effect.md
+++ b/content/docs/hooks-effect.md
@@ -114,11 +114,11 @@ function Example() {
 }
 ```
 
-**`useEffect` は何をやっているのか？**　このフックを使うことで、レンダー後に何かの処理をしないといけない、ということを React に伝えます。React はあなたが渡した関数を覚えており（これを「副作用（関数）」と呼ぶこととします）、DOM の更新の後にそれを呼び出します。この副作用の場合はドキュメントのタイトルをセットしていますが、データを取得したりその他何らかの命令型の API を呼び出したりすることも可能です。
+**`useEffect` は何をやっているのか？** このフックを使うことで、レンダー後に何かの処理をしないといけない、ということを React に伝えます。React はあなたが渡した関数を覚えており（これを「副作用（関数）」と呼ぶこととします）、DOM の更新の後にそれを呼び出します。この副作用の場合はドキュメントのタイトルをセットしていますが、データを取得したりその他何らかの命令型の API を呼び出したりすることも可能です。
 
-**`useEffect` がコンポーネント内で呼ばれるのはなぜか？**　コンポーネント内で `useEffect` を記述することで、副作用内から state である `count`（や任意の props）にアクセスできるようになります。それらは既に関数スコープ内に存在するので、参照するための特別な API は必要ありません。フックは JavaScript のクロージャを活用しており、JavaScript で解決できることに対して React 特有の API を導入することはしません。
+**`useEffect` がコンポーネント内で呼ばれるのはなぜか？** コンポーネント内で `useEffect` を記述することで、副作用内から state である `count`（や任意の props）にアクセスできるようになります。それらは既に関数スコープ内に存在するので、参照するための特別な API は必要ありません。フックは JavaScript のクロージャを活用しており、JavaScript で解決できることに対して React 特有の API を導入することはしません。
 
-**`useEffect` は毎回のレンダー後に呼ばれるのか？**　その通りです！　デフォルトでは、副作用関数は初回のレンダー時*および*毎回の更新時に呼び出されます。あとで[カスタマイズする方法](#tip-optimizing-performance-by-skipping-effects)について説明します。「マウント」と「更新」という観点で考えるのではなく、「レンダーの後」に副作用は起こる、というように考える方が簡単かもしれません。React は、副作用が実行される時点では DOM が正しく更新され終わっていることを保証します。
+**`useEffect` は毎回のレンダー後に呼ばれるのか？** その通りです！ デフォルトでは、副作用関数は初回のレンダー時*および*毎回の更新時に呼び出されます。あとで[カスタマイズする方法](#tip-optimizing-performance-by-skipping-effects)について説明します。「マウント」と「更新」という観点で考えるのではなく、「レンダーの後」に副作用は起こる、というように考える方が簡単かもしれません。React は、副作用が実行される時点では DOM が正しく更新され終わっていることを保証します。
 
 ### 詳しい説明 {#detailed-explanation}
 
@@ -143,7 +143,7 @@ function Example() {
 
 ## クリーンアップを有する副作用 {#effects-with-cleanup}
 
-ここまでに、クリーンアップを必要としない副作用の表現のしかたについて見てきました。しかし幾つかの副作用ではそれが必要です。例えば何らかの外部のデータソースへの**購読をセットアップしたい**ことがあります。そのような場合、メモリリークが発生しないようにクリーンアップが必要です！　クラスの場合とフックの場合とでクリーンアップをどのように行えるのか比較しましょう。
+ここまでに、クリーンアップを必要としない副作用の表現のしかたについて見てきました。しかし幾つかの副作用ではそれが必要です。例えば何らかの外部のデータソースへの**購読をセットアップしたい**ことがあります。そのような場合、メモリリークが発生しないようにクリーンアップが必要です！ クラスの場合とフックの場合とでクリーンアップをどのように行えるのか比較しましょう。
 
 ### クラスを使った例 {#example-using-classes-1}
 
@@ -223,9 +223,9 @@ function FriendStatus(props) {
 }
 ```
 
-**副作用内からなぜ関数を返したのか？**　これこそが副作用のクリーンアップのためのオプションの仕組みです。すべての副作用は、それをクリーンアップするための関数を返すことができます。これにより購読を開始するためのロジックと解除するためのロジックを並べて書くことができます。両方とも同じ副作用の一部なのです！
+**副作用内からなぜ関数を返したのか？** これこそが副作用のクリーンアップのためのオプションの仕組みです。すべての副作用は、それをクリーンアップするための関数を返すことができます。これにより購読を開始するためのロジックと解除するためのロジックを並べて書くことができます。両方とも同じ副作用の一部なのです！
 
-**React は具体的には副作用のクリーンアップをいつ発生させるのか？**　React はコンポーネントがアンマウントされるときにクリーンアップを実行します。しかし、すでに学んだ通り、副作用は 1 回だけでなく毎回のレンダー時に実行されます。このため React は、ひとつ前のレンダーによる副作用を、次回の副作用を実行する前に*も*クリーンアップします。この後で、これが[なぜバグの回避につながるのか](#explanation-why-effects-run-on-each-update)、そして[これがパフォーマンスの問題を引き起こしている場合にどうのようにしてこの挙動を止めるのか](#tip-optimizing-performance-by-skipping-effects)について説明します。
+**React は具体的には副作用のクリーンアップをいつ発生させるのか？** React はコンポーネントがアンマウントされるときにクリーンアップを実行します。しかし、すでに学んだ通り、副作用は 1 回だけでなく毎回のレンダー時に実行されます。このため React は、ひとつ前のレンダーによる副作用を、次回の副作用を実行する前に*も*クリーンアップします。この後で、これが[なぜバグの回避につながるのか](#explanation-why-effects-run-on-each-update)、そして[これがパフォーマンスの問題を引き起こしている場合にどうのようにしてこの挙動を止めるのか](#tip-optimizing-performance-by-skipping-effects)について説明します。
 
 > 補足
 >
@@ -305,7 +305,7 @@ class FriendStatusWithCounter extends React.Component {
 
 ここで、`document.title` を設定するためのロジックが `componentDidMount` と `componentDidUpdate` に分離してしまっていることに注意してください。データ購読のためのロジックもやはり `componentDidMount` と `componentWillUnmount` とに分離しています。そして `componentDidMount` には両方の仕事のためのコードが含まれています。
 
-ではフックはどのようにこの問題を解決するのでしょうか？　[*ステート*フックを複数回呼べる](/docs/hooks-state.html#tip-using-multiple-state-variables)のと同様の方法で、複数の副作用を利用することができます。このため、無関係なロジックは別の副作用に分離することが可能です。
+ではフックはどのようにこの問題を解決するのでしょうか？ [*ステート*フックを複数回呼べる](/docs/hooks-state.html#tip-using-multiple-state-variables)のと同様の方法で、複数の副作用を利用することができます。このため、無関係なロジックは別の副作用に分離することが可能です。
 
 ```js{3,8}
 function FriendStatusWithCounter(props) {
@@ -353,7 +353,7 @@ function FriendStatusWithCounter(props) {
   }
 ```
 
-ですがコンポーネントが表示されている最中に **`friend` プロパティが変わったらどうなるのでしょう**か？　このコンポーネントは間違ったフレンドのオンラインステータスを表示し続けてしまいます。これはバグです。しかも誤ったフレンド ID を使って購読解除を呼び出してしまうため、アンマウント時にメモリリークやクラッシュを引き起こしてしまうでしょう。
+ですがコンポーネントが表示されている最中に **`friend` プロパティが変わったらどうなるのでしょう**か？ このコンポーネントは間違ったフレンドのオンラインステータスを表示し続けてしまいます。これはバグです。しかも誤ったフレンド ID を使って購読解除を呼び出してしまうため、アンマウント時にメモリリークやクラッシュを引き起こしてしまうでしょう。
 
 クラスコンポーネントの場合は、このようなケースに対処するために `componentDidUpdate` を加える必要がありました。
 
@@ -443,7 +443,7 @@ useEffect(() => {
 }, [count]); // Only re-run the effect if count changes
 ```
 
-上記の例では、第 2 引数として `[count]` を渡しています。どういう意味でしょうか？　もし `count` が `5` で、次回のコンポーネントのレンダー時にも `count` がまだ `5` であった場合、React は前回のレンダー時に覚えておいた `[5]` と今回のレンダーの `[5]` とを比較します。配列内のすべての要素が同一 (`5 === 5`) ですので、React は副作用をスキップします。これが最適化です。
+上記の例では、第 2 引数として `[count]` を渡しています。どういう意味でしょうか？ もし `count` が `5` で、次回のコンポーネントのレンダー時にも `count` がまだ `5` であった場合、React は前回のレンダー時に覚えておいた `[5]` と今回のレンダーの `[5]` とを比較します。配列内のすべての要素が同一 (`5 === 5`) ですので、React は副作用をスキップします。これが最適化です。
 
 再レンダー時に `count` が `6` に変更されている場合、前回レンダー時に覚えておいた `[5]` と今回のレンダー時の `[6]` という配列とを比較します。今回は `5 !== 6` ですので React は副作用を再適用します。配列内に複数の要素がある場合、React は配列内の要素のうちひとつでも変わっている場合に副作用を再実行します。
 
@@ -468,8 +468,8 @@ useEffect(() => {
 
 ## 次のステップ {#next-steps}
 
-おめでとうございます！　長いページでしたが、最終的に副作用に関するほとんどの疑問が解決していることを望みます。これでステートフックと副作用フックの両方を学んだので、それらを組み合わせてやれることが*たくさん*あります。クラスコンポーネントにおけるほとんどのユースケースがカバーされていますが、足りない部分については[他のフック](/docs/hooks-reference.html)が役立つかもしれません。
+おめでとうございます！ 長いページでしたが、最終的に副作用に関するほとんどの疑問が解決していることを望みます。これでステートフックと副作用フックの両方を学んだので、それらを組み合わせてやれることが*たくさん*あります。クラスコンポーネントにおけるほとんどのユースケースがカバーされていますが、足りない部分については[他のフック](/docs/hooks-reference.html)が役立つかもしれません。
 
 また、[動機](/docs/hooks-intro.html#motivation)のところで述べた問題をフックがどのように解決するのかについてもわかり始めてきたでしょう。副作用のクリーンアップがどのようにして `componentDidUpdate` と `componentWillUnmount` との間でのコードの重複を防ぎ、関係したコードを並べて書くことができるようにし、バグの少ないコードを記述できるようにするのかを見てきました。また目的別に副作用を分割する方法も学びましたが、これはクラスでは全く不可能なことでした。
 
-この時点で、一体フックがどのように動作しているのか疑問に感じているかもしれません。`useState` のそれぞれの呼び出しがどの state 変数に対応しているのかを、React はどのようにして知るのでしょうか？　更新のたびに、前回と今回の副作用とを React はどのように対応付けるのでしょうか？　**次のページでは[フックのルール](/docs/hooks-rules.html)について学びます -- このルールはフックが動作するために必須のものです。**
+この時点で、一体フックがどのように動作しているのか疑問に感じているかもしれません。`useState` のそれぞれの呼び出しがどの state 変数に対応しているのかを、React はどのようにして知るのでしょうか？ 更新のたびに、前回と今回の副作用とを React はどのように対応付けるのでしょうか？ **次のページでは[フックのルール](/docs/hooks-rules.html)について学びます -- このルールはフックが動作するために必須のものです。**
diff --git a/content/docs/hooks-intro.md b/content/docs/hooks-intro.md
index b4f4b4308..d975e84e5 100644
--- a/content/docs/hooks-intro.md
+++ b/content/docs/hooks-intro.md
@@ -27,7 +27,7 @@ function Example() {
 
 この `useState` という関数が、これから説明する最初のフック (Hook) です。これは単なるチラ見せですので、まだ意味が分からなくても問題ありません！
 
-**[次のページ](/docs/hooks-overview.html)からフックについて学び始めることができます。** このページの残りの部分では、我々がなぜ React にフックの仕組みを加えることにしたのか、そして素晴らしいアプリケーションを作るためにどのように便利なのかについて説明していきます。
+**[次のページ](/docs/hooks-overview.html)からフックについて学び始めることができます。**このページの残りの部分では、我々がなぜ React にフックの仕組みを加えることにしたのか、そして素晴らしいアプリケーションを作るためにどのように便利なのかについて説明していきます。
 
 > 補足
 >
@@ -51,7 +51,7 @@ React Conf 2018 にて Sophie Alpert と Dan Abramov がフックについての
 
 **React からクラス型コンポーネントを削除する予定はありません。**このページの[下部](#gradual-adoption-strategy)で段階的にフックを採用していく方法について読むことができます。
 
-**Hooks は既にあなたが知っている React のコンセプトを置き換えるものではありません。** むしろ、フックはあなたが既に知っている props、state、コンテクスト、ref、ライフサイクルといったコンセプトに対してより直接的な API を提供するものです。後でお見せするように、フックによって、これらを組み合わせるパワフルな手段も得ることができます。
+**Hooks は既にあなたが知っている React のコンセプトを置き換えるものではありません。**むしろ、フックはあなたが既に知っている props、state、コンテクスト、ref、ライフサイクルといったコンセプトに対してより直接的な API を提供するものです。後でお見せするように、フックによって、これらを組み合わせるパワフルな手段も得ることができます。
 
 **とにかくフックを学び始めたいという方は、どうぞ[直接次のページに進んでください](/docs/hooks-overview.html)！** 以下には、なぜ React にフックを導入することにしたのか、アプリケーションを書き換えずにどのようにしてフックを使い始めることができるのかについて解説しています。
 
@@ -63,7 +63,7 @@ React Conf 2018 にて Sophie Alpert と Dan Abramov がフックについての
 
 React は再利用可能な振る舞いをコンポーネントに「付加する」方法（例えばストアオブジェクトを connect するなど）を提供していません。React をしばらく使った事があれば、この問題を解決するための[レンダープロップ](/docs/render-props.html)や[高階コンポーネント](/docs/higher-order-components.html)といったパターンをご存じかもしれません。しかしこれらのパターンを使おうとするとコンポーネントの再構成が必要であり、面倒なうえにコードを追うのが難しくなります。典型的な React アプリを React DevTools で見てみると、おそらくプロバイダやらコンシューマやら高階コンポーネントやらレンダープロップやら、その他諸々の抽象化が多層に積み重なった『ラッパー地獄』を見ることになるでしょう。[DevTools でそれらをフィルタして隠す](https://github.com/facebook/react-devtools/pull/503)ことはできますが、この背景にはもっと根本的な問題があるということがわかります：React にはステートフルなロジックを共有するためのよりよい基本機能が必要なのです。
 
-フックを使えば、ステートを持ったロジックをコンポーネントから抽出して、単独でテストしたり、また再利用したりすることができます。**フックを使えば、ステートを持ったロジックを、コンポーネントの階層構造を変えることがなく再利用できるのです。** このため、多数のコンポーネント間で、あるいはコミュニティ全体で、フックを共有することが簡単になります。
+フックを使えば、ステートを持ったロジックをコンポーネントから抽出して、単独でテストしたり、また再利用したりすることができます。**フックを使えば、ステートを持ったロジックを、コンポーネントの階層構造を変えることがなく再利用できるのです。**このため、多数のコンポーネント間で、あるいはコミュニティ全体で、フックを共有することが簡単になります。
 
 この点については[独自フックの作成](/docs/hooks-custom.html)にてより詳しく述べていきます。
 
@@ -73,7 +73,7 @@ React は再利用可能な振る舞いをコンポーネントに「付加す
 
 多くの場合、ステートを使ったロジックはコンポーネント内のあらゆる場所にあるため、小さなコンポーネントに分割することは不可能です。テストも困難になります。これが、多くの人が単体の状態管理ライブラリの利用を好む理由のひとつでもあります。しかし、そのようなライブラリの利用を利用するとしばしば過剰な抽象化を引き起こしたり、様々なファイルにジャンプさせられたり、コンポーネントの再利用がより困難になってしまったりします。
 
-この問題を解決するため、関連する機能（例えばデータの購読や取得）をライフサイクルメソッドによって無理矢理分割する代わりに、**フックは関連する機能に基づいて、1 つのコンポーネントを複数の小さな関数に分割することを可能にします。** より state 管理を予測しやすくするため、必要に応じてリデューサ (reducer) を使って管理するようにしてもよいでしょう。
+この問題を解決するため、関連する機能（例えばデータの購読や取得）をライフサイクルメソッドによって無理矢理分割する代わりに、**フックは関連する機能に基づいて、1 つのコンポーネントを複数の小さな関数に分割することを可能にします。**より state 管理を予測しやすくするため、必要に応じてリデューサ (reducer) を使って管理するようにしてもよいでしょう。
 
 これについては[副作用フックの利用法](/docs/hooks-effect.html#tip-use-multiple-effects-to-separate-concerns)で詳しく述べます。
 
@@ -97,11 +97,11 @@ React 開発者はプロダクト開発に注力する必要があり、リリ
 
 また、React に新しい基本機能を付け加えるハードルが非常に高いということも理解しています。興味ある読者のために我々は[詳しい RFC](https://github.com/reactjs/rfcs/pull/68) を用意しています。そこではより詳しく動機を掘り下げており、関連する先行技術や個別の設計上の選択についての概要が述べられています。
 
-**肝心なことですが、フックは既存のコードと併用することができるので、段階的に採用していくことが可能です。** 我々は将来の React を形作っていくことに興味があるコミュニティの人々から初期フィードバックを得るためにこの実験的な API を公開しており、開かれた場で開発サイクルを進めていきます。
+**肝心なことですが、フックは既存のコードと併用することができるので、段階的に採用していくことが可能です。**我々は将来の React を形作っていくことに興味があるコミュニティの人々から初期フィードバックを得るためにこの実験的な API を公開しており、開かれた場で開発サイクルを進めていきます。
 
 最後に、フックへの移行を急ぐ必要はありません。特に既存の複雑なコンポーネントについては、「大幅な書き換え」は避けることを推奨します。『フックで考えられる』ようになるには若干の思考の転換が必要です。我々の経験上は、あまり重要でない新しいコンポーネントでまずフックの使い方を練習し、チームの全員が慣れるようにすることが最良です。フックを試してみたら、どうぞお気軽に[フィードバックを送って](https://github.com/facebook/react/issues/new)ください。ポジティブなものでもネガティブなものでも構いません。
 
-クラスコンポーネントのユースケースをすべてフックがカバーできるようにする予定ではいますが、**クラスコンポーネントのサポートも予見可能な将来にわたって続けていきます。** Facebook では何万というコンポーネントがクラスとして書かれており、それらを書き換える予定は全くありません。代わりに、クラスと併用しながら新しいコードでフックを使っていく予定でいます。
+クラスコンポーネントのユースケースをすべてフックがカバーできるようにする予定ではいますが、**クラスコンポーネントのサポートも予見可能な将来にわたって続けていきます。**Facebook では何万というコンポーネントがクラスとして書かれており、それらを書き換える予定は全くありません。代わりに、クラスと併用しながら新しいコードでフックを使っていく予定でいます。
 
 ## よくある質問 {#frequently-asked-questions}
 
@@ -109,4 +109,4 @@ React 開発者はプロダクト開発に注力する必要があり、リリ
 
 ## 次のステップ {#next-steps}
 
-このページを読み終えたことで、フックがどのような問題を解決しようとしているのか大まかに知ることはできたと思いますが、おそらく細かい部分についてはまだ分からないと思います。心配は要りません。 **[次のページ](/docs/hooks-overview.html)に進み、例を使ってフックについて学び始めましょう。**
+このページを読み終えたことで、フックがどのような問題を解決しようとしているのか大まかに知ることはできたと思いますが、おそらく細かい部分についてはまだ分からないと思います。心配は要りません。**[次のページ](/docs/hooks-overview.html)に進み、例を使ってフックについて学び始めましょう。**
diff --git a/content/docs/hooks-state.md b/content/docs/hooks-state.md
index e337f6dde..99c36d744 100644
--- a/content/docs/hooks-state.md
+++ b/content/docs/hooks-state.md
@@ -98,9 +98,9 @@ function Example() {
 }
 ```
 
-**Hook とは何？**　フックとは React の機能に「接続 (hook into)」するための特別な関数です。例えば `useState` によって React の state の機能を関数コンポーネントに追加できます。他のフックについても後で学びます。
+**Hook とは何？** フックとは React の機能に「接続 (hook into)」するための特別な関数です。例えば `useState` によって React の state の機能を関数コンポーネントに追加できます。他のフックについても後で学びます。
 
-**フックをいつ使うべき？**　関数コンポーネントを書いていて state が必要だと気付いた場合、これまではコンポーネントをクラスに変換する必要がありました。今後は、既に書いた関数コンポーネントの中でフックを使うことができます。早速やってみましょう！
+**フックをいつ使うべき？** 関数コンポーネントを書いていて state が必要だと気付いた場合、これまではコンポーネントをクラスに変換する必要がありました。今後は、既に書いた関数コンポーネントの中でフックを使うことができます。早速やってみましょう！
 
 > 補足：
 >
@@ -130,11 +130,11 @@ function Example() {
   const [count, setCount] = useState(0);
 ```
 
-**`useState` を呼ぶと何が起きるの？**　これにより『state 変数』が宣言されます。我々の例では変数を `count` と名付けましたが、`banana` でも何でも好きな名前にすることができます。これが関数コールの間で値を『保持』しておくための方法です ― `useState` は、クラスにおいて `this.state` が提供するのと全く同じ機能を実現するための新しい方法です。通常、関数が終了すると変数は『消えて』しまいますが、state 変数は React によって保持されます。
+**`useState` を呼ぶと何が起きるの？** これにより『state 変数』が宣言されます。我々の例では変数を `count` と名付けましたが、`banana` でも何でも好きな名前にすることができます。これが関数コールの間で値を『保持』しておくための方法です ― `useState` は、クラスにおいて `this.state` が提供するのと全く同じ機能を実現するための新しい方法です。通常、関数が終了すると変数は『消えて』しまいますが、state 変数は React によって保持されます。
 
-**引数として `useState` に何を渡すのか？**　`useState()` フックの唯一の引数は state の初期値です。クラスの場合とは異なり、state はオブジェクトである必要はありません。数字や文字列が欲しいだけであればそれらを保持することができます。我々の例ではユーザがクリックした回数に対応する数字が欲しいだけですので、`0` を state 変数の初期値として渡します。（もし違う値を保持したい場合は `useState()` を 2 回呼ぶことになります）
+**引数として `useState` に何を渡すのか？** `useState()` フックの唯一の引数は state の初期値です。クラスの場合とは異なり、state はオブジェクトである必要はありません。数字や文字列が欲しいだけであればそれらを保持することができます。我々の例ではユーザがクリックした回数に対応する数字が欲しいだけですので、`0` を state 変数の初期値として渡します。（もし違う値を保持したい場合は `useState()` を 2 回呼ぶことになります）
 
-**`useState` は何を返すのか？**　現在の state と、それを更新するための関数とを、ペアにして返します。これが `const [count, setCount] = useState()` という書き方をした理由です。これはクラスにおける `this.state.count` と `this.setState` に似ていますが、それをペアとして手に入れる点が異なります。もしもここで使った構文になじみがない場合は、[このページの下部](/docs/hooks-state.html#tip-what-do-square-brackets-mean)で改めて説明します。
+**`useState` は何を返すのか？** 現在の state と、それを更新するための関数とを、ペアにして返します。これが `const [count, setCount] = useState()` という書き方をした理由です。これはクラスにおける `this.state.count` と `this.setState` に似ていますが、それをペアとして手に入れる点が異なります。もしもここで使った構文になじみがない場合は、[このページの下部](/docs/hooks-state.html#tip-what-do-square-brackets-mean)で改めて説明します。
 
 `useState` が何をやるのかが分かったので、最初の例の意味がより分かりやすくなりました：
 
@@ -215,7 +215,7 @@ function Example() {
 - **4 行目：** `Example` コンポーネント内で `useState` フックを呼び出すことで新しい state 変数を宣言します。2 つの値のペアが返されるので、それらに名前を与えます。ボタンのクリック回数を保持するための変数ですので `count` と名付けましょう。`useState` 唯一の引数として `0` を渡すことで、変数をゼロへと初期化します。返り値の 2 つ目はそれ自体が関数です。これにより `count` を更新するので、`setCount` とう名前にします。
 - **9 行目：** ユーザがクリックした時に、新しい値で `setCount` を呼びます。React は `Example` コンポーネントを再レンダーし、その際には新たな `count` の値を渡します。
 
-最初は飲み込むのに時間がかかるかもしれません。急がないようにしましょう！　途中で分からなくなった場合は上記のコードを最初から最後まで読み直してください。一旦クラスで state がどう動くのかを「忘れて」新鮮な目でこのコードを見るようにすれば、必ず理解できるようになるはずです。
+最初は飲み込むのに時間がかかるかもしれません。急がないようにしましょう！ 途中で分からなくなった場合は上記のコードを最初から最後まで読み直してください。一旦クラスで state がどう動くのかを「忘れて」新鮮な目でこのコードを見るようにすれば、必ず理解できるようになるはずです。
 
 ### ヒント：この角カッコの意味は？ {#tip-what-do-square-brackets-mean}
 
diff --git a/content/docs/introducing-jsx.md b/content/docs/introducing-jsx.md
index f74523366..9944250ca 100644
--- a/content/docs/introducing-jsx.md
+++ b/content/docs/introducing-jsx.md
@@ -16,7 +16,7 @@ const element = <h1>Hello, world!</h1>;
 
 これは JSX と呼ばれる JavaScript の構文の拡張です。UI がどのような見た目かを記述するために、React とともに JSX を使用することを私たちはお勧めしています。JSX はテンプレート言語を連想させるでしょうが、JavaScript の機能を全て備えたものです。
 
-JSX は React "要素" を生成します。[次の章](/docs/rendering-elements.html)で React 要素を DOM に変換する方法について見ていきます。以下では、 JSX を使い始めるのに必要な基礎を学ぶことができます。
+JSX は React "要素" を生成します。[次の章](/docs/rendering-elements.html)で React 要素を DOM に変換する方法について見ていきます。以下では、JSX を使い始めるのに必要な基礎を学ぶことができます。
 
 ### JSXを使う理由 {#why-jsx}
 
@@ -77,7 +77,7 @@ ReactDOM.render(
 
 コンパイルの後、JSX の式は普通の JavaScript の関数呼び出しに変換され、JavaScript オブジェクトへと評価されます。
 
-これは JSXを `if` 文や `for` ループの中で使用したり、変数に代入したり、引数として受け取ったり、関数から返したりすることができるということです。
+これは JSX を `if` 文や `for` ループの中で使用したり、変数に代入したり、引数として受け取ったり、関数から返したりすることができるということです。
 
 ```js{3,5}
 function getGreeting(user) {
diff --git a/content/docs/lifting-state-up.md b/content/docs/lifting-state-up.md
index e43e9f64d..fe0e80c09 100644
--- a/content/docs/lifting-state-up.md
+++ b/content/docs/lifting-state-up.md
@@ -130,7 +130,7 @@ function toFahrenheit(celsius) {
 }
 ```
 
-これら 2 つの関数は数字を変換します。 次に文字列で表現された `temperature` と変換関数を引数に取り文字列を返す、別の関数を作成します。この関数を一方の入力の値をもう一方の入力に基づいて計算するのに使用します。
+これら 2 つの関数は数字を変換します。次に文字列で表現された `temperature` と変換関数を引数に取り文字列を返す、別の関数を作成します。この関数を一方の入力の値をもう一方の入力に基づいて計算するのに使用します。
 
 常に値が小数第 3 位までで四捨五入されるようにし、無効な `temperature` には空の文字列を返します。
 
@@ -171,7 +171,7 @@ class TemperatureInput extends React.Component {
 
 しかし、2 つの入力フィールドはお互いに同期されていて欲しいです。摂氏の入力フィールドを更新したら、華氏の入力フィールドも華氏に変換された温度で反映されて欲しいですし、逆も同じです。
 
-React での state の共有は、state を、それを必要とするコンポーネントすべての直近の共通祖先コンポーネントに移動することによって実現します。これを "state のリフトアップ (lifting state up)" と呼びます。 `TemperatureInput` からローカルの state を削除して `Calculator` に移動しましょう。
+React での state の共有は、state を、それを必要とするコンポーネントすべての直近の共通祖先コンポーネントに移動することによって実現します。これを "state のリフトアップ (lifting state up)" と呼びます。`TemperatureInput` からローカルの state を削除して `Calculator` に移動しましょう。
 
 `Calculator` が共有の state を保持すれば、それが両方の入力における現在の温度の "信頼できる情報源 (source of truth)" となります。それによって、両方に対して相互に一貫性のある値を持たせることができるようになります。両方の `TemperatureInput` コンポーネントの props は同じ親コンポーネント `Calculator` から与えられるので、2 つの入力は常に同期されているようになります。
 
@@ -186,7 +186,7 @@ React での state の共有は、state を、それを必要とするコンポ
     // ...
 ```
 
-[props が読み取り専用である](/docs/components-and-props.html#props-are-read-only)ことは周知の通りです。`temperature` がローカルの state に格納されている間は、`TemperatureInput` は `this.setState()` を呼び出すだけでそれを変更することができました。 しかし今や、`temperature` は親コンポーネントから与えられる props の一部ですから、`TemperatureInput` はそれを制御できません。
+[props が読み取り専用である](/docs/components-and-props.html#props-are-read-only)ことは周知の通りです。`temperature` がローカルの state に格納されている間は、`TemperatureInput` は `this.setState()` を呼び出すだけでそれを変更することができました。しかし今や、`temperature` は親コンポーネントから与えられる props の一部ですから、`TemperatureInput` はそれを制御できません。
 
 通常 React では、コンポーネントを "制御された (controlled)" ものとすることでこの問題を解決します。DOM である `<input>` が `value` と `onChange` プロパティの両方を受け取るように、カスタムコンポーネントの `TemperatureInput` は `temperature` と `onTemperatureChange` の両方を親コンポーネントの `Calculator` から受け取ることができます。
 
@@ -203,7 +203,7 @@ React での state の共有は、state を、それを必要とするコンポ
 >
 > カスタムコンポーネントの `temperature` や `onTemperatureChange` といった props の名前に特別な意味があるわけではありません。慣習に則り `value` や `onChange` など、他の任意の名前を使うこともできます。
 
-`onTemperatureChange` プロパティは親コンポーネント `Calculator` から `temperature` プロパティと共に渡されます。 親コンポーネントは入力の変化に応じて自身のローカル state を更新し、結果的に両方の入力フォームは新しい値で再レンダーされます。`Calculator` をどう実装するかはこの後すぐに見ていきましょう。
+`onTemperatureChange` プロパティは親コンポーネント `Calculator` から `temperature` プロパティと共に渡されます。親コンポーネントは入力の変化に応じて自身のローカル state を更新し、結果的に両方の入力フォームは新しい値で再レンダーされます。`Calculator` をどう実装するかはこの後すぐに見ていきましょう。
 
 `Calculator` の変更点を見ていく前に、`TemperatureInput` コンポーネントで行った変更をおさらいしましょう。ローカルの state を削除し、`this.state.temperature` の代わりに `this.props.temperature` を読み取るようにしました。また、変更を加えたい場合は `this.setState()` を呼び出す代わりに `Calculator` から与えられる `this.props.onTemperatureChange()` を呼び出すことにしました：
 
@@ -311,8 +311,8 @@ class Calculator extends React.Component {
 * これらのメソッド内では、`Calculator` コンポーネントが新しい入力値と更新した方の入力値の単位を `this.setState()` に与えて呼び出して、React に `Calculator` コンポーネント自身を再レンダリングさせます。
 * React は `Calculator` コンポーネントの `render` メソッドを呼び出して、UI がどのような見た目になるべきかを学びます。両方の入力コンポーネントの値が、現在の温度とアクティブな単位に基づいて再計算されます。温度の変換処理はここで行われます。
 * React は `Calculator` により与えられた新しい props で各 `TemperatureInput` の `render` メソッドを呼び出します。React はそれらの UI がどのような見た目になるかを学びます。
-* React は propsとして摂氏温度を与えて、`BoilingVerdict` コンポーネントの `render` メソッドを呼び出します。
-* React DOM は沸騰したかどうかの判定結果と入力コンポーネントの値によって、 DOM を更新します。変更された入力コンポーネントは現在の値によって、もう一方の入力コンポーネントは変換された温度によって更新されます。
+* React は props として摂氏温度を与えて、`BoilingVerdict` コンポーネントの `render` メソッドを呼び出します。
+* React DOM は沸騰したかどうかの判定結果と入力コンポーネントの値によって、DOM を更新します。変更された入力コンポーネントは現在の値によって、もう一方の入力コンポーネントは変換された温度によって更新されます。
 
 全ての更新は同じ手順で実行されるので、2 つの入力コンポーネントは常に同期を保つことができます。
 
@@ -322,7 +322,7 @@ React アプリケーションで変化するどのようなデータも単一
 
 state のリフトアップは双方向のバインディング (two-way binding) を行う方法より多くの "ボイラープレート" コードを生み出しますが、その効果としてバグを発見して切り出す作業が少なく済むようになります。あらゆる state はいずれかのコンポーネント内に存在し、そのコンポーネントのみがその state を変更できるので、バグが潜む範囲は大幅に削減されます。加えて、ユーザー入力を拒否したり変換したりする任意の独自ロジックを実装することもできます。
 
-props もしくは state から作りだす事のできるデータについては、おそらく state に保持すべきではないでしょう。例えば、今回は `celsiusValue` と `fahrenheitValue` の両方を保存する代わりに、 最後に変更された `temperature` と、その値の `scale` のみを保存しています。もう一方の入力の値は常に `render()` メソッド内で計算することができます。これにより元のユーザ入力の精度を全く損なうことなくもう一方の入力フィールドに丸めを適用したり、もう一方の入力フィールドをクリアしたりできます。
+props もしくは state から作りだす事のできるデータについては、おそらく state に保持すべきではないでしょう。例えば、今回は `celsiusValue` と `fahrenheitValue` の両方を保存する代わりに、最後に変更された `temperature` と、その値の `scale` のみを保存しています。もう一方の入力の値は常に `render()` メソッド内で計算することができます。これにより元のユーザ入力の精度を全く損なうことなくもう一方の入力フィールドに丸めを適用したり、もう一方の入力フィールドをクリアしたりできます。
 
 UI で何かおかしな箇所があれば、[React Developer Tools](https://github.com/facebook/react-devtools) を使用して props を調査したり state の更新について責任を持っているコンポーネントに辿り着くまでツリーをさかのぼることができます。これによりバグをその原因まで追いかけることができます。
 
diff --git a/content/docs/lists-and-keys.md b/content/docs/lists-and-keys.md
index 380cae2d3..87503113a 100644
--- a/content/docs/lists-and-keys.md
+++ b/content/docs/lists-and-keys.md
@@ -22,7 +22,7 @@ React では配列を[要素](/docs/rendering-elements.html)のリストに変
 
 ### 複数のコンポーネントをレンダリングする {#rendering-multiple-components}
 
-要素の集合を作成し中括弧 `{}` で囲むことで[JSXに含める](/docs/introducing-jsx.html#embedding-expressions-in-jsx)ことができます。
+要素の集合を作成し中括弧 `{}` で囲むことで [JSX に含める](/docs/introducing-jsx.html#embedding-expressions-in-jsx)ことができます。
 
 以下では、JavaScript の `map()` 関数を利用して、`numbers` という配列に対して反復処理を行っています。それぞれの整数に対して `<li>` 要素を返しています。最後に、結果として得られる要素の配列を `listItems` に格納しています：
 
diff --git a/content/docs/portals.md b/content/docs/portals.md
index c868445c4..d82957644 100644
--- a/content/docs/portals.md
+++ b/content/docs/portals.md
@@ -65,7 +65,7 @@ render() {
 </html>
 ```
 
-`#app-root` 内にある `Parent` コンポーネントは、 `#modal-root` 内のコンポーネントから伝播したイベントが捕捉されなかった場合に、それを捕捉できます。
+`#app-root` 内にある `Parent` コンポーネントは、`#modal-root` 内のコンポーネントから伝播したイベントが捕捉されなかった場合に、それを捕捉できます。
 
 ```js{28-31,42-49,53,61-63,70-71,74}
 // この 2 つのコンテナは DOM 上の兄弟要素とします
diff --git a/content/docs/react-without-es6.md b/content/docs/react-without-es6.md
index 6d892ac61..75e17a73a 100644
--- a/content/docs/react-without-es6.md
+++ b/content/docs/react-without-es6.md
@@ -175,7 +175,7 @@ class SayHello extends React.Component {
 >
 >この節は参考のためだけに存在します。
 
-時には同じ機能が全く異なるコンポーネント間で共有されることがあります。これは[横断的関心事 (cross-cutting concerns)](https://en.wikipedia.org/wiki/Cross-cutting_concern) と呼ばれることがあります。 `createReactClass` であれば、横断的関心事のためにレガシーな `mixins` 機能を使うことができます。
+時には同じ機能が全く異なるコンポーネント間で共有されることがあります。これは[横断的関心事 (cross-cutting concerns)](https://en.wikipedia.org/wiki/Cross-cutting_concern) と呼ばれることがあります。`createReactClass` であれば、横断的関心事のためにレガシーな `mixins` 機能を使うことができます。
 
 よくある利用例のひとつは、一定時間ごとに自分自身を更新するコンポーネントです。`setInterval()` を使うのは簡単ですが、その場合はメモリ節約のため、コンポーネントが不要になった際にキャンセルすることが重要です。React は[ライフサイクルメソッド](/docs/react-component.html#the-component-lifecycle)を提供しており、コンポーネントが生成、破棄されるときに知らせてくれます。次のようなシンプルなミックスインを作ってみましょう。このミックスインのメソッドは簡単な `setInterval()` 機能を提供し、コンポーネントが破棄されるタイミングで自動的にクリーンアップされます。
 
diff --git a/content/docs/reference-dom-elements.md b/content/docs/reference-dom-elements.md
index d6885d533..d12015619 100644
--- a/content/docs/reference-dom-elements.md
+++ b/content/docs/reference-dom-elements.md
@@ -62,7 +62,7 @@ function MyComponent() {
 
 >補足
 >
->このドキュメンテーションにあるいくつかの例では `style` を便宜上使用していますが、**`style` 属性を要素のスタイリングの主要な手段として使うことは一般的に推奨されません。** 多くの場合、[`className`](#classname) を使って外部の CSS スタイルシートに定義された CSS クラスを参照するべきです。React アプリケーションの中では、`style` は動的に計算されたスタイルをレンダー中に追加するために最もよく使われます。[FAQ: Styling and CSS](/docs/faq-styling.html) も参照してください。
+>このドキュメンテーションにあるいくつかの例では `style` を便宜上使用していますが、**`style` 属性を要素のスタイリングの主要な手段として使うことは一般的に推奨されません。**多くの場合、[`className`](#classname) を使って外部の CSS スタイルシートに定義された CSS クラスを参照するべきです。React アプリケーションの中では、`style` は動的に計算されたスタイルをレンダー中に追加するために最もよく使われます。[FAQ: Styling and CSS](/docs/faq-styling.html) も参照してください。
 
 `style` 属性は CSS 文字列ではなく、キャメルケースのプロパティを持った JavaScript オブジェクトを受け取ります。これは JavaScript での DOM の `style` プロパティとの一貫性があり、より効率的で、XSS 攻撃の対象となるセキュリティホールを防ぎます。例えば：
 
@@ -126,7 +126,7 @@ React はインラインスタイルでの特定の数値プロパティに対
 
 React 16 では、標準[あるいは独自の](/blog/2017/09/08/dom-attributes-in-react-16.html) DOM 属性全てが完全にサポートされます。
 
-React は DOM に対して JavaScript 中心に設計された API を常に提供してきました。React コンポーネントは、独自および DOM に関連した props を頻繁に受け取るため、Reactは DOM API と同様にキャメルケース (`camelCase`) の命名規則を属性の名前付けに使用します。
+React は DOM に対して JavaScript 中心に設計された API を常に提供してきました。React コンポーネントは、独自および DOM に関連した props を頻繁に受け取るため、React は DOM API と同様にキャメルケース (`camelCase`) の命名規則を属性の名前付けに使用します。
 
 ```js
 <div tabIndex="-1" />      // DOM API の node.tabIndex と同様に
diff --git a/content/docs/reference-events.md b/content/docs/reference-events.md
index ccefc6d1d..9712b8e5b 100644
--- a/content/docs/reference-events.md
+++ b/content/docs/reference-events.md
@@ -33,7 +33,7 @@ string type
 
 > 補足
 >
-> v0.14以降、イベントハンドラから `false` を返してもイベントの伝播は止まりません。代わりに、`e.stopPropagation()` または `e.preventDefault()` を手動で呼び出す必要があります。
+> v0.14 以降、イベントハンドラから `false` を返してもイベントの伝播は止まりません。代わりに、`e.stopPropagation()` または `e.preventDefault()` を手動で呼び出す必要があります。
 
 ### イベントのプール {#event-pooling}
 
@@ -149,7 +149,7 @@ boolean shiftKey
 number which
 ```
 
-`key` プロパティは[DOM Level 3 Events spec](https://www.w3.org/TR/uievents-key/#named-key-attribute-values)に記載されている任意の値を取ることができます。
+`key` プロパティは [DOM Level 3 Events spec](https://www.w3.org/TR/uievents-key/#named-key-attribute-values) に記載されている任意の値を取ることができます。
 
 * * *
 
@@ -179,7 +179,7 @@ DOMEventTarget relatedTarget
 onChange onInput onInvalid onSubmit
 ```
 
-onChange イベントの詳細については、[Forms](/docs/forms.html)を参照してください。
+onChange イベントの詳細については、[Forms](/docs/forms.html) を参照してください。
 
 * * *
 
@@ -229,7 +229,7 @@ onLostPointerCapture onPointerEnter onPointerLeave onPointerOver onPointerOut
 
 プロパティ：
 
-[W3 spec](https://www.w3.org/TR/pointerevents/)に定義されている通り、ポインタイベントは下記のプロパティを持つマウスイベントの拡張です。
+[W3 spec](https://www.w3.org/TR/pointerevents/) に定義されている通り、ポインタイベントは下記のプロパティを持つマウスイベントの拡張です。
 
 ```javascript
 number pointerId
diff --git a/content/docs/reference-glossary.md b/content/docs/reference-glossary.md
index a27609b6e..0f6beb1f9 100644
--- a/content/docs/reference-glossary.md
+++ b/content/docs/reference-glossary.md
@@ -31,11 +31,11 @@ JavaScript コンパイラは JavaScript コードを受け取って変換し、
 
 ## CDN {#cdn}
 
-CDN は Content Delivery Network の略です。 CDN はキャッシュされた静的なコンテンツをネットワーク化されたサーバから世界中に配信します。
+CDN は Content Delivery Network の略です。CDN はキャッシュされた静的なコンテンツをネットワーク化されたサーバから世界中に配信します。
 
 ## JSX {#jsx}
 
-JSX は JavaScript の拡張構文です。テンプレート言語に似ていますが、完全に JavaScript だけで動作します。JSX は、"React 要素" と呼ばれるプレーンな JavaScript オブジェクトを返す、 `React.createElement()` のコールにコンパイルされます。JSX の基本的な導入部分を学ぶには[こちらのドキュメントを参照してください](/docs/introducing-jsx.html)。また、さらに JSX について詳細に学ぶには[こちら](/docs/jsx-in-depth.html)を参照してください。
+JSX は JavaScript の拡張構文です。テンプレート言語に似ていますが、完全に JavaScript だけで動作します。JSX は、"React 要素" と呼ばれるプレーンな JavaScript オブジェクトを返す、`React.createElement()` のコールにコンパイルされます。JSX の基本的な導入部分を学ぶには[こちらのドキュメントを参照してください](/docs/introducing-jsx.html)。また、さらに JSX について詳細に学ぶには[こちら](/docs/jsx-in-depth.html)を参照してください。
 
 React DOM は HTML の属性名ではなく、キャメルケースの命名規則を使用します。例えば、`tabindex` は、JSX では `tabIndex` となります。`class` も `className` と記述されますが、これは `class` が JavaScript において予約語であるためです：
 
@@ -136,7 +136,7 @@ React では、フォームの入力を扱うのに 2 つの異なるアプロ
 
 React によって値が制御される入力フォーム要素は *制御されたコンポーネント* (controlled component) と呼ばれます。ユーザーが制御されたコンポーネントにデータを入力すると、変更イベントハンドラがトリガーされ、コードが入力が有効であるか（更新された値で再レンダリングすることで）決定します。再レンダリングしなければフォーム要素は変更されないままとなります。
 
-*非制御コンポーネント* (uncontrolled component) は React の管理外にあるフォーム要素と同様に動作します。ユーザーがフォームフィールド（入力ボックス、ドロップダウンなど）にデータを入力した場合、更新された情報が反映され、その際にReact は何もする必要がありません。しかし、このことはフィールドに特定の値を設定できないということでもあります。
+*非制御コンポーネント* (uncontrolled component) は React の管理外にあるフォーム要素と同様に動作します。ユーザーがフォームフィールド（入力ボックス、ドロップダウンなど）にデータを入力した場合、更新された情報が反映され、その際に React は何もする必要がありません。しかし、このことはフィールドに特定の値を設定できないということでもあります。
 
 ほとんどの場合では、制御されたコンポーネントを使用するべきでしょう。
 
@@ -150,7 +150,7 @@ key は同じ配列内の兄弟要素間で一意としなければなりませ
 
 ## [ref](/docs/refs-and-the-dom.html) {#refs}
 
-React は任意のコンポーネントに追加できる特別な属性をサポートしています。`ref` 属性は、[`React.createRef()` 関数](/docs/react-api.html#reactcreateref)、コールバック関数、あるいは（古い API では）文字列によって生成されるオブジェクトです。`ref` 属性がコールバック関数の場合、その関数は引数として（要素の種類によって）DOM 要素またはクラスインスタンスを受け取ります。これによって、 DOM 要素またはコンポーネントのインスタンスへと直接アクセスできます。
+React は任意のコンポーネントに追加できる特別な属性をサポートしています。`ref` 属性は、[`React.createRef()` 関数](/docs/react-api.html#reactcreateref)、コールバック関数、あるいは（古い API では）文字列によって生成されるオブジェクトです。`ref` 属性がコールバック関数の場合、その関数は引数として（要素の種類によって）DOM 要素またはクラスインスタンスを受け取ります。これによって、DOM 要素またはコンポーネントのインスタンスへと直接アクセスできます。
 
 ref は消極的に利用してください。アプリケーション内で何かを実行するために ref を頻繁に使用している場合、[トップダウンのデータフロー](/docs/lifting-state-up.html)に慣れ親しむことを検討してください。
 
diff --git a/content/docs/refs-and-the-dom.md b/content/docs/refs-and-the-dom.md
index 6f069c311..0ef17f8d2 100644
--- a/content/docs/refs-and-the-dom.md
+++ b/content/docs/refs-and-the-dom.md
@@ -13,7 +13,7 @@ permalink: docs/refs-and-the-dom.html
 
 Ref は render メソッドで作成された DOM ノードもしくは React の要素にアクセスする方法を提供します。
 
-一般的な React のデータフローでは、[props](/docs/components-and-props.html) が、親コンポーネントがその子要素とやりとりする唯一の方法です。子要素を変更するには、新しい props でそれを再レンダーします。ただし、この一般的なデータフロー以外で、子要素を命令型のコードを使って変更する必要がある場合もあります。変更したい子要素が React コンポーネントのインスタンスのことも、DOM 要素のこともあるでしょう。 どちらの場合でも、React は避難ハッチを提供します。
+一般的な React のデータフローでは、[props](/docs/components-and-props.html) が、親コンポーネントがその子要素とやりとりする唯一の方法です。子要素を変更するには、新しい props でそれを再レンダーします。ただし、この一般的なデータフロー以外で、子要素を命令型のコードを使って変更する必要がある場合もあります。変更したい子要素が React コンポーネントのインスタンスのことも、DOM 要素のこともあるでしょう。どちらの場合でも、React は避難ハッチを提供します。
 
 ### いつ Ref を使うか {#when-to-use-refs}
 
@@ -37,7 +37,7 @@ Ref に適した使用例は以下の通りです。
 
 ### Ref を作成する {#creating-refs}
 
-Ref は `React.createRef()` を使用して作成され、 `ref` 属性を用いて React 要素に紐付けられます。Ref は通常、コンポーネントの構築時にインスタンスプロパティに割り当てられるため、コンポーネントを通して参照が可能です。
+Ref は `React.createRef()` を使用して作成され、`ref` 属性を用いて React 要素に紐付けられます。Ref は通常、コンポーネントの構築時にインスタンスプロパティに割り当てられるため、コンポーネントを通して参照が可能です。
 
 ```javascript{4,7}
 class MyComponent extends React.Component {
@@ -63,7 +63,7 @@ ref の値はノードの種類によって異なります。
 
 - HTML 要素に対して `ref` 属性が使用されている場合、`React.createRef()` を使ってコンストラクタ内で作成された `ref` は、その `current` プロパティとして根底にある DOM 要素を受け取ります
 - `ref` 属性がカスタムクラスコンポーネントで使用されるとき、`ref` オブジェクトはコンポーネントのマウントされたインスタンスを `current` として受け取ります
-- **関数コンポーネント (function components) には `ref` 属性を使用してはいけません。** なぜなら、関数コンポーネントはインスタンスを持たないからです
+- **関数コンポーネント (function components) には `ref` 属性を使用してはいけません。**なぜなら、関数コンポーネントはインスタンスを持たないからです
 
 以下の例ではその違いを示しています。
 
@@ -205,7 +205,7 @@ React 16.2 以下を使用している場合、または ref forwarding で提
 
 React はまた「コールバック Ref」と呼ばれる、より細かい制御が可能な ref を設定するための別の方法をサポートします。
 
-`createRef()` によって作成された `ref` 属性を渡す代わりに、関数を渡します。 この関数は、引数として React コンポーネントのインスタンスまたは HTML DOM 要素を受け取ります。これを保持することで、他の場所からアクセスできます。
+`createRef()` によって作成された `ref` 属性を渡す代わりに、関数を渡します。この関数は、引数として React コンポーネントのインスタンスまたは HTML DOM 要素を受け取ります。これを保持することで、他の場所からアクセスできます。
 
 以下は、`ref` コールバックを用いて DOM ノードへの参照をインスタンスプロパティに格納する一般的な実装例です。
 
diff --git a/content/docs/render-props.md b/content/docs/render-props.md
index ee9581ac1..57ffac825 100644
--- a/content/docs/render-props.md
+++ b/content/docs/render-props.md
@@ -213,9 +213,9 @@ class MouseTracker extends React.Component {
 
 より具体的に述べると、**レンダープロップとは、あるコンポーネントが何をレンダーすべきかを知るために使う関数の props です。**
 
-このテクニックによって、再利用する必要がある振る舞いの移植性が極めて高くなります。その振る舞いをさせるためには、現在のカーソルの (x, y) 座標にレンダーするものを示す `render` プロパティを使って `<Mouse>` をレンダーすれば良いのです。  
+このテクニックによって、再利用する必要がある振る舞いの移植性が極めて高くなります。その振る舞いをさせるためには、現在のカーソルの (x, y) 座標にレンダーするものを示す `render` プロパティを使って `<Mouse>` をレンダーすれば良いのです。
 
-レンダープロップの興味深い点として、多くの[高階コンポーネント](/docs/higher-order-components.html) (HOC) がレンダープロップを使った通常のコンポーネントによって実装可能ということが挙げられます。たとえば、`<Mouse>` コンポーネントよりも `withMouse` HOC が好みであれば、レンダープロップを持つ `<Mouse>` を使って簡単に作成可能です。 
+レンダープロップの興味深い点として、多くの[高階コンポーネント](/docs/higher-order-components.html) (HOC) がレンダープロップを使った通常のコンポーネントによって実装可能ということが挙げられます。たとえば、`<Mouse>` コンポーネントよりも `withMouse` HOC が好みであれば、レンダープロップを持つ `<Mouse>` を使って簡単に作成可能です。
 
 ```js
 // If you really want a HOC for some reason, you can easily
@@ -273,7 +273,7 @@ Mouse.propTypes = {
 
 レンダープロップを使う際、`render` メソッド内で関数を作成していると、[`React.PureComponent`](/docs/react-api.html#reactpurecomponent) を使う利点が相殺されます。これは props の浅い (shallow) 比較は新しい props の値に対して常に `false` を返し、そして `render` は毎回レンダープロップとして新しい値を生成するためです。
 
-たとえば、上記の `<Mouse>` コンポーネントの場合、`Mouse` が `React.Component` ではなく `React.PureComponent` を継承していたとすると、次のようになります。 
+たとえば、上記の `<Mouse>` コンポーネントの場合、`Mouse` が `React.Component` ではなく `React.PureComponent` を継承していたとすると、次のようになります。
 
 ```js
 class Mouse extends React.PureComponent {
diff --git a/content/docs/rendering-elements.md b/content/docs/rendering-elements.md
index da93b575d..f4b0915d0 100644
--- a/content/docs/rendering-elements.md
+++ b/content/docs/rendering-elements.md
@@ -34,7 +34,7 @@ HTML ファイルの中に `<div>` 要素があったとしましょう：
 
 React だけで構築されたアプリケーションは、通常ルート DOM ノードをひとつだけ持ちます。既存のアプリに React を統合しようとしている場合は、独立したルート DOM ノードを好きなだけ持つことができます。
 
-React 要素をルートDOM ノードにレンダリングするには、その2つを `ReactDOM.render()` に渡します：
+React 要素をルート DOM ノードにレンダリングするには、その 2 つを `ReactDOM.render()` に渡します：
 
 `embed:rendering-elements/render-an-element.js`
 
diff --git a/content/docs/state-and-lifecycle.md b/content/docs/state-and-lifecycle.md
index 566fec28d..36b1329c7 100644
--- a/content/docs/state-and-lifecycle.md
+++ b/content/docs/state-and-lifecycle.md
@@ -80,7 +80,7 @@ state は props に似ていますが、コンポーネントによって完全
 
 1. `React.Component` を継承する同名の [ES6 クラス](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Classes)を作成する。
 
-2. `render()` と呼ばれる空のメソッドを1つ追加する。
+2. `render()` と呼ばれる空のメソッドを 1 つ追加する。
 
 3. 関数の中身を `render()` メソッドに移動する。
 
@@ -316,7 +316,7 @@ ReactDOM.render(
 
 4) ブラウザは、毎秒ごとに `tick()` メソッドを呼び出します。その中で `Clock` コンポーネントは、現在時刻を含んだオブジェクトを引数として `setState()` を呼び出すことで、UI の更新をスケジュールします。`setState()` が呼び出されたおかげで、React は state が変わったということが分かるので、`render()` メソッドを再度呼び出して、画面上に何を表示すべきかを知ります。今回は、`render()` メソッド内の `this.state.date` が異なっているので、レンダリングされる出力には新しく更新された時間が含まれています。それに従って React は DOM を更新します。
 
-5) この後に `Clock` コンポーネントが DOM から削除されることがあれば、React は`componentWillUnmount()` ライフサイクルメソッドを呼び出し、これによりタイマーが停止します。
+5) この後に `Clock` コンポーネントが DOM から削除されることがあれば、React は `componentWillUnmount()` ライフサイクルメソッドを呼び出し、これによりタイマーが停止します。
 
 ## state を正しく使用する {#using-state-correctly}
 
@@ -377,7 +377,7 @@ this.setState(function(state, props) {
 
 ### state の更新はマージされる {#state-updates-are-merged}
 
-`setState()` を呼び出した場合、 React は与えられたオブジェクトを現在の state にマージします。
+`setState()` を呼び出した場合、React は与えられたオブジェクトを現在の state にマージします。
 
 例えば、あなたの state はいくつかの独立した変数を含んでいるかもしれません：
 
@@ -443,7 +443,7 @@ function FormattedDate(props) {
 
 コンポーネントツリーとは props が流れ落ちる滝なのだと想像すると、各コンポーネントの state とは任意の場所で合流してくる追加の水源であり、それらもまた下に流れ落ちていくものなのです。
 
-全てのコンポーネントが本当に独立していることを示すのに、3つの `<Clock>` をレンダリングする `App` コンポーネントを作成します：
+全てのコンポーネントが本当に独立していることを示すのに、3 つの `<Clock>` をレンダリングする `App` コンポーネントを作成します：
 
 ```js{4-6}
 function App() {
diff --git a/content/docs/thinking-in-react.md b/content/docs/thinking-in-react.md
index d2ecce71f..1e9c00174 100644
--- a/content/docs/thinking-in-react.md
+++ b/content/docs/thinking-in-react.md
@@ -8,7 +8,7 @@ redirect_from:
 prev: composition-vs-inheritance.html
 ---
 
-巨大で軽快なWebアプリを開発する場合に、React は最高の手段であると、私たちは考えています。Facebook や Instagram といった私たちのサービスにおいても、とてもよくスケールしています。
+巨大で軽快な Web アプリを開発する場合に、React は最高の手段であると、私たちは考えています。Facebook や Instagram といった私たちのサービスにおいても、とてもよくスケールしています。
 
 React のすばらしい特長がいくつもありますが、あなたがどんなアプリを作ろうかと考えたことが、そのままアプリの作り方になる、というのはそのひとつです。本ドキュメントでは、検索可能な商品データ表を React で作っていく様子をお見せしましょう。
 
@@ -50,7 +50,7 @@ JSON のデータモデルをユーザーに向けて表示することはよく
   4. **`ProductCategoryRow`（水色）：** *カテゴリ* を見出しとして表示する
   5. **`ProductRow`（赤色）：** 各 *商品* を 1 行で表示する
 
-`ProductTable` を見てみると、表のヘッダー（「Name」や「Price」のラベルを含む）が単独のコンポーネントになっていないことがわかります。これは好みの問題で、コンポーネントにするかしないかは両論あります。今回の例でいえば、ヘッダーを `ProductTable` の一部にしたのは、 *データの集合* を描画するという `ProductTable` の責務の一環として適切だったからです。しかしながら、将来ヘッダーが肥大化して複雑になった場合（例えばソート機能を追加した場合など）は、`ProductTableHeader` のようなコンポーネントにするのが適切になるでしょう。
+`ProductTable` を見てみると、表のヘッダー（「Name」や「Price」のラベルを含む）が単独のコンポーネントになっていないことがわかります。これは好みの問題で、コンポーネントにするかしないかは両論あります。今回の例でいえば、ヘッダーを `ProductTable` の一部にしたのは、*データの集合*を描画するという `ProductTable` の責務の一環として適切だったからです。しかしながら、将来ヘッダーが肥大化して複雑になった場合（例えばソート機能を追加した場合など）は、`ProductTableHeader` のようなコンポーネントにするのが適切になるでしょう。
 
 さて、モック内にコンポーネントを特定できましたので、階層構造に並べてみましょう。簡単なことです。モックで他のコンポーネントの中にあるコンポーネントを、階層構造でも子要素として配置すればいいのです。次のようになります。
 
@@ -69,7 +69,7 @@ JSON のデータモデルをユーザーに向けて表示することはよく
 
 データモデルを描画するだけの機能を持った静的なバージョンのアプリを作る際には、他のコンポーネントを再利用しつつそれらに *props* を通じてデータを渡す形で、自分のコンポーネントを組み上げていきましょう。*props* は親から子へとデータを渡すための手段です。もし、あなたが *state* に慣れ親しんでいる場合でも、今回の静的なバージョンを作る上では**一切 state を使わないでください。**state はユーザー操作や時間経過などで動的に変化するデータを扱うために確保されている機能です。今回のアプリは静的なバージョンなので、state は必要ありません。
 
-コンポーネントはトップダウンで作っても、ボトムアップで作っても問題ありません。 つまり、高い階層にあるコンポーネント（例えば `FilterableProductTable`）から作り始めても、低い階層にあるコンポーネント（`ProductRow` など）から作り始めても、どちらでもいいのです。シンプルなアプリでは通常トップダウンで作った方が楽ですが、大きなプロジェクトでは開発をしながらテストを書き、ボトムアップで進める方がより簡単です。
+コンポーネントはトップダウンで作っても、ボトムアップで作っても問題ありません。つまり、高い階層にあるコンポーネント（例えば `FilterableProductTable`）から作り始めても、低い階層にあるコンポーネント（`ProductRow` など）から作り始めても、どちらでもいいのです。シンプルなアプリでは通常トップダウンで作った方が楽ですが、大きなプロジェクトでは開発をしながらテストを書き、ボトムアップで進める方がより簡単です。
 
 ここまでのステップを終えると、データモデルを描画する再利用可能なコンポーネントのライブラリが手に入ります。このアプリは静的なバージョンなので、コンポーネントは `render()` メソッドだけを持つことになります。階層構造の中で最上位のコンポーネント（`FilterableProductTable`）が、データモデルを props として受け取ることになるでしょう。元となるデータモデルを更新して再度 `ReactDOM.render()` を呼び出すと、UI が更新されることになります。このやり方なら、複雑なことをしていないので、UI がどのように更新されて、どこを変更すればよいか、容易に理解できることでしょう。React の**単方向データフロー**（あるいは*単方向バインディング*）により、すべてがモジュール化された高速な状態で保たれます。
 
@@ -94,9 +94,9 @@ UI をインタラクティブなものにするためには元となってい
 
 それぞれについて見ていき、どれが state になりうるのかを考えてみます。各データについて、3 つの質問をするだけです。
 
-  1. 親から props を通じて与えられたデータでしょうか？　もしそうなら、それは state ではありません
-  2. 時間経過で変化しないままでいるデータでしょうか？　もしそうなら、それは state ではありません
-  3. コンポーネント内にある他の props や state を使って算出可能なデータでしょうか？　もしそうなら、それは state ではありません
+  1. 親から props を通じて与えられたデータでしょうか？ もしそうなら、それは state ではありません
+  2. 時間経過で変化しないままでいるデータでしょうか？ もしそうなら、それは state ではありません
+  3. コンポーネント内にある他の props や state を使って算出可能なデータでしょうか？ もしそうなら、それは state ではありません
 
 元となる商品のリストは props から渡されるので、これは state ではありません。検索文字列とチェックボックスは時間の経過の中で変化し、また、算出することもできないため、state だと思われます。最後に、フィルタ済みの商品のリストは state ではありません。何故ならば、元となる商品のリストと検索文字列とチェックボックスの値を組み合わせることで、フィルタ済みの商品のリストを算出することが可能だからです。
 
@@ -140,7 +140,7 @@ React ではデータフローが明示的になりプログラムの動作が
 
 試しに、現在のバージョンのサンプルで文字を打ち込んだり、チェックボックスを切り替えてみると、React がその入力を無視することがわかります。これは意図的な挙動で、`input` の `value` props が、常に `FilterableProductTable` から渡された `state` と同じ値になるようにセットしてあるのです。
 
-それでは、どんな挙動になってほしいのかを考えてみましょう。ユーザーがフォームを変更するたびに、ユーザー入力を反映するように state を更新したいですね。コンポーネントの state を更新できるのは自分自身だけであるべきなので、 `FilterableProductTable` は `SearchBar` にコールバックを渡しておいて、state を更新したいときに実行してもらうようにします。入力のたびに呼び出される `onChange` イベントを利用するとよいでしょう。このコールバックを実行された `FilterableProductTable` は、`setState()` を呼び出し、その結果としてアプリが更新されます。
+それでは、どんな挙動になってほしいのかを考えてみましょう。ユーザーがフォームを変更するたびに、ユーザー入力を反映するように state を更新したいですね。コンポーネントの state を更新できるのは自分自身だけであるべきなので、`FilterableProductTable` は `SearchBar` にコールバックを渡しておいて、state を更新したいときに実行してもらうようにします。入力のたびに呼び出される `onChange` イベントを利用するとよいでしょう。このコールバックを実行された `FilterableProductTable` は、`setState()` を呼び出し、その結果としてアプリが更新されます。
 
 これは複雑に思えるかもしれませんが、ほんの数行のコードです。そして、これらはデータがアプリの中をどのように流れているのかを、明確に示しているのです。
 
diff --git a/package.json b/package.json
index 9dfd80a65..689a82028 100644
--- a/package.json
+++ b/package.json
@@ -80,7 +80,7 @@
     "format:examples": "prettier --config examples/.prettierrc --write \"examples/**/*.js\"",
     "generate-ids": "node scripts/generateHeadingIDs.js content",
     "lint": "eslint .",
-    "lint:text": "textlint content/{docs,home,tutorial,warnings}/*.md",
+    "lint:text": "textlint --rulesdir=./textlint content/{docs,home,tutorial,warnings}/*.md",
     "netlify": "yarn --version && rimraf node_modules && yarn install --frozen-lockfile --check-files && yarn build",
     "nit:source": "prettier --config .prettierrc --list-different \"{gatsby-*.js,{flow-typed,plugins,src}/**/*.js}\"",
     "nit:examples": "prettier --config examples/.prettierrc --list-different \"examples/**/*.js\"",
diff --git a/textlint/jp-reactjs-org-lint.js b/textlint/jp-reactjs-org-lint.js
new file mode 100644
index 000000000..9c8554360
--- /dev/null
+++ b/textlint/jp-reactjs-org-lint.js
@@ -0,0 +1,88 @@
+const toString = require('mdast-util-to-string');
+
+module.exports = context => {
+  return {
+    // [context.Syntax.Header]: node => {},
+
+    [context.Syntax.Paragraph]: node => {
+      // Checks against paragraph-based rules.
+
+      // Convert a paragraph to plain text, stripping any markups
+      const text = toString(node);
+
+      enforceSpaceAfterQuestionOrExclamation(node, text, context);
+      noHanPunctSpace(node, text, context);
+      enforceZenHanSpace(node, text, context);
+      noLineEndSpace(node, text, context);
+    },
+
+    [context.Syntax.Str]: node => {
+      const text = toString(node);
+      const index = text.indexOf('　');
+      if (index >= 0) {
+        context.report(
+          node,
+          new context.RuleError(
+            'いかなる場合も全角スペースは使用しないでください。',
+            {index},
+          ),
+        );
+      }
+    },
+  };
+};
+
+const enforceSpaceAfterQuestionOrExclamation = (node, text, context) => {
+  const markReg = /[！？](\u3000|[A-Za-z0-9]|[\u3400-\u4DBF\u4E00-\u9FFF\uF900-\uFAFF]|[\uD840-\uD87F][\uDC00-\uDFFF]|[ぁ-んァ-ヶ])/;
+  if (markReg.exec(text)) {
+    context.report(
+      node,
+      new context.RuleError(
+        '全角の「！」「？」と次の文の間には半角スペースを挿入してください。',
+      ),
+    );
+  }
+};
+
+const noHanPunctSpace = (node, text, context) => {
+  const match = /(.{0,3})[、。]( |\u3000)/.exec(text);
+  if (match) {
+    context.report(
+      node,
+      new context.RuleError(
+        `全角の句読点の直後にスペースを入れてはいけません("${match[0]}")。`,
+      ),
+    );
+  }
+};
+
+const enforceZenHanSpace = (node, text, context) => {
+  const hanZen = /[A-Za-z0-9](?:[\u3400-\u4DBF\u4E00-\u9FFF\uF900-\uFAFF]|[\uD840-\uD87F][\uDC00-\uDFFF]|[ぁ-んァ-ヶ])/;
+  const zenHan = /(?:[\u3400-\u4DBF\u4E00-\u9FFF\uF900-\uFAFF]|[\uD840-\uD87F][\uDC00-\uDFFF]|[ぁ-んァ-ヶ])[A-Za-z0-9]/;
+
+  const hanZenMatch = hanZen.exec(text);
+  const zenHanMatch = zenHan.exec(text);
+
+  if (hanZenMatch || zenHanMatch) {
+    const matched = hanZenMatch ? hanZenMatch[0] : zenHanMatch[0];
+    context.report(
+      node,
+      new context.RuleError(
+        `全角文字と半角英数字とが隣接しています("${matched}")。` + 
+        `半角スペースを挿入してください。`,
+      ),
+    );
+  }
+};
+
+const noLineEndSpace = (node, text, context) => {
+  // This detects a line-end space *only when* the line contains Japanese characters.
+  const reg = /(?:[\u3400-\u4DBF\u4E00-\u9FFF\uF900-\uFAFF]|[\uD840-\uD87F][\uDC00-\uDFFF]|[ぁ-んァ-ヶ]).?(\s|\u3000)$/;
+
+  if (reg.exec(text)) {
+    context.report(
+      node,
+      new context.RuleError('行末にスペース文字を入れないでください。'),
+    );
+  }
+};