コンポーネントは関数で作る

function Card() { return <div>...</div>; }のように、JSXを返す関数がコンポーネントです。大文字で始まる名前をつけ、<Card />のようにタグとして使えます。

propsは部品への引数

<Card title="はじめてのReact" />のように属性の形でデータを渡し、受け取る側はprops.titleとして使います。同じ部品でも渡すデータを変えれば表示が変わる、これが再利用の仕組みです。

学ぶ目的

画面を意味のある部品に分割し、propsでデータを流し込むという、React開発の毎日の作業そのものを身につけます。

• 関数コンポーネントの作り方
• propsで親から子へデータを渡す
• コンポーネント分割の考え方