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

Commit 6bc5b43

Browse files
authored
Merge pull request #86 from 2ur1/docs/themes/conventions
translation docs/themes/conventions into Japanese
2 parents 6b9e729 + d444c1b commit 6bc5b43

File tree

1 file changed

+45
-58
lines changed

1 file changed

+45
-58
lines changed

docs/docs/themes/conventions.md

Lines changed: 45 additions & 58 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,16 @@
11
---
2-
title: Themes Conventions
2+
title: テーマの規則
33
---
44

5-
As methodologies for building Gatsby Themes begin to formalize and standardize, documentation will be added here. These aren't intended to be the only way to solve things, but are recommended approaches. If you have other ideas and best practices please open up a PR to update this page.
5+
Gatsby テーマを作成する方法が定式化および標準化されるようになるとドキュメントがここに追記されます。これらは、守らなければならないただ 1 つの方法という意図ではなく、推奨のアプローチ方法であるということです。他のアイデアやベストプラクティスがある場合は、Pull Request を開いてこのページを更新してください。
66

7-
## Naming
7+
## 命名
88

9-
It's required to prefix themes with `gatsby-theme-`. So if you'd like to name your theme "awesome" you
10-
can name it `gatsby-theme-awesome` and place that as the `name` key in your `package.json`. Prefixing themes with `gatsby-theme` enables Gatsby in identifying theme packages for compilation.
9+
テーマのプレフィックスとして `gatsby-theme-` をつける必要があります。したがって、テーマに「awesome」という名前を付けたい場合、`gatsby-theme-awesome` と命名し、`package.json``name` キーに配置します。`gatsby-theme` で始まるテーマ名を付けることで、Gatsby がコンパイルするテーマパッケージを識別できます。
1110

12-
## Initializing required directories
11+
## 必要なディレクトリーの初期化
1312

14-
If your theme relies on the presence of particular directories, like `posts` for `gatsby-source-filesystem`, you can use the `onPreBootstrap` hook to initialize them to avoid a crash when Gatsby tries to build the site.
13+
新しく作るテーマが `posts` `gatsby-source-filesystem` などの特定のディレクトリーに依存している場合、初期化するときに `onPreBootstrap` フックを使うことで、Gatsby がサイトのビルド時にクラッシュするのを防ぐことができます。
1514

1615
```js:title=gatsby-node.js
1716
exports.onPreBootstrap = ({ store, reporter }) => {
@@ -32,13 +31,13 @@ exports.onPreBootstrap = ({ store, reporter }) => {
3231
}
3332
```
3433

35-
## Separating queries and presentational components
34+
## クエリーとプレゼンテーショナルコンポーネントの分離
3635

37-
As a theme author, it's preferable to separate your data gathering and the components that render the data. This makes it easier for end users to be able to override a component like `PostList` or `AuthorCard` without having to write a [pageQuery](/docs/page-query) or [StaticQuery](/docs/static-query).
36+
テーマの作成者として、データの収集とデータをレンダリングするコンポーネントは分離することが望ましいです。これにより、エンドユーザーは [PageQuery](/docs/page-query) [StaticQuery](/docs/static-query) を記述することなく、`PostList``AuthorCard` といったコンポーネントを簡単にオーバーライドできます。
3837

39-
### Page queries
38+
### PageQuery
4039

41-
You can use a template for top-level data collection with a page query that passes the data to a `PostList` component:
40+
`PostList` コンポーネントにデータを渡す PageQuery で、トップレベルのデータ収集用テンプレートを使用できます。
4241

4342
```jsx:title=src/templates/post-list.js
4443
import React from "react"
@@ -75,9 +74,9 @@ export const query = graphql`
7574
`
7675
```
7776

78-
### Static queries
77+
### StaticQuery
7978

80-
You can use static queries at the top level template as well and pass the data to other presentational components as props:
79+
最上位のテンプレートでも StaticQuery を使用し、`props` として別のプレゼンテーショナルコンポーネントにデータを渡すことができます。
8180

8281
```jsx:title=src/components/layout.js
8382
import React from "react"
@@ -119,11 +118,9 @@ const Layout = ({ children }) => {
119118
export default Layout
120119
```
121120

122-
## Site metadata
121+
## サイトのメタデータ
123122

124-
For commonly customized things, such as site title and social media handles, you
125-
can have the user set site metadata in their `gatsby-config.js`. Then, throughout
126-
your theme you can create a StaticQuery to access it:
123+
サイトのタイトルやソーシャルメディアのハンドル名などユーザーにカスタマイズさせたいものについては、`gatsby-config.js` 内のサイトメタデータを編集させることで実現できます。そして、次のようにしてテーマ全体でメタデータにアクセスするための StaticQuery を作成できます。
127124

128125
```js:title=src/hooks/use-site-metadata.js
129126
import { graphql, useStaticQuery } from "gatsby"
@@ -148,7 +145,7 @@ export default () => {
148145
}
149146
```
150147

151-
Then use it in components like the a header:
148+
次に、ヘッダーなどのコンポーネントで利用する例です。
152149

153150
```jsx:title=src/components/header.js
154151
import React from "react"
@@ -172,58 +169,48 @@ export default () => {
172169
}
173170
```
174171

175-
## Breaking changes
172+
## 重要な変更
176173

177-
Since themes will typically be installed by an end user from npm, it's
178-
important to follow [semantic versioning](https://semver.org/), commonly
179-
referred to as semver.
174+
テーマは通常、npm からエンドユーザーによってインストールされるため、一般に semver とよばれる[セマンティックバージョニング](https://semver.org/lang/ja/)に従うことが重要です。
180175

181-
This will allow your users to quickly discern how a dependency update might
182-
affect them. Patches and minor versions are not considered breaking changes,
183-
major versions are.
176+
これにより、ユーザーは依存関係の更新がユーザーにどのような影響を与える可能性があるかをすばやく識別できます。パッチおよびマイナーバージョンは重大な変更とはみなされませんが、メジャーバージョンは重大な変更とみなされます。
184177

185-
### Patch _(0.0.X)_
178+
### パッチ _(0.0.X)_
186179

187-
Patches are defined as bug fixes that are done in a backwards-compatible way. This
188-
means that public facing APIs are unaffected.
180+
パッチは、下位互換性のある方法で行われるバグ修正として定義されます。これは、公開 API が影響を受けないということを意味します。
189181

190-
#### Examples of patch versions
182+
#### パッチバージョンの例
191183

192-
- **Fixing a bug** in a component, such as fixing a warning or adding a fallback value.
193-
- **Upgrading dependencies** to their latest minor and patch versions.
184+
- ワーニングの修正やフォールバック値の追加といった、コンポーネント内での**バグ修正**
185+
- 最新のマイナーバージョン、パッチバージョンへの**依存関係のアップグレード**
194186

195-
### Minor _(0.X.0)_
187+
### マイナー _(0.X.0)_
196188

197-
Minor versions are defined as new features or functionality that are added in a
198-
backwards-compatible way. This means that _existing_ public facing APIs are unaffected.
189+
マイナーバージョンは、下位互換性のある方法で追加される新しい機能として定義されます。これは、**既存の**公開 API が影響を受けないことを意味します。
199190

200-
#### Examples of minor versions
191+
#### マイナーバージョンの例
201192

202-
- **Adding new pages or queries** to your theme. For example, adding tag pages to a blog.
203-
- **Adding new configuration options** to further customize a theme.
204-
- **Displaying additional data** such as displaying excerpts to a post list.
205-
- **Adding additional props to a component** for new functionality.
206-
- **Adding a new MDX shortcode** that users can opt into.
193+
- テーマへの**新しいページまたはクエリーの追加**。例:ブログにタグページを追加
194+
- テーマをさらにカスタマイズするための**新しい構成オプションの追加**
195+
- **追加データの表示**。例:投稿リストへの抜粋表示
196+
- 新しい機能のための **props やコンポーネントの追加**
197+
- ユーザーがオプトインできる**新しい MDX ショートコードの追加**
207198

208-
### Major _(X.0.0)_
199+
### メジャー _(X.0.0)_
209200

210-
Major versions are any bugfixes or new features that have been added without full
211-
backwards-compatibility. These are often called "breaking changes".
201+
メジャーバージョンは、完全に下位互換性なしに追加されたバグ修正または新機能です。これらはしばしば「重大な変更」(Breaking Change) とよばれます。
212202

213-
These changes should be accompanied with a migration guide that users can follow along
214-
for performing a theme upgrade.
203+
これらの変更には、ユーザーがテーマのアップグレードを実行するために、参照することのできる移行ガイドが必要です。
215204

216-
#### Examples of major versions
205+
#### メジャーバージョンの例
217206

218-
- **Changing a filename in `src`** will always be a breaking change due to shadowing.
219-
- Moving where a query occurs
220-
- Renaming a component
221-
- Renaming a directory
222-
- **Removing or changing the props a component accepts** since it will affect component extending.
223-
- **Changing queries** since a user could be using the original data in shadowed components.
224-
- **Removing or changing the behaviour** of your theme's configuration.
225-
- **Removing attributes in schema definitions** because it can break end user queries.
226-
- **Removing default data** this could change your generated schema and break a user's site if they
227-
depend on some part of that generated schema.
228-
- **Changing plugins or plugin configuration** such as removing a remark plugin as it will change
229-
the behavior of MD/MDX rendering.
207+
- シャドウイングにより常に重大な変更になる **`src` 内のファイル名変更**
208+
- クエリーが発生する場所の移動
209+
- コンポーネントの名前変更
210+
- ディレクトリーの名前変更
211+
- コンポーネントの拡張に影響する**コンポーネントが受け入れる props の削除や変更**
212+
- ユーザーがシャドウコンポーネントの元のデータを使用している可能性がある**クエリーの変更**
213+
- テーマ構成の**動作の削除または変更**
214+
- エンドユーザークエリーを壊す可能性がある**スキーマ定義の属性の削除**
215+
- **デフォルトデータの削除**。ユーザーのサイトが生成されたスキーマの一部に依存している場合、生成されるスキーマが変更され、ユーザーのサイトが壊れるかもしれません。
216+
- **プラグインまたはプラグイン構成の変更**。例:注釈プラグインの変更は MD/MDX レンダリングの動作が変更されます。

0 commit comments

Comments
 (0)