Skip to content

Translate React top page #55

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 24 commits into from
Feb 15, 2019
Merged
Changes from all commits
Commits
Show all changes
24 commits
Select commit Hold shift + click to select a range
066455d
翻訳
udemy-react-super-yusuke Feb 3, 2019
0d6cbf2
原文の削除
udemy-react-super-yusuke Feb 3, 2019
ee13dc6
改行位置の復元
udemy-react-super-yusuke Feb 7, 2019
f85e2c8
Update content/home/examples/a-component-using-external-plugins.md
smikitky Feb 7, 2019
8aaf94d
Update content/home/examples/a-simple-component.md
smikitky Feb 7, 2019
57a873d
改行位置の修正
udemy-react-super-yusuke Feb 7, 2019
436af93
Merge remote-tracking branch 'origin/feature/home-translate' into fea…
udemy-react-super-yusuke Feb 7, 2019
512f32b
Update content/home/marketing/declarative.md
smikitky Feb 7, 2019
4715c93
Update content/home/marketing/learn-once-write-anywhere.md
smikitky Feb 7, 2019
f12171d
- トル > 場合を取
udemy-react-super-yusuke Feb 7, 2019
c39c6d3
and => と
udemy-react-super-yusuke Feb 7, 2019
72f2148
Update content/home/marketing/component-based.md
smikitky Feb 7, 2019
f686a72
Merge remote-tracking branch 'origin/feature/home-translate' into fea…
udemy-react-super-yusuke Feb 7, 2019
a7e8afc
日本語のみに修正
udemy-react-super-yusuke Feb 7, 2019
f175cf9
修正
udemy-react-super-yusuke Feb 7, 2019
b568ec4
レビュアーの要求で修正
udemy-react-super-yusuke Feb 13, 2019
6ee5aac
レビュアーの要求で修正
udemy-react-super-yusuke Feb 13, 2019
207a3ce
Merge branch 'master' into feature/home-translate
superyusuke Feb 13, 2019
837fff1
title: の追加
udemy-react-super-yusuke Feb 13, 2019
1b10e12
Merge remote-tracking branch 'origin/feature/home-translate' into fea…
udemy-react-super-yusuke Feb 13, 2019
3592167
修正
udemy-react-super-yusuke Feb 13, 2019
5377b37
訳語の統一
udemy-react-super-yusuke Feb 13, 2019
63a4379
Merge branch 'master' into feature/home-translate
superyusuke Feb 13, 2019
00a4540
Merge branch 'master' into feature/home-translate
koba04 Feb 15, 2019
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions content/home/examples/a-component-using-external-plugins.md
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
---
title: A Component Using External Plugins
title: 外部プラグインを使用するコンポーネント
order: 3
domid: markdown-example
---

React allows you to interface with other libraries and frameworks. This example uses **remarkable**, an external Markdown library, to convert the `<textarea>`'s value in real time.
React は柔軟性が高いので、React 以外のライブラリやフレームワークとやり取りをするためのフックを提供しています。次の例では Markdown の外部ライブラリである **remarkable** を使用しています。`<textarea>` に入力された値をリアルタイムに HTML へと変換しています。
6 changes: 3 additions & 3 deletions content/home/examples/a-simple-component.md
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
---
title: A Simple Component
title: シンプルなコンポーネント
order: 0
domid: hello-example
---

React components implement a `render()` method that takes input data and returns what to display. This example uses an XML-like syntax called JSX. Input data that is passed into the component can be accessed by `render()` via `this.props`.
React コンポーネントを作成するには `render()` メソッドを実装します。このメソッドは、受け取った入力データを元に、表示する内容を返す役割を担当します。次の例では JSX と呼ばれる XML に似た構文を使っています。コンポーネントに渡された入力データを `this.props` で参照し、`render()` の中で使用しています。

**JSX is optional and not required to use React.** Try the [Babel REPL](babel://es5-syntax-example) to see the raw JavaScript code produced by the JSX compilation step.
**React を使う際に JSX を必ず使わなくてはいけないわけではありません。** JSX のコンパイルによって生成される生の JavaScript コードを見るには、[Babel REPL](babel://es5-syntax-example) を参照してください。
4 changes: 2 additions & 2 deletions content/home/examples/a-stateful-component.md
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
---
title: A Stateful Component
title: 状態を持つコンポーネント
order: 1
domid: timer-example
---

In addition to taking input data (accessed via `this.props`), a component can maintain internal state data (accessed via `this.state`). When a component's state data changes, the rendered markup will be updated by re-invoking `render()`.
コンポーネントは、入力されたデータを受け取るだけではなく(受け取ったデータは `this.props` で参照することができます)コンポーネント独自の内部状態を持つこともできます。(これは `this.state` で参照することができます)状態が変化した場合には、`render()` が再度実行され、描画されるマークアップが更新されます。
4 changes: 2 additions & 2 deletions content/home/examples/an-application.md
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
---
title: An Application
title: アプリケーションの実例
order: 2
domid: todos-example
---

Using `props` and `state`, we can put together a small Todo application. This example uses `state` to track the current list of items as well as the text that the user has entered. Although event handlers appear to be rendered inline, they will be collected and implemented using event delegation.
`props` `state` を組み合わせることで、ちょっとした Todo アプリケーション を作ることができます。次の例では `state` を用いて、現在の Todo リストのアイテムの状態を追跡しています。それからユーザーが入力したテキストに関しても `state` で管理しています。イベントハンドラは、それが書かれた要素内部にレンダーされるように一見思われますが、実際にはこれらのハンドラは集められて、イベントデリゲーションを用いて実装されます。
6 changes: 3 additions & 3 deletions content/home/marketing/component-based.md
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
---
title: Component-Based
title: コンポーネントベース
order: 1
---

Build encapsulated components that manage their own state, then compose them to make complex UIs.
自分自身の状態を管理するカプセル化されたコンポーネントをまず作成し、これらを組み合わせることで複雑なユーザーインターフェイスを構築します。

Since component logic is written in JavaScript instead of templates, you can easily pass rich data through your app and keep state out of the DOM.
コンポーネントのロジックは、Template ではなく JavaScript そのもので書くことができるので、様々なデータをアプリケーション内で簡単に取り回すことができ、かつ DOM に状態を持たせないようにすることができます。
6 changes: 3 additions & 3 deletions content/home/marketing/declarative.md
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
---
title: Declarative
title: 宣言的な View
order: 0
---

React makes it painless to create interactive UIs. Design simple views for each state in your application, and React will efficiently update and render just the right components when your data changes.
React は、インタラクティブなユーザーインターフェイスの作成にともなう苦痛を取り除きます。アプリケーションの各状態に対応するシンプルな View を設計するだけで、React はデータの変更を検知し、関連するコンポーネントだけを効率的に更新、描画します。

Declarative views make your code more predictable and easier to debug.
宣言的な View を用いてアプリケーションを構築することで、コードはより見通しが立ちやすく、デバッグのしやすいものになります。
6 changes: 3 additions & 3 deletions content/home/marketing/learn-once-write-anywhere.md
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
---
title: Learn Once, Write Anywhere
title: 一度学習すれば、どこでも使える
order: 2
---

We don't make assumptions about the rest of your technology stack, so you can develop new features in React without rewriting existing code.
React と組み合わせて使用する技術に制限はありません。React を使って新しい機能を追加する際に、既存のソースコードを書き換える必要はありません。

React can also render on the server using Node and power mobile apps using [React Native](https://facebook.github.io/react-native/).
React Node を使ったサーバー上でもレンダーできますし、[React Native](https://facebook.github.io/react-native/) を使うことでモバイルアプリケーションの中でも動きます。