Skip to content
This repository was archived by the owner on Jan 20, 2025. It is now read-only.

Conversation

@2ur1
Copy link
Contributor

@2ur1 2ur1 commented Jan 17, 2020

docs/static-query の翻訳です。
レビューよろしくお願いします 🙇

原文ページ
Querying Data in Components using StaticQuery

Copy link
Contributor

@uetchy uetchy left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ありがとうございます👍

@@ -1,21 +1,21 @@
---
title: Querying Data in Components using StaticQuery
title: StaticQueryを使用したコンポーネントのデータクエリー
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

コンポーネントの中でデータを取得する話なので、データを取得のような訳のほうが適切かもしれません。

---

Gatsby v2 introduces `StaticQuery`, a new API that allows components to retrieve data via a GraphQL query.
Gatsby v2 では、`StaticQuery` という GraphQL クエリーを介してコンポーネントがデータを取得できる新しい API が導入されました。
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
Gatsby v2 では、`StaticQuery` という GraphQL クエリーを介してコンポーネントがデータを取得できる新しい API が導入されました。
Gatsby v2 では、`StaticQuery` という GraphQL クエリーを介して、コンポーネントがデータを取得できる新しい API が導入されました。

<EggheadEmbed
lessonLink="https://egghead.io/lessons/gatsby-load-data-using-graphql-queries-directly-in-a-gatsby-v2-component-with-staticquery"
lessonTitle="Load Data using GraphQL Queries Directly in a Gatsby v2 Component with StaticQuery"
lessonTitle="StaticQuery を備えた Gatsby v2 コンポーネントで GraphQL クエリを用いたダイレクトなデータのロード"
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

外部リンクに翻訳版が無い場合は「(英語版)」と注記をつけるに留めて原文を残しておきましょう。

### useStaticQuery

There's also a React hooks version of StaticQuery: check out the documentation on [`useStaticQuery`](/docs/use-static-query/)
StaticQuery には React フック(hook)バージョンもあります。詳しくは、[`useStaticQuery`](/docs/use-static-query/) をご覧ください。
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
StaticQuery には React フック(hook)バージョンもあります。詳しくは、[`useStaticQuery`](/docs/use-static-query/) をご覧ください。
StaticQuery には React Hooks のバージョンもあります。詳しくは、[`useStaticQuery`](/docs/use-static-query/) をご覧ください。

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

レビューありがとうございます。
React Hooksの表記については、「Hooks」、「フック」、「フック(hook)」など様々な表記がインターネット上にあったのですが、公式のReact Hooksの説明から引用した形でした。(とはいえ、タイトルはカタカナ、説明の最初にカッコ書きされているので今思えば微妙でしたが・・・)
フックの導入 – React

やはり、かっこよさやよみやすさの観点からも「React Hooks」かなと思うので、そちらで行きます。
ありがとうございます

### 型チェック

With the above pattern, you lose the ability to typecheck with PropTypes. To regain typechecking while achieving the same result, you can change the component to:
上記のパターンを使用すると、PropTypes で型チェックする機能が失われます。同じ結果を得ながら、型チェックを行うには、コンポーネントを次のように変更します。
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
上記のパターンを使用すると、PropTypes で型チェックする機能が失われます。同じ結果を得ながら、型チェックを行うには、コンポーネントを次のように変更します。
上記のパターンを使用すると、PropTypes で型チェックする機能が失われます。同じ結果を得ながら型チェックを行うには、コンポーネントを次のように変更します。

## StaticQuery とページクエリーの違い

StaticQuery can do most of the things that page query can, including fragments. The main differences are:
StaticQuery は、フラグメントを含む、ページクエリーが行えることのほとんどを行えます。主な違いは次のとおりです。
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
StaticQuery はフラグメントを含むページクエリーが行えることのほとんどを行えます。主な違いは次のとおりです。
StaticQuery はフラグメントを含むページクエリーが行えることのほとんどを行えます。主な違いは次のとおりです。

- page queries can accept variables (via `pageContext`) but can only be added to _page_ components
- StaticQuery does not accept variables (hence the name "static"), but can be used in _any_ component, including pages
- StaticQuery does not work with raw React.createElement calls; please use JSX, e.g. `<StaticQuery />`
- ページクエリーは(`pageContext` を介して)変数を受け入れることができますが、追加できるのは*ページ*コンポーネントだけです。
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

斜体は日本語だと分かりづらいので**を使って太字にしましょう。

@uetchy uetchy added status: awaiting author response A pull request that is awaiting author's response status: awaiting review A pull request that is currently awaiting a reviewer's response labels Jan 17, 2020
@2ur1
Copy link
Contributor Author

2ur1 commented Jan 17, 2020

@uetchy
レビューありがとうございます。ご指摘いただいた部分を修正いたしました。
よろしくお願いいたします

uetchy
uetchy previously approved these changes Jan 17, 2020
Copy link
Contributor

@uetchy uetchy left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

貢献ありがとうございます🚀

@uetchy uetchy added status: awaiting more approval A pull request that is awaiting reviewer #2 to be assigned and removed status: awaiting author response A pull request that is awaiting author's response status: awaiting review A pull request that is currently awaiting a reviewer's response labels Jan 17, 2020
Copy link
Contributor

@hirotaka hirotaka left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ありがとうございます!訳文は読みやすく問題ないです。
一つだけコメントさせていただいたのでご対応よろしくお願いいたします。

Copy link
Contributor

@hirotaka hirotaka left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM 👍

@hirotaka hirotaka requested a review from uetchy January 20, 2020 02:48
@uetchy uetchy merged commit daa8f15 into gatsbyjs:master Jan 20, 2020
@uetchy uetchy removed the status: awaiting more approval A pull request that is awaiting reviewer #2 to be assigned label Jan 26, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants