Skip to content

Commit

Permalink
Translated Interactivity API's Core Concepts. Fixed minor typos
Browse files Browse the repository at this point in the history
  • Loading branch information
atachibana committed Oct 6, 2024
1 parent 8b5eaa2 commit 41458f1
Show file tree
Hide file tree
Showing 3 changed files with 24 additions and 4 deletions.
4 changes: 2 additions & 2 deletions docs/getting-started/quick-start-guide.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
<!--
This guide is designed to demonstrate the basic principles of block development in WordPress using a hands-on approach. Following the steps below, you will create a custom block plugin that uses modern JavaScript (ESNext and JSX) in a matter of minutes. The example block displays the copyright symbol (©) and the current year, the perfect addition to any website's footer. You can see these steps in action through this short video demonstration.
-->
このガイドは WordPress でのブロック開発の基本原則をハンズオン形式で説明します。以下の手順に従うだけで、モダンな JavaScript (ESNext と JSX) を使用したカスタムブロックプラグインを数分で作成できます。ブロックのサンプル例では、著作権シンボル (©) と現在の年を表示します。どのウェブサイトのフッターにも最適でしょう。以下の短いデモ動画で、一連の手順の様子を見ることができます
このガイドは WordPress でのブロック開発の基本原則をハンズオン形式で説明します。以下の手順に従うだけで、モダンな JavaScript (ESNext と JSX) を使用したカスタムブロックプラグインを数分で作成できます。このサンプルプログラムはどんなウェブサイトのフッターにも最適な、著作権シンボル (©) と現在の年を表示します。以下の短いデモ動画で一連の手順を確認できます

<iframe width="960" height="540" src="https://www.youtube.com/embed/nrut8SfXA44?si=YxvmHmAoYx-BDCog" title="WordPress Block Development: Quick Start Guide Video" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen="true"></iframe>

Expand All @@ -31,7 +31,7 @@ Next, use the [`@wordpress/create-block`](https://developer.wordpress.org/block-
<p>If you already have your own <a href="https://developer.wordpress.org/block-editor/getting-started/devenv/#local-wordpress-environment">local WordPress development environment</a>, navigate to the <code>plugins/</code> folder using the terminal.</p>
</div>
-->
> 任意の場所で `create-block` を使用してブロックを作成できます。次に、生成されたプラグインフォルダの中から [`wp-env` ](https://ja.wordpress.org/team/handbook/block-editor/getting-started/devenv/get-started-with-wp-env/)を使用します。WordPress のローカル開発環境が作成され、新しいブロックプラグインがインストール、有効化されます。
> 任意のディレクトリで `create-block` を使用してブロックを作成できます。次に、生成されたプラグインフォルダの中から [`wp-env`](https://ja.wordpress.org/team/handbook/block-editor/getting-started/devenv/get-started-with-wp-env/)を使用します。WordPress のローカル開発環境が作成され、新しいブロックプラグインがインストール、有効化されます。
> [ローカル WordPress 開発環境](https://ja.wordpress.org/team/handbook/block-editor/getting-started/devenv/#%E3%83%AD%E3%83%BC%E3%82%AB%E3%83%AB%E3%81%AE-wordpress-%E7%92%B0%E5%A2%83)がすでにセットアップされている場合は、ターミナルを使用して `plugins/` フォルダに移動してください。
<!--
Expand Down
20 changes: 20 additions & 0 deletions docs/reference-guides/interactivity-api/core-concepts/README.md
Original file line number Diff line number Diff line change
@@ -1,11 +1,31 @@
<!--
# Core Concepts
-->
# コアコンセプト

<!--
This section provides some guides on important concepts and mental models related to Interactivity API development. Use the following links to learn more:
-->
このセクションでは、Interactivity API 開発に関連する重要なコンセプトとメンタルモデルについて、いくつかのガイドを提供します。詳しくは以下のリンクを参照してください。

<!--
1. **[The Reactive and Declarative mindset](/docs/reference-guides/interactivity-api/core-concepts/the-reactive-and-declarative-mindset.md):** This guide covers core concepts of reactivity and declarativeness, providing a foundation for effective use of the Interactivity API.
-->
1.**[リアクティブと宣言型の考え方](https://ja.wordpress.org/team/handbook/block-editor/reference-guides/interactivity-api/core-concepts/the-reactive-and-declarative-mindset.md):** このガイドでは、リアクティビティと宣言型の核となる概念について説明し、Interactivity API を効果的に使用するための基礎を提供します。

<!--
2. **[Understanding global state, local context and derived state](/docs/reference-guides/interactivity-api/core-concepts/undestanding-global-state-local-context-and-derived-state.md):** The guide explains how to effectively use global state, local context, and derived state within the Interactivity API emphasizing the importance of choosing the appropriate state management technique based on the scope and requirements of your data.
-->
2.**[グローバルステート、ローカルコンテキスト、派生ステートの理解](https://ja.wordpress.org/team/handbook/block-editor/reference-guides/interactivity-api/core-concepts/undestanding-global-state-local-context-and-derived-state.md):** Interactivity API 内でグローバルステート、ローカルコンテキスト、派生ステートを効果的に使用する方法を説明し、データのスコープと要件に基づいて適切なステート管理手法を選択することの重要性を強調します。

<!--
3. **[Server-side rendering: Processing directives on the server](/docs/reference-guides/interactivity-api/core-concepts/server-side-rendering.md):** The Interactivity API allows WordPress to use server-side rendering to create interactive and state-aware HTML, smoothly connected with client-side features while maintaining performance and SEO benefits.
-->
3.**[サーバーサイドレンダリング: サーバーでのディレクティブの処理](https://ja.wordpress.org/team/handbook/block-editor/reference-guides/interactivity-api/core-concepts/server-side-rendering.md):** Interactivity API を使用すると WordPress はサーバーサイドレンダリングを使用してインタラクティブでステートを認識する HTML を作成し、パフォーマンスと SEO の利点を維持しながら、クライアントサイドの機能とスムーズに接続できます。

<!--
4. **[Using TypeScript](/docs/reference-guides/interactivity-api/core-concepts/using-typescript.md):** This guide will walk you through the process of using TypeScript with Interactivity API stores, covering everything from basic type definitions to advanced techniques for handling complex store structures.
-->
4.**[TypeScript の使用](https://ja.wordpress.org/team/handbook/block-editor/reference-guides/interactivity-api/core-concepts/using-typescript.md):** このガイドでは Interactivity API ストアで TypeScript を使用する手順を説明します。基本的な型定義から複雑なストア構造を扱う高度なテクニックまでカバーします。

[原文](https://github.com/WordPress/gutenberg/blob/trunk/docs/reference-guides/interactivity-api/core-concepts/README.md)
4 changes: 2 additions & 2 deletions docs/reference-guides/slotfills/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,7 @@ registerPlugin( 'post-status-info-test', { render: PluginPostStatusInfoTest } );
<!--
With the exception of [MainDashboardButton](/docs/reference-guides/slotfills/main-dashboard-button.md), every available SlotFill is exposed in both the Post Editor and Site Editor and any Fill that is registered will be rendered in both contexts. There are a number of approaches that can be implemented to conditionally render Fills.
-->
すべての利用可能な SlotFill は、[MainDashboardButton](https://developer.wordpress.org/block-editor/reference-guides/slotfills/main-dashboard-button/) を除き、投稿エディターとサイトエディターの両方に公開され、登録された Fill は両方のコンテキストでレンダーされます。条件付きで Fill をレンダーする、複数の実装アプローチがあります
すべての利用可能な SlotFill は、[MainDashboardButton](https://developer.wordpress.org/block-editor/reference-guides/slotfills/main-dashboard-button/) を除き、投稿エディターとサイトエディターの両方に公開され、登録された Fill は両方のコンテキストでレンダーされます。条件付きで Fill をレンダーする複数の実装アプローチがあります

<!--
### Restricting fills to the Post Editor
Expand Down Expand Up @@ -250,7 +250,7 @@ registerPlugin( 'example-site-editor', {
<!--
This example builds on the example above by providing an allow list to control which screens a fill can be rendered within the Site Editor.
-->
次の例は上の例の上に構築され、サイトエディター内で Fill をレンダーできる画面を制御する許可リストを提供しています
次の例は上の例をベースに、サイトエディター内で Fill をレンダーする画面を制御する、許可リストが提供されています
```js
/**
Expand Down

0 comments on commit 41458f1

Please sign in to comment.