React覚書
ReactJS、ことはじめ https://ja.react.dev/learn/thinking-in-react Reactの流儀 ステップ 1：UI をコンポーネントの階層に分割する React におけるコンポーネントとは、マークアップを返す JavaScript 関数です。 React のコンポーネント名は常に大文字で始める必要があり、 HTML タグは小文字でなければなりません。 JSX は HTML より構文が厳格です。 コンポーネントは複数の JSX タグを return することはできません。 空の <>...</> ラッパのような共通の親要素で囲む必要があります。 function AboutPage() { return ( <> <h1>About</h1> <p>Hello there.<br />How do you do?</p> </> ); } ステップ 2: React で静的なバージョンを作成する 子コンポーネントにはprops ステップ 3：UI の状態を最小限かつ完全に表現する方法を見つける stateすべきものを見つける 時間が経っても変わらないものですか？ ===>そうであれば、state ではありません。 親から props 経由で渡されるものですか？ ===>そうであれば、state ではありません。 既存の state や props に基づいて計算可能なデータですか？ ===>そうであれば、それは絶対に state ではありません！ ステップ 4：state を保持すべき場所を特定する state を所有するコンポーネントを特定する stateに基づいて何かをレンダーするすべてのコンポーネントを特定する。 階層内でそれらすべての上に位置する、最も近い共通の親コンポーネントを見つける。 state がどこにあるべ...