From f8514f317a3503b1d7460935aeab17b18b0ef80b Mon Sep 17 00:00:00 2001 From: blkclct Date: Tue, 11 Feb 2020 21:04:13 +0900 Subject: [PATCH 01/12] Update: translated until Importing third-party components --- docs/docs/adding-react-components.md | 34 ++++++++++++++-------------- 1 file changed, 17 insertions(+), 17 deletions(-) diff --git a/docs/docs/adding-react-components.md b/docs/docs/adding-react-components.md index eb632e9f6..eabcab216 100644 --- a/docs/docs/adding-react-components.md +++ b/docs/docs/adding-react-components.md @@ -1,20 +1,20 @@ --- -title: Adding React Components +title: React コンポーネントを追加する --- -This guide covers how to add React components to your Gatsby site. +このガイドは、あなたの Gatsby サイトに React コンポーネントを追加する方法を解説します。 -## React components +## React コンポーネント -React components are prebuilt elements or groups of elements that can be used to split your User Interface (UI) into independent, reusable pieces. There are multiple types of components you can write: this guide covers functional components. For more in-depth information on writing React components including classes, check out the [React documentation](https://reactjs.org/docs/components-and-props.html). +React コンポーネントは、あなたのユーザーインターフェース (UI) を独立した再利用可能な部品として分割するために使えるすでに構築された要素、もしくは要素の集合です。React コンポーネントで書くことができるコンポーネントの種類は多くあるのですが、このガイドでは、関数コンポーネントを使用します。クラスコンポーネントを含む React コンポーネントの書き方について詳細を知りたい場合は、こちらの [React ドキュメント](https://ja.reactjs.org/docs/components-and-props.html)をご覧ください。 -Components also offer the ability to be customized using inputs, better known as "props" (properties). Props can be of any JavaScript type, such as Boolean, String, Object, Array or almost anything you can think of. +コンポーネントは、"props" (プロパティ）として知られる入力を用いてカスタマイズされる機能も提供されています。 Props は、ブーリアンや文字列、オブジェクト、配列など、考えられるほぼすべての JavaScript の型になりえます。 -For example, you could use a component for Buttons on your site. This would enable them to be used multiple times across pages with different labels or actions each time. +例えば、あなたのサイト上のボタンに対してコンポーネントを使えます。これで、毎回異なるラベルやアクションを持つページを越えて、複数回使用できます。 -## Importing React components +## React コンポーネントをインポートする -In Gatsby, when using React components, you can import and use them like you would in a React application. Here's an example of the [Gatsby Link](/docs/gatsby-link/) component in action, which brings with it extra functionality for performance: +Gatsby で React コンポーネントを使うときは、React アプリケーションと同じようにしてインポートして使用できます。ここでは、動作している [Gatsby Link](/docs/gatsby-link/) を例にします。そして、パフォーマンスのための追加機能をもたらします。 ```jsx import React from "react" @@ -27,32 +27,32 @@ export default () => ( ) ``` -### Importing third-party components +### サードパーティコンポーネントをインポートする -Just like React, Gatsby also supports third-party components and libraries. You can install a third-party component or library via your package manager. We tend to favour and use npm and we will reflect this in our examples. +React と同様にして、Gatsby でもサードパーティコンポーネントとライブラリはサポートしています。あなたは、パッケージマネジャ経由でサードパーティコンポーネントやライブラリをインストールできます。私たちは、 npm を好んで使用する傾向にあるので、 npm を例にしています。 -Here's an example of adding a third-party component to your site. +ここでは、あなたのサイトにサードパーティコンポーネントを追加する一例を挙げています。 -First, you have to install the component or library's package via a package manager. It's recommended not to mix package managers, so if you use npm, don't use another and vice versa. +はじめに、パッケージマネジャでコンポーネントやライブラリのパッケージをインストールしなければなりません。パッケージマネジャを組み合わせることはおすすめしません。だから、もしあなたが npm を使用するなら別のものは使用しないでください。また逆もまた然りです。 ```shell npm install @material-ui/core ``` -After you've installed a package, import and use it in your page's source: +パッケージのインストールが完了したら、あなたのページのソースコード上でインポートして使用します。 ```jsx:title=my-page.jsx import React from "react" -// import my fancy third-party component +// わたしの素敵なサードパーティコンポーネントをインポートする import Button from "@material-ui/core/Button" export default () => (
-

This is my super awesome page made with Gatsby!

+

これは、わたしの超すごい Gatsby でできたページです!

- {/* use my fancy third-party component */} - + {/* わたしの素敵なサードパーティコンポーネントを使用する */} +
) ``` From 37c4178b7cae44c5d9f20b1b8626ab27b6d2f2a6 Mon Sep 17 00:00:00 2001 From: blkclct Date: Tue, 11 Feb 2020 21:36:13 +0900 Subject: [PATCH 02/12] Update: translated until Fixing third-party modules --- docs/docs/adding-react-components.md | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/docs/docs/adding-react-components.md b/docs/docs/adding-react-components.md index eabcab216..3f302b05a 100644 --- a/docs/docs/adding-react-components.md +++ b/docs/docs/adding-react-components.md @@ -57,25 +57,25 @@ export default () => ( ) ``` -## Things to watch out for +## 気をつけるべきこと -Since Gatsby uses Server-Side Rendering (SSR) to generate your site's pages, the JSX code you write is usually compiled before the browser loads the page. Because of this, certain features are not available at compile time and can cause a build error. +Gatsby は、サーバサイドレンダリング (SSR) を使用してサイトのページを生成しているため、たいていの場合、ブラウザがページをロードする前にあなたが書いた JSX のコードが、コンパイルされます。このため、ある機能は、コンパイルした時に利用できずビルドエラーになることがあります。 -### Use of browser globals +### ブラウザグローバルの使用について -Some components or code reference browser globals such as `window`, `document` or `localStorage`. These objects are not available at [build](/docs/glossary#build) time and can result in a webpack error when compiling: +一部のコンポーネントやコードでは、 `window`、 `document`、 `localStorage` のようなブラウザグローバルを参照することがあります。それらのオブジェクトでは、[ビルド](/docs/glossary#build) 時点では利用できず、コンパイル時に webpack エラーが発生する可能性があります。 ```text WebpackError: ReferenceError: window is not defined ``` -To learn more about solutions for supporting SSR and client-side libraries, check out the related section on the [Porting from Create React App documentation](/docs/porting-from-create-react-app-to-gatsby#server-side-rendering-and-browser-apis). +SSR およびクライアントサイドライブラリをサポートする解決策については、[Create React App から Gatsby への移植](/docs/porting-from-create-react-app-to-gatsby#server-side-rendering-and-browser-apis)に関連するセクションをご覧ください。 -#### Fixing third-party modules +#### サードパーティモジュールを直す -Some packages expect `window` or another browser global to be defined. These packages will have to be patched. +一部のパッケージは、 `window` もしくは、別のブラウザグローバルが定義されることを期待します。それらのパッケージは、パッチを適用する必要があります。 -You can learn how to patch these packages on the [Debugging HTML Builds documentation](/docs/debugging-html-builds/#fixing-third-party-modules). +[HTML ビルドのデバッグ](/docs/debugging-html-builds/#fixing-third-party-modules) でそれらのパッケージにパッチを適用する方法を学べます。 ### Components without server-side rendering From b538ce586722826213f4f448910c0bbf40b650ba Mon Sep 17 00:00:00 2001 From: blkclct Date: Wed, 12 Feb 2020 13:49:06 +0900 Subject: [PATCH 03/12] Update: translated until Components without server-side rendering and fix --- docs/docs/adding-react-components.md | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/docs/docs/adding-react-components.md b/docs/docs/adding-react-components.md index 3f302b05a..03b32f1fa 100644 --- a/docs/docs/adding-react-components.md +++ b/docs/docs/adding-react-components.md @@ -6,7 +6,7 @@ title: React コンポーネントを追加する ## React コンポーネント -React コンポーネントは、あなたのユーザーインターフェース (UI) を独立した再利用可能な部品として分割するために使えるすでに構築された要素、もしくは要素の集合です。React コンポーネントで書くことができるコンポーネントの種類は多くあるのですが、このガイドでは、関数コンポーネントを使用します。クラスコンポーネントを含む React コンポーネントの書き方について詳細を知りたい場合は、こちらの [React ドキュメント](https://ja.reactjs.org/docs/components-and-props.html)をご覧ください。 +React コンポーネントは、ユーザーインターフェース (UI) を独立した再利用可能な部品として分割するために使えるすでに構築された要素、もしくは要素の集合です。React コンポーネントで書くことができるコンポーネントの種類は多くあるのですが、このガイドでは、関数コンポーネントを使用します。クラスコンポーネントを含む React コンポーネントの書き方について詳細を知りたい場合は、こちらの [React ドキュメント](https://ja.reactjs.org/docs/components-and-props.html)をご覧ください。 コンポーネントは、"props" (プロパティ）として知られる入力を用いてカスタマイズされる機能も提供されています。 Props は、ブーリアンや文字列、オブジェクト、配列など、考えられるほぼすべての JavaScript の型になりえます。 @@ -31,9 +31,9 @@ export default () => ( React と同様にして、Gatsby でもサードパーティコンポーネントとライブラリはサポートしています。あなたは、パッケージマネジャ経由でサードパーティコンポーネントやライブラリをインストールできます。私たちは、 npm を好んで使用する傾向にあるので、 npm を例にしています。 -ここでは、あなたのサイトにサードパーティコンポーネントを追加する一例を挙げています。 +ここでは、サイトにサードパーティコンポーネントを追加する一例を挙げています。 -はじめに、パッケージマネジャでコンポーネントやライブラリのパッケージをインストールしなければなりません。パッケージマネジャを組み合わせることはおすすめしません。だから、もしあなたが npm を使用するなら別のものは使用しないでください。また逆もまた然りです。 +はじめに、パッケージマネジャでコンポーネントやライブラリのパッケージをインストールしなければなりません。パッケージマネジャを組み合わせることはおすすめしません。なので、もしあなたが npm を使用するなら別のものは使用しないことをおすすめします。また逆もまた然りです。 ```shell npm install @material-ui/core @@ -77,8 +77,8 @@ SSR およびクライアントサイドライブラリをサポートする解 [HTML ビルドのデバッグ](/docs/debugging-html-builds/#fixing-third-party-modules) でそれらのパッケージにパッチを適用する方法を学べます。 -### Components without server-side rendering +### サーバサイドレンダリングなしのコンポーネント -Server-side rendering means pages and content are built out by the Node.js server and then sent to a browser ready to go. It’s like your pages are constructed before even being sent to the user. Gatsby is server-side rendered at build time, meaning that the code that gets to your browser has already been run to build pages and content, but this doesn’t mean you can’t still have dynamic pages. +サーバサイドレンダリングは、ページとコンテンツが Node.js サーバによってビルドされ、ブラウザに送信されることを意味します。ユーザーに送信される前にページが構築されるようなものです。Gatsby では、ビルド時にサーバサイドでレンダリングされます。つまり、ブラウザーに到達するコードは、すでにページとコンテンツをビルドするために実行されています。しかし、これはまだ動的なページを保持できないことを意味します。 -Some React components don't have server-side rendering support (SSR) out-of-the-box so you might have to add SSR yourself. +一部の React コンポーネントは、デフォルトでサーバサイドレンダリング (SSR) がサポートされていないため、SSR を自分自身で追加する必要があるかもしれません。 From 8c18e66da00362b90c17d1b57ac0a0adbca20d98 Mon Sep 17 00:00:00 2001 From: blkclct Date: Wed, 12 Feb 2020 14:01:06 +0900 Subject: [PATCH 04/12] Update: fixed lint-error --- docs/docs/adding-react-components.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/docs/docs/adding-react-components.md b/docs/docs/adding-react-components.md index 03b32f1fa..ae8bdb2b0 100644 --- a/docs/docs/adding-react-components.md +++ b/docs/docs/adding-react-components.md @@ -8,7 +8,7 @@ title: React コンポーネントを追加する React コンポーネントは、ユーザーインターフェース (UI) を独立した再利用可能な部品として分割するために使えるすでに構築された要素、もしくは要素の集合です。React コンポーネントで書くことができるコンポーネントの種類は多くあるのですが、このガイドでは、関数コンポーネントを使用します。クラスコンポーネントを含む React コンポーネントの書き方について詳細を知りたい場合は、こちらの [React ドキュメント](https://ja.reactjs.org/docs/components-and-props.html)をご覧ください。 -コンポーネントは、"props" (プロパティ）として知られる入力を用いてカスタマイズされる機能も提供されています。 Props は、ブーリアンや文字列、オブジェクト、配列など、考えられるほぼすべての JavaScript の型になりえます。 +コンポーネントは、 "props" (プロパティ）として知られる入力を用いてカスタマイズされる機能も提供されています。 Props は、ブーリアンや文字列、オブジェクト、配列など、考えられるほぼすべての JavaScript の型になりえます。 例えば、あなたのサイト上のボタンに対してコンポーネントを使えます。これで、毎回異なるラベルやアクションを持つページを越えて、複数回使用できます。 @@ -59,11 +59,11 @@ export default () => ( ## 気をつけるべきこと -Gatsby は、サーバサイドレンダリング (SSR) を使用してサイトのページを生成しているため、たいていの場合、ブラウザがページをロードする前にあなたが書いた JSX のコードが、コンパイルされます。このため、ある機能は、コンパイルした時に利用できずビルドエラーになることがあります。 +Gatsby は、サーバサイドレンダリング (SSR) を使用してサイトのページを生成しているため、たいていの場合、ブラウザがページをロードする前にあなたが書いた JSX のコードが、コンパイルされます。このため、ある機能は、コンパイルした時に利用できずビルドエラーとなることがあります。 ### ブラウザグローバルの使用について -一部のコンポーネントやコードでは、 `window`、 `document`、 `localStorage` のようなブラウザグローバルを参照することがあります。それらのオブジェクトでは、[ビルド](/docs/glossary#build) 時点では利用できず、コンパイル時に webpack エラーが発生する可能性があります。 +一部のコンポーネントやコードでは、 `window`、 `document`、 `localStorage` のようなブラウザグローバルを参照することがあります。それらのオブジェクトでは、[ビルド](/docs/glossary#build) 時点では利用できず、コンパイル時に webpack エラーが発生することもあります。 ```text WebpackError: ReferenceError: window is not defined @@ -79,6 +79,6 @@ SSR およびクライアントサイドライブラリをサポートする解 ### サーバサイドレンダリングなしのコンポーネント -サーバサイドレンダリングは、ページとコンテンツが Node.js サーバによってビルドされ、ブラウザに送信されることを意味します。ユーザーに送信される前にページが構築されるようなものです。Gatsby では、ビルド時にサーバサイドでレンダリングされます。つまり、ブラウザーに到達するコードは、すでにページとコンテンツをビルドするために実行されています。しかし、これはまだ動的なページを保持できないことを意味します。 +サーバサイドレンダリングは、ページとコンテンツが Node.js サーバーでビルドされ、ブラウザーに送信されることを意味します。ユーザーに送信される前で、ページが構築されるようなものです。Gatsby では、ビルド時にサーバサイドでレンダリングされます。つまり、ブラウザーに到達するコードは、すでにページとコンテンツをビルドするために実行されています。しかし、これはまだ動的なページを保持できないことを意味します。 一部の React コンポーネントは、デフォルトでサーバサイドレンダリング (SSR) がサポートされていないため、SSR を自分自身で追加する必要があるかもしれません。 From 5b6ccdae0d0cfa39bd9b61937d4337fee3e93027 Mon Sep 17 00:00:00 2001 From: blkclct Date: Thu, 13 Feb 2020 15:56:07 +0900 Subject: [PATCH 05/12] Fix: deleted needless space --- docs/docs/adding-react-components.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/docs/docs/adding-react-components.md b/docs/docs/adding-react-components.md index ae8bdb2b0..b64026d5d 100644 --- a/docs/docs/adding-react-components.md +++ b/docs/docs/adding-react-components.md @@ -8,7 +8,7 @@ title: React コンポーネントを追加する React コンポーネントは、ユーザーインターフェース (UI) を独立した再利用可能な部品として分割するために使えるすでに構築された要素、もしくは要素の集合です。React コンポーネントで書くことができるコンポーネントの種類は多くあるのですが、このガイドでは、関数コンポーネントを使用します。クラスコンポーネントを含む React コンポーネントの書き方について詳細を知りたい場合は、こちらの [React ドキュメント](https://ja.reactjs.org/docs/components-and-props.html)をご覧ください。 -コンポーネントは、 "props" (プロパティ）として知られる入力を用いてカスタマイズされる機能も提供されています。 Props は、ブーリアンや文字列、オブジェクト、配列など、考えられるほぼすべての JavaScript の型になりえます。 +コンポーネントは、"props"(プロパティ）として知られる入力を用いてカスタマイズされる機能も提供されています。 Props は、ブーリアンや文字列、オブジェクト、配列など、考えられるほぼすべての JavaScript の型になりえます。 例えば、あなたのサイト上のボタンに対してコンポーネントを使えます。これで、毎回異なるラベルやアクションを持つページを越えて、複数回使用できます。 @@ -29,7 +29,7 @@ export default () => ( ### サードパーティコンポーネントをインポートする -React と同様にして、Gatsby でもサードパーティコンポーネントとライブラリはサポートしています。あなたは、パッケージマネジャ経由でサードパーティコンポーネントやライブラリをインストールできます。私たちは、 npm を好んで使用する傾向にあるので、 npm を例にしています。 +React と同様にして、Gatsby でもサードパーティコンポーネントとライブラリはサポートしています。あなたは、パッケージマネジャ経由でサードパーティコンポーネントやライブラリをインストールできます。私たちは、npm を好んで使用する傾向にあるので、npm を例にしています。 ここでは、サイトにサードパーティコンポーネントを追加する一例を挙げています。 @@ -63,7 +63,7 @@ Gatsby は、サーバサイドレンダリング (SSR) を使用してサイト ### ブラウザグローバルの使用について -一部のコンポーネントやコードでは、 `window`、 `document`、 `localStorage` のようなブラウザグローバルを参照することがあります。それらのオブジェクトでは、[ビルド](/docs/glossary#build) 時点では利用できず、コンパイル時に webpack エラーが発生することもあります。 +一部のコンポーネントやコードでは、`window`、`document`、`localStorage` のようなブラウザグローバルを参照することがあります。それらのオブジェクトでは、[ビルド](/docs/glossary#build) 時点では利用できず、コンパイル時に webpack エラーが発生することもあります。 ```text WebpackError: ReferenceError: window is not defined @@ -73,7 +73,7 @@ SSR およびクライアントサイドライブラリをサポートする解 #### サードパーティモジュールを直す -一部のパッケージは、 `window` もしくは、別のブラウザグローバルが定義されることを期待します。それらのパッケージは、パッチを適用する必要があります。 +一部のパッケージは、`window` もしくは、別のブラウザグローバルが定義されることを期待します。それらのパッケージは、パッチを適用する必要があります。 [HTML ビルドのデバッグ](/docs/debugging-html-builds/#fixing-third-party-modules) でそれらのパッケージにパッチを適用する方法を学べます。 From ced8c1ca375877f8f91c049f126a28d732e7f9e1 Mon Sep 17 00:00:00 2001 From: Hiroki Fujimoto Date: Fri, 14 Feb 2020 00:13:52 +0900 Subject: [PATCH 06/12] Update docs/docs/adding-react-components.md Co-Authored-By: BSKY --- docs/docs/adding-react-components.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/docs/adding-react-components.md b/docs/docs/adding-react-components.md index b64026d5d..16e85dac1 100644 --- a/docs/docs/adding-react-components.md +++ b/docs/docs/adding-react-components.md @@ -6,7 +6,7 @@ title: React コンポーネントを追加する ## React コンポーネント -React コンポーネントは、ユーザーインターフェース (UI) を独立した再利用可能な部品として分割するために使えるすでに構築された要素、もしくは要素の集合です。React コンポーネントで書くことができるコンポーネントの種類は多くあるのですが、このガイドでは、関数コンポーネントを使用します。クラスコンポーネントを含む React コンポーネントの書き方について詳細を知りたい場合は、こちらの [React ドキュメント](https://ja.reactjs.org/docs/components-and-props.html)をご覧ください。 +React コンポーネントは、ユーザーインターフェース（UI）を独立した再利用可能な部品として分割するために使えるすでに構築された要素、もしくは要素の集合です。React コンポーネントで書くことができるコンポーネントの種類は多くあるのですが、このガイドでは、関数コンポーネントを使用します。クラスコンポーネントを含む React コンポーネントの書き方について詳細を知りたい場合は、こちらの [React ドキュメント](https://ja.reactjs.org/docs/components-and-props.html)をご覧ください。 コンポーネントは、"props"(プロパティ）として知られる入力を用いてカスタマイズされる機能も提供されています。 Props は、ブーリアンや文字列、オブジェクト、配列など、考えられるほぼすべての JavaScript の型になりえます。 From 77023bf010b42c86d3c8f7f34ed750c4dd31393c Mon Sep 17 00:00:00 2001 From: Hiroki Fujimoto Date: Fri, 14 Feb 2020 00:14:54 +0900 Subject: [PATCH 07/12] Update docs/docs/adding-react-components.md Co-Authored-By: BSKY --- docs/docs/adding-react-components.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/docs/adding-react-components.md b/docs/docs/adding-react-components.md index 16e85dac1..dba1db033 100644 --- a/docs/docs/adding-react-components.md +++ b/docs/docs/adding-react-components.md @@ -8,7 +8,7 @@ title: React コンポーネントを追加する React コンポーネントは、ユーザーインターフェース（UI）を独立した再利用可能な部品として分割するために使えるすでに構築された要素、もしくは要素の集合です。React コンポーネントで書くことができるコンポーネントの種類は多くあるのですが、このガイドでは、関数コンポーネントを使用します。クラスコンポーネントを含む React コンポーネントの書き方について詳細を知りたい場合は、こちらの [React ドキュメント](https://ja.reactjs.org/docs/components-and-props.html)をご覧ください。 -コンポーネントは、"props"(プロパティ）として知られる入力を用いてカスタマイズされる機能も提供されています。 Props は、ブーリアンや文字列、オブジェクト、配列など、考えられるほぼすべての JavaScript の型になりえます。 +コンポーネントは、"props"（プロパティ）として知られる入力を用いてカスタマイズされる機能も提供されています。 Props は、ブーリアンや文字列、オブジェクト、配列など、考えられるほぼすべての JavaScript の型になりえます。 例えば、あなたのサイト上のボタンに対してコンポーネントを使えます。これで、毎回異なるラベルやアクションを持つページを越えて、複数回使用できます。 From 3ae8714db9a678cec1e71ebcb0d4c5f0cdc74395 Mon Sep 17 00:00:00 2001 From: Hiroki Fujimoto Date: Fri, 14 Feb 2020 00:15:04 +0900 Subject: [PATCH 08/12] Update docs/docs/adding-react-components.md Co-Authored-By: BSKY --- docs/docs/adding-react-components.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/docs/adding-react-components.md b/docs/docs/adding-react-components.md index dba1db033..899d3c724 100644 --- a/docs/docs/adding-react-components.md +++ b/docs/docs/adding-react-components.md @@ -81,4 +81,4 @@ SSR およびクライアントサイドライブラリをサポートする解 サーバサイドレンダリングは、ページとコンテンツが Node.js サーバーでビルドされ、ブラウザーに送信されることを意味します。ユーザーに送信される前で、ページが構築されるようなものです。Gatsby では、ビルド時にサーバサイドでレンダリングされます。つまり、ブラウザーに到達するコードは、すでにページとコンテンツをビルドするために実行されています。しかし、これはまだ動的なページを保持できないことを意味します。 -一部の React コンポーネントは、デフォルトでサーバサイドレンダリング (SSR) がサポートされていないため、SSR を自分自身で追加する必要があるかもしれません。 +一部の React コンポーネントは、デフォルトでサーバサイドレンダリング（SSR）がサポートされていないため、SSR を自分自身で追加する必要があるかもしれません。 From 50f6519c868fa91cda5d512c07e2677c5e54e213 Mon Sep 17 00:00:00 2001 From: blkclct Date: Fri, 14 Feb 2020 00:17:23 +0900 Subject: [PATCH 09/12] Update: fix --- docs/docs/adding-react-components.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/docs/adding-react-components.md b/docs/docs/adding-react-components.md index 899d3c724..a95d83e71 100644 --- a/docs/docs/adding-react-components.md +++ b/docs/docs/adding-react-components.md @@ -59,7 +59,7 @@ export default () => ( ## 気をつけるべきこと -Gatsby は、サーバサイドレンダリング (SSR) を使用してサイトのページを生成しているため、たいていの場合、ブラウザがページをロードする前にあなたが書いた JSX のコードが、コンパイルされます。このため、ある機能は、コンパイルした時に利用できずビルドエラーとなることがあります。 +Gatsby は、サーバサイドレンダリング（SSR）を使用してサイトのページを生成しているため、たいていの場合、ブラウザがページをロードする前にあなたが書いた JSX のコードが、コンパイルされます。このため、ある機能は、コンパイルした時に利用できずビルドエラーとなることがあります。 ### ブラウザグローバルの使用について From 25304b73c0a79f3469144b13e0a94d53b0070caa Mon Sep 17 00:00:00 2001 From: Hiroki Fujimoto Date: Sun, 16 Feb 2020 00:19:51 +0900 Subject: [PATCH 10/12] Update docs/docs/adding-react-components.md Co-Authored-By: Yasuaki Uechi --- docs/docs/adding-react-components.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/docs/adding-react-components.md b/docs/docs/adding-react-components.md index a95d83e71..8d3907bc7 100644 --- a/docs/docs/adding-react-components.md +++ b/docs/docs/adding-react-components.md @@ -63,7 +63,7 @@ Gatsby は、サーバサイドレンダリング（SSR）を使用してサイ ### ブラウザグローバルの使用について -一部のコンポーネントやコードでは、`window`、`document`、`localStorage` のようなブラウザグローバルを参照することがあります。それらのオブジェクトでは、[ビルド](/docs/glossary#build) 時点では利用できず、コンパイル時に webpack エラーが発生することもあります。 +一部のコンポーネントやコードでは、`window`、`document`、`localStorage` のようなブラウザグローバルを参照することがあります。それらのオブジェクトでは、[ビルド](/docs/glossary#build)時点では利用できず、コンパイル時に webpack エラーが発生することもあります。 ```text WebpackError: ReferenceError: window is not defined From d89ef7438c6efef6700a02a622b795176a0bf138 Mon Sep 17 00:00:00 2001 From: Hiroki Fujimoto Date: Sun, 16 Feb 2020 00:20:00 +0900 Subject: [PATCH 11/12] Update docs/docs/adding-react-components.md Co-Authored-By: Yasuaki Uechi --- docs/docs/adding-react-components.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/docs/adding-react-components.md b/docs/docs/adding-react-components.md index 8d3907bc7..421b63ab3 100644 --- a/docs/docs/adding-react-components.md +++ b/docs/docs/adding-react-components.md @@ -75,7 +75,7 @@ SSR およびクライアントサイドライブラリをサポートする解 一部のパッケージは、`window` もしくは、別のブラウザグローバルが定義されることを期待します。それらのパッケージは、パッチを適用する必要があります。 -[HTML ビルドのデバッグ](/docs/debugging-html-builds/#fixing-third-party-modules) でそれらのパッケージにパッチを適用する方法を学べます。 +[HTML ビルドのデバッグ](/docs/debugging-html-builds/#fixing-third-party-modules)でそれらのパッケージにパッチを適用する方法を学べます。 ### サーバサイドレンダリングなしのコンポーネント From 2a4170ef67074917d8b5e54a19fa35788b5be642 Mon Sep 17 00:00:00 2001 From: blkclct Date: Sun, 16 Feb 2020 02:01:41 +0900 Subject: [PATCH 12/12] Update: added to lack tranlation --- docs/docs/adding-react-components.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/docs/adding-react-components.md b/docs/docs/adding-react-components.md index 756a63fd5..128accbe1 100644 --- a/docs/docs/adding-react-components.md +++ b/docs/docs/adding-react-components.md @@ -33,7 +33,7 @@ React と同様にして、Gatsby でもサードパーティコンポーネン ここでは、サイトにサードパーティコンポーネントを追加する一例を挙げています。 -はじめに、パッケージマネジャでコンポーネントやライブラリのパッケージをインストールしなければなりません。パッケージマネジャを組み合わせることはおすすめしません。なので、もしあなたが npm を使用するなら別のものは使用しないことをおすすめします。また逆もまた然りです。 +はじめに、パッケージマネジャでコンポーネントやライブラリのパッケージをインストールしなければなりません。パッケージマネジャを組み合わせることはおすすめしません。なので、もしあなたが npm を使用するなら別のものは使用しないことをおすすめします。また逆もまた然りです。もし関連する Gatsby プラグインがある場合は、そのプラグインをインストールして使用する必要があります。 この例では、プラグインとプラグインに依存するライブラリーの両方をインストールします。