導入
ブラウザ内の学習ではここまでにしますが、実務では React を「ツール」と組み合わせて使います。次のステップとして知っておくとよいものを紹介します（この回は読み物です）。
説明
- Vite / Create React App … 実際の開発では、手元のPCにプロジェクトを作ってファイルを分けて書きます。
npm create vite@latestでReactプロジェクトを作るのが今の定番です。 - JSXのビルド … このサイトではブラウザ内で Babel が JSX を変換していますが、実務ではビルド時に変換します（速度とエラー検出のため）。
- コンポーネントのファイル分割 … 1コンポーネント1ファイル（
Button.jsxなど）にしてimport/exportで組み合わせます。 - フックいろいろ …
useState・useEffectの他にuseRef・useContext・useReducer・useMemoなどがあります。 - 状態管理・ルーティング … 画面遷移は React Router、大きなアプリの状態管理には Redux / Zustand / Jotai などが使われます。
- フレームワーク … 本格的なWebサービスでは、Reactをベースにした Next.js がよく選ばれます（サーバー側描画やルーティングが最初から用意されています）。
- TypeScript … 実務のReactはほぼ TypeScript で書かれます。props に型を付けることで、間違いを早く見つけられます。
まとめ
このコースでは、JSX・コンポーネント・props・state・イベント・useEffect という Reactの背骨を、手を動かして学びました。ここが分かっていれば、ツールが変わっても React の考え方は同じです。次は手元に Vite でプロジェクトを作り、ファイルを分けて同じことを書いてみるのがおすすめです。