diff --git a/content/tutorial/tutorial.md b/content/tutorial/tutorial.md index 66aaa9f77..d38026c7c 100644 --- a/content/tutorial/tutorial.md +++ b/content/tutorial/tutorial.md @@ -149,7 +149,7 @@ class ShoppingList extends React.Component { // Example usage: ``` -この妙な XML のようなタグについてはすぐ後で説明します。コンポーネントは、React に何を描画したいかを伝えます。データが変更されると、React はコンポーネントを効率よく更新して再レンダーします。 +この妙な XML のようなタグについてはすぐ後で説明します。コンポーネントは、React に何を描画したいかを伝えます。データが変更されると、React はコンポーネントを効率よく更新して再描画します。 ここで `ShoppingList` は **React コンポーネントのクラス**、もしくは **React コンポーネントの型**です。コンポーネントは props("properties" の略)と呼ばれるパラメータを受け取り、`render` メソッドを通じて、表示するビューの階層構造を返します。 @@ -168,7 +168,7 @@ return React.createElement('div', {className: 'shopping-list'}, JSX では JavaScript のすべての能力を使うことができます。*どのような* JavaScript の式も JSX 内で中括弧に囲んで記入することができます。各 React 要素は、変数に格納したりプログラム内で受け渡ししたりできる、JavaScript のオブジェクトです。 -上記の `ShoppingList` コンポーネントは `
` や `
  • ` といった組み込みの DOM コンポーネントのみをレンダーしていますが、自分で書いたカスタム React コンポーネントを組み合わせることも可能です。例えば、`` と書いてショッピングリスト全体を指し示すことができます。それぞれの React のコンポーネントはカプセル化されており独立して動作します。これにより単純なコンポーネントから複雑な UI を作成することができます。 +上記の `ShoppingList` コンポーネントは `
    ` や `
  • ` といった組み込みの DOM コンポーネントのみを描画していますが、自分で書いたカスタム React コンポーネントを組み合わせることも可能です。例えば、`` と書いてショッピングリスト全体を指し示すことができます。それぞれの React のコンポーネントはカプセル化されており独立して動作します。これにより単純なコンポーネントから複雑な UI を作成することができます。 ## スターターコードの中身を確認する {#inspecting-the-starter-code} @@ -182,7 +182,7 @@ JSX では JavaScript のすべての能力を使うことができます。*ど * Board(盤面) * Game -Square(マス目)コンポーネントは 1 つの `