コンポーネントと小道具
コンポーネント。概念的にはJavaScript関数に似ています。任意の入力パラメーター（つまり「小道具」）を受け入れ、ページに表示されるコンテンツを説明するReact要素を返します。
関数コンポーネントとクラスコンポーネント
機能コンポーネント
function Welcome(props) {
return <h1>Hello, {
props.name}</h1>;
}
クラスコンポーネント
class Welcome extends React.Component {
render() {
return <h1>Hello, {
this.props.name}</h1>;
}
}
レンダリングコンポーネント
以前は、遭遇したReact要素は単なるDOMタグでしたが
、React要素はユーザー定義コンポーネントにすることもできます
。React要素がユーザー定義コンポーネントの場合、JSXが受け取った属性とサブコンポーネントを使用します。（子）はに変換されます。単一のオブジェクトであり、コンポーネントに渡されます。このオブジェクトは「props」と呼ばれます。
function Welcome(props) {
return <h1>Hello, {
props.name}</h1>;
}
const element = <Welcome name="Sara" />;
ReactDOM.render(
element,
document.getElementById('root')
);