docs: translate docs/recipes

Author: uetchy

docs/docs/recipes.md

@@ -1,116 +1,118 @@
 ---
-title: Recipes
+title: レシピ集
 tableOfContentsDepth: 2
 ---
 
-<!-- Basic template for a Gatsby recipe:
+<!-- Gatsbyレシピのための基本テンプレート:
 
-## Task to accomplish.
-1-2 sentences about it. The more concise and focused, the better!
+## 達成したいタスク
+1-2行の説明。簡潔でまとまっているほど良いです。
 
-### Prerequisites
-- System/version requirements
-- Everything necessary to set up the task
-- Including setting up accounts at other sites, like Netlify
-- See [docs templates](/docs/docs-templates/) for formatting tips
+### 必要条件
+- システム要件
+- セットアップに必要なあらゆるもの
+- Netlifyアカウントなど、セットアップに必要な外部アカウントの作成も含む
+- フォーマットについて詳しくは[ドキュメントテンプレート](/docs/docs-templates/)を参照
 
-### Directions
-Step-by-step directions. Each step should be repeatable and to-the-point. Anything not critical to the task should be omitted.
+### やり方
+ステップ・バイ・ステップのガイド。各ステップは明解かつ再現性が担保されているべきです。直接タスクに関係のないものは何であれ取り除きましょう。
 
-#### Live example (optional)
-A live example may not be possible depending on the nature of the recipe, in which case it is fine to omit.
+#### 動くデモ (任意)
+実際に動作するデモはレシピの構成によっては不可能な場合があります。その際はデモを用意しなくても大丈夫です。
 
-### Additional resources
-- Tutorials
-- Docs pages
-- Plugin READMEs
-- etc.
+### 追加のリソース
+- チュートリアル
+- ドキュメント
+- プラグインのREADME
+- その他
 
-See [docs templates](/docs/docs-templates/) in the contributing docs for more help.
+より詳しくは[ドキュメントテンプレート](/docs/docs-templates/)を見てください。
 -->
 
-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)