From c5d76eb5214abd8bb57fd8cf22c478c27d9e39fc Mon Sep 17 00:00:00 2001 From: Yasuaki Uechi Date: Tue, 14 Jan 2020 05:05:27 +0900 Subject: [PATCH 1/3] docs: translate docs/recipes --- docs/docs/recipes.md | 142 ++++++++++++++++++++++--------------------- 1 file changed, 72 insertions(+), 70 deletions(-) diff --git a/docs/docs/recipes.md b/docs/docs/recipes.md index f3bc3e515..ea9df5479 100644 --- a/docs/docs/recipes.md +++ b/docs/docs/recipes.md @@ -1,116 +1,118 @@ --- -title: Recipes +title: レシピ集 tableOfContentsDepth: 2 --- - -Craving a happy medium between [full-length tutorials](/tutorial/) and crawling the [docs](/docs/)? Here's a cookbook of guiding recipes on how to build things, Gatsby style. +[フルサイズのチュートリアル](/tutorial/)を踏破するのでもなく、大量の[ドキュメント](/docs/)の海に潜るのでもなく、その中間に位置する"ちょうど良い"リソースが必要ですか？ +ここには、Gatsby スタイルやその他つくりたいものに合わせた様々なレシピが揃っています。 -## [1. Pages and layouts](/docs/recipes/pages-layouts) +## [1. ページとレイアウト](/docs/recipes/pages-layouts) -Add pages to your Gatsby site, and use layouts to manage common page elements. +あなたの Gatsby サイトにページを追加し、レイアウト機能を使って共通するページ要素を管理しましょう。 -- [Project structure](/docs/recipes/pages-layouts#project-structure) -- [Creating pages automatically](/docs/recipes/pages-layouts#creating-pages-automatically) -- [Linking between pages](/docs/recipes/pages-layouts#linking-between-pages) -- [Creating a layout component](/docs/recipes/pages-layouts#creating-a-layout-component) -- [Creating pages programmatically with createPage](/docs/recipes/pages-layouts#creating-pages-programmatically-with-createpage) +- [プロジェクトの構造](/docs/recipes/pages-layouts#project-structure) +- [ページの自動生成](/docs/recipes/pages-layouts#creating-pages-automatically) +- [ページ間のリンク](/docs/recipes/pages-layouts#linking-between-pages) +- [レイアウトコンポーネントの作成](/docs/recipes/pages-layouts#creating-a-layout-component) +- [createPage を用いたページの自動生成](/docs/recipes/pages-layouts#creating-pages-programmatically-with-createpage) -## [2. Styling with CSS](/docs/recipes/styling-css) +## [2. CSS によるスタイリング](/docs/recipes/styling-css) -There are so many ways to add styles to your website; Gatsby supports almost every possible option, through official and community plugins. +あなたのウェブサイトにスタイルを追加する手段はたくさんあります。公式チームとコミュニティーが提供するプラグインのおかげで、ほとんどすべての方法が Gatsby で使えます。 - [Using global CSS files without a Layout component](/docs/recipes/styling-css#using-global-css-files-without-a-layout-component) - [Using global styles in a layout component](/docs/recipes/styling-css#using-global-styles-in-a-layout-component) -- [Using Styled Components](/docs/recipes/styling-css#using-styled-components) -- [Using CSS Modules](/docs/recipes/styling-css#using-css-modules) -- [Using Sass/SCSS](/docs/recipes/styling-css#using-sassscss) -- [Adding a Local Font](/docs/recipes/styling-css#adding-a-local-font) -- [Using Emotion](/docs/recipes/styling-css#using-emotion) -- [Using Google Fonts](/docs/recipes/styling-css#using-google-fonts) +- [Styled Components](/docs/recipes/styling-css#using-styled-components) +- [CSS Modules](/docs/recipes/styling-css#using-css-modules) +- [Sass/SCSS](/docs/recipes/styling-css#using-sassscss) +- [ローカルフォントの追加](/docs/recipes/styling-css#adding-a-local-font) +- [Emotion](/docs/recipes/styling-css#using-emotion) +- [Google Fonts](/docs/recipes/styling-css#using-google-fonts) -## [3. Working with starters](/docs/recipes/working-with-starters) +## [3. スターターを活用する](/docs/recipes/working-with-starters) -[Starters](/docs/starters/) are boilerplate Gatsby sites maintained officially, or by the community. +[スターター](/docs/starters/) は公式チームやコミュニティーによってメンテナンスされている、Gatsby サイトの雛形です。 -- [Using a starter](/docs/recipes/working-with-starters#using-a-starter) +- [スターターを使う](/docs/recipes/working-with-starters#using-a-starter) -## [4. Working with themes](/docs/recipes/working-with-themes) +## [4. テーマを使う](/docs/recipes/working-with-themes) A Gatsby theme lets you centralize the look-and-feel of your site. You can seamlessly update a theme, compose themes together, and even swap out one compatible theme for another. -- [Creating a new site using a theme starter](/docs/recipes/working-with-themes#creating-a-new-site-using-a-theme-starter) -- [Building a new theme](/docs/recipes/working-with-themes#building-a-new-theme) +- [テーマスターターを使って新しいサイトをつくる](/docs/recipes/working-with-themes#creating-a-new-site-using-a-theme-starter) +- [新しいテーマをつくる](/docs/recipes/working-with-themes#building-a-new-theme) -## [5. Sourcing data](/docs/recipes/sourcing-data) +## [5. データの取得](/docs/recipes/sourcing-data) -Pull data from multiple locations, like the filesystem or database, into your Gatsby site. +ファイルシステムやデータベースなど複数の場所からデータを取得し、Gatsby サイトに取り込みます。 -- [Adding data to GraphQL](/docs/recipes/sourcing-data#adding-data-to-graphql) +- [GraphQL にデータを追加する](/docs/recipes/sourcing-data#adding-data-to-graphql) - [Sourcing Markdown data for blog posts and pages with GraphQL](/docs/recipes/sourcing-data#sourcing-markdown-data-for-blog-posts-and-pages-with-graphql) -- [Sourcing from WordPress](/docs/recipes/sourcing-data#sourcing-from-wordpress) -- [Sourcing data from Contentful](/docs/recipes/sourcing-data#sourcing-data-from-contentful) -- [Pulling data from an external source and creating pages without GraphQL](/docs/recipes/sourcing-data#pulling-data-from-an-external-source-and-creating-pages-without-graphql) -- [Sourcing content from Drupal](/docs/recipes/sourcing-data#sourcing-content-from-drupal) +- [WordPress からデータを取得する](/docs/recipes/sourcing-data#sourcing-from-wordpress) +- [Contentful からデータを取得する](/docs/recipes/sourcing-data#sourcing-data-from-contentful) +- [GraphQL を使わずに外部からデータを取得しページを作成する](/docs/recipes/sourcing-data#pulling-data-from-an-external-source-and-creating-pages-without-graphql) +- [Drupal からデータを取得する](/docs/recipes/sourcing-data#sourcing-content-from-drupal) -## [6. Querying data](/docs/recipes/querying-data) +## [6. データを要求する](/docs/recipes/querying-data) -Gatsby lets you access your data across all sources using a single GraphQL interface. +Gatsby では、単一の GraphQL インターフェイスを通じて、あらゆるソースからデータにアクセスできます。 -- [Querying data with a Page Query](/docs/recipes/querying-data#querying-data-with-a-page-query) -- [Querying data with the StaticQuery Component](/docs/recipes/querying-data#querying-data-with-the-staticquery-component) -- [Querying data with the useStaticQuery hook](/docs/recipes/querying-data/#querying-data-with-the-usestaticquery-hook) -- [Limiting with GraphQL](/docs/recipes/querying-data#limiting-with-graphql) -- [Sorting with GraphQL](/docs/recipes/querying-data#sorting-with-graphql) -- [Filtering with GraphQL](/docs/recipes/querying-data#filtering-with-graphql) +- [Page Query を使ってデータを要求する](/docs/recipes/querying-data#querying-data-with-a-page-query) +- [StaticQuery Component を使ってデータを要求する](/docs/recipes/querying-data#querying-data-with-the-staticquery-component) +- [useStaticQuery hook を使ってデータを要求する](/docs/recipes/querying-data/#querying-data-with-the-usestaticquery-hook) +- [GraphQL で数に制限をかける](/docs/recipes/querying-data#limiting-with-graphql) +- [GraphQL でソートする](/docs/recipes/querying-data#sorting-with-graphql) +- [GraphQL でフィルターをかける](/docs/recipes/querying-data#filtering-with-graphql) - [GraphQL Query Aliases](/docs/recipes/querying-data#graphql-query-aliases) - [GraphQL Query Fragments](/docs/recipes/querying-data#graphql-query-fragments) -- [Querying data client-side with fetch](/docs/recipes/querying-data#querying-data-client-side-with-fetch) +- [fetch によるクライアントサイドクエリ](/docs/recipes/querying-data#querying-data-client-side-with-fetch) -## [7. Working with images](/docs/recipes/working-with-images) +## [7. 画像を取り扱う](/docs/recipes/working-with-images) Access images as static resources, or automate the process of optimizing them through powerful plugins. +イメージを静的なリソースとして使う。あるいはプラグインを通じて最適化プロセスを自動化する。 -- [Import an image into a component with webpack](/docs/recipes/working-with-images#import-an-image-into-a-component-with-webpack) -- [Reference an image from the static folder](/docs/recipes/working-with-images#reference-an-image-from-the-static-folder) -- [Optimizing and querying local images with gatsby-image](/docs/recipes/working-with-images#optimizing-and-querying-local-images-with-gatsby-image) -- [Optimizing and querying images in post frontmatter with gatsby-image](/docs/recipes/working-with-images#optimizing-and-querying-images-in-post-frontmatter-with-gatsby-image) +- [webpack を使って画像をコンポーネントに埋め込む](/docs/recipes/working-with-images#import-an-image-into-a-component-with-webpack) +- [静的フォルダにある画像を参照する](/docs/recipes/working-with-images#reference-an-image-from-the-static-folder) +- [gatsby-image を使って画像を最適化するクエリを書く](/docs/recipes/working-with-images#optimizing-and-querying-local-images-with-gatsby-image) +- [Front-matter で gatsby-image による最適化を指示する](/docs/recipes/working-with-images#optimizing-and-querying-images-in-post-frontmatter-with-gatsby-image) -## [8. Transforming data](/docs/recipes/transforming-data) +## [8. データの変換](/docs/recipes/transforming-data) -Transforming data in Gatsby is plugin-driven. Transformer plugins take data fetched using source plugins, and process it into something more usable (e.g. JSON into JavaScript objects, and more). +Gatsby でのデータ変換はプラグインによって実現されています。Transformer プラグインは source プラグインを通じてデータを取得し、実際に使う形式へ変換します（例：JSON を JavaScript オブジェクトにする等）。 -- [Transforming Markdown into HTML](/docs/recipes/transforming-data#transforming-markdown-into-html) +- [Markdown を HTML に変換する](/docs/recipes/transforming-data#transforming-markdown-into-html) -## [9. Deploying your site](/docs/recipes/deploying-your-site) +## [9. サイトのデプロイ](/docs/recipes/deploying-your-site) -Showtime. Once you are happy with your site, you are ready to go live with it! +お披露目の時間です。サイトの出来栄えに満足したら、全世界に公開しましょう！ -- [Preparing for deployment](/docs/recipes/deploying-your-site#preparing-for-deployment) -- [Deploying to Netlify](/docs/recipes/deploying-your-site#deploying-to-netlify) -- [Deploying to ZEIT Now](/docs/recipes/deploying-your-site#deploying-to-zeit-now) +- [デプロイの準備](/docs/recipes/deploying-your-site#preparing-for-deployment) +- [Netlify でデプロイ](/docs/recipes/deploying-your-site#deploying-to-netlify) +- [ZEIT Now でデプロイ](/docs/recipes/deploying-your-site#deploying-to-zeit-now) From 1af1d222329e19030d00503cd95d010780c0f24a Mon Sep 17 00:00:00 2001 From: Yasuaki Uechi Date: Wed, 15 Jan 2020 14:39:10 +0900 Subject: [PATCH 2/3] docs: fix docs/recipes --- docs/docs/recipes.md | 29 ++++++++++++++--------------- 1 file changed, 14 insertions(+), 15 deletions(-) diff --git a/docs/docs/recipes.md b/docs/docs/recipes.md index ea9df5479..e359f322d 100644 --- a/docs/docs/recipes.md +++ b/docs/docs/recipes.md @@ -29,7 +29,7 @@ tableOfContentsDepth: 2 より詳しくは[ドキュメントテンプレート](/docs/docs-templates/)を見てください。 --> -[フルサイズのチュートリアル](/tutorial/)を踏破するのでもなく、大量の[ドキュメント](/docs/)の海に潜るのでもなく、その中間に位置する"ちょうど良い"リソースが必要ですか？ +[フルサイズのチュートリアル](/tutorial/)を踏破するのでもなく、大量の[ドキュメント](/docs/)の海に潜るのでもなく、その中間に位置する"ちょうど良い"リソースが必要だと思ったことはありませんか？ ここには、Gatsby スタイルやその他つくりたいものに合わせた様々なレシピが揃っています。 ## [1. ページとレイアウト](/docs/recipes/pages-layouts) @@ -46,8 +46,8 @@ tableOfContentsDepth: 2 あなたのウェブサイトにスタイルを追加する手段はたくさんあります。公式チームとコミュニティーが提供するプラグインのおかげで、ほとんどすべての方法が Gatsby で使えます。 -- [Using global CSS files without a Layout component](/docs/recipes/styling-css#using-global-css-files-without-a-layout-component) -- [Using global styles in a layout component](/docs/recipes/styling-css#using-global-styles-in-a-layout-component) +- [レイアウトコンポーネントを使わないグローバル CSS の使用](/docs/recipes/styling-css#using-global-css-files-without-a-layout-component) +- [レイアウトコンポーネント内のグローバルなスタイル](/docs/recipes/styling-css#using-global-styles-in-a-layout-component) - [Styled Components](/docs/recipes/styling-css#using-styled-components) - [CSS Modules](/docs/recipes/styling-css#using-css-modules) - [Sass/SCSS](/docs/recipes/styling-css#using-sassscss) @@ -57,20 +57,20 @@ tableOfContentsDepth: 2 ## [3. スターターを活用する](/docs/recipes/working-with-starters) -[スターター](/docs/starters/) は公式チームやコミュニティーによってメンテナンスされている、Gatsby サイトの雛形です。 +[スターター](/docs/starters/) は、公式チームやコミュニティーによってメンテナンスされている Gatsby サイトの雛形です。 - [スターターを使う](/docs/recipes/working-with-starters#using-a-starter) ## [4. テーマを使う](/docs/recipes/working-with-themes) -A Gatsby theme lets you centralize the look-and-feel of your site. You can seamlessly update a theme, compose themes together, and even swap out one compatible theme for another. +Gatsby テーマを使用するとサイトの見た目を統一できます。 テーマをシームレスに更新したり、まとめて作成したり、あるいは互換性のあるテーマを別のものに交換したりすることもできます。 - [テーマスターターを使って新しいサイトをつくる](/docs/recipes/working-with-themes#creating-a-new-site-using-a-theme-starter) - [新しいテーマをつくる](/docs/recipes/working-with-themes#building-a-new-theme) ## [5. データの取得](/docs/recipes/sourcing-data) -ファイルシステムやデータベースなど複数の場所からデータを取得し、Gatsby サイトに取り込みます。 +ファイルシステムやデータベースなど、複数の場所からデータを取得し Gatsby サイトに取り込みます。 - [GraphQL にデータを追加する](/docs/recipes/sourcing-data#adding-data-to-graphql) - [Sourcing Markdown data for blog posts and pages with GraphQL](/docs/recipes/sourcing-data#sourcing-markdown-data-for-blog-posts-and-pages-with-graphql) @@ -81,11 +81,11 @@ A Gatsby theme lets you centralize the look-and-feel of your site. You can seaml ## [6. データを要求する](/docs/recipes/querying-data) -Gatsby では、単一の GraphQL インターフェイスを通じて、あらゆるソースからデータにアクセスできます。 +Gatsby では、単一の GraphQL インターフェイスを通じてあらゆるソースからデータにアクセスできます。 -- [Page Query を使ってデータを要求する](/docs/recipes/querying-data#querying-data-with-a-page-query) -- [StaticQuery Component を使ってデータを要求する](/docs/recipes/querying-data#querying-data-with-the-staticquery-component) -- [useStaticQuery hook を使ってデータを要求する](/docs/recipes/querying-data/#querying-data-with-the-usestaticquery-hook) +- [Page Query を用いたデータ要求](/docs/recipes/querying-data#querying-data-with-a-page-query) +- [StaticQuery Component を用いたデータ要求](/docs/recipes/querying-data#querying-data-with-the-staticquery-component) +- [useStaticQuery hook を用いたデータ要求](/docs/recipes/querying-data/#querying-data-with-the-usestaticquery-hook) - [GraphQL で数に制限をかける](/docs/recipes/querying-data#limiting-with-graphql) - [GraphQL でソートする](/docs/recipes/querying-data#sorting-with-graphql) - [GraphQL でフィルターをかける](/docs/recipes/querying-data#filtering-with-graphql) @@ -95,11 +95,10 @@ Gatsby では、単一の GraphQL インターフェイスを通じて、あら ## [7. 画像を取り扱う](/docs/recipes/working-with-images) -Access images as static resources, or automate the process of optimizing them through powerful plugins. -イメージを静的なリソースとして使う。あるいはプラグインを通じて最適化プロセスを自動化する。 +イメージを静的なリソースとして使ったり、あるいはプラグインを通じて最適化プロセスを自動化しましょう。 - [webpack を使って画像をコンポーネントに埋め込む](/docs/recipes/working-with-images#import-an-image-into-a-component-with-webpack) -- [静的フォルダにある画像を参照する](/docs/recipes/working-with-images#reference-an-image-from-the-static-folder) +- [静的フォルダにある画像への参照](/docs/recipes/working-with-images#reference-an-image-from-the-static-folder) - [gatsby-image を使って画像を最適化するクエリを書く](/docs/recipes/working-with-images#optimizing-and-querying-local-images-with-gatsby-image) - [Front-matter で gatsby-image による最適化を指示する](/docs/recipes/working-with-images#optimizing-and-querying-images-in-post-frontmatter-with-gatsby-image) @@ -114,5 +113,5 @@ Gatsby でのデータ変換はプラグインによって実現されていま お披露目の時間です。サイトの出来栄えに満足したら、全世界に公開しましょう！ - [デプロイの準備](/docs/recipes/deploying-your-site#preparing-for-deployment) -- [Netlify でデプロイ](/docs/recipes/deploying-your-site#deploying-to-netlify) -- [ZEIT Now でデプロイ](/docs/recipes/deploying-your-site#deploying-to-zeit-now) +- [Netlify によるデプロイ](/docs/recipes/deploying-your-site#deploying-to-netlify) +- [ZEIT Now によるデプロイ](/docs/recipes/deploying-your-site#deploying-to-zeit-now) From 71409837b0455a0ab69ce9468b98cf94827cdaf6 Mon Sep 17 00:00:00 2001 From: Yasuaki Uechi Date: Wed, 15 Jan 2020 18:08:42 +0900 Subject: [PATCH 3/3] =?UTF-8?q?docs:=20=E8=A1=A8=E7=8F=BE=E3=82=92?= =?UTF-8?q?=E4=BF=AE=E6=AD=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/docs/recipes.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/docs/recipes.md b/docs/docs/recipes.md index e359f322d..8b69723c5 100644 --- a/docs/docs/recipes.md +++ b/docs/docs/recipes.md @@ -29,7 +29,7 @@ tableOfContentsDepth: 2 より詳しくは[ドキュメントテンプレート](/docs/docs-templates/)を見てください。 --> -[フルサイズのチュートリアル](/tutorial/)を踏破するのでもなく、大量の[ドキュメント](/docs/)の海に潜るのでもなく、その中間に位置する"ちょうど良い"リソースが必要だと思ったことはありませんか？ +[フルサイズのチュートリアル](/tutorial/)を読破するのでもなく、大量の[ドキュメント](/docs/)に埋もれるわけでもない、その中間に位置する"ちょうど良い"リソースが必要だと思ったことはありませんか？ ここには、Gatsby スタイルやその他つくりたいものに合わせた様々なレシピが揃っています。 ## [1. ページとレイアウト](/docs/recipes/pages-layouts)