NOTE 082 / 2021年
身近な題材で、取得と表示を一続きに学ぶ
身近な題材で、取得と表示の基本を学ぶための教材設計です。
API を題材にすると、React の基本を一続きの流れで学べます。入力を受け取り、取得中と完了と失敗の状態を出し分け、結果を一覧にする。この流れは、実際の画面でも何度も出てきます。
教材では、最初から抽象化しすぎないほうが理解しやすいものです。同じ処理を一度は素直に書き、そのあとで共通化する順番にすると、なぜその部品が必要なのかが伝わります。
押さえたい点
- 01取得中と完了と失敗を出し分ける
- 02最初は素直に書く
- 03共通化は後から行う
参考資料
外部サイトが開きます。内容は各サイトの管理下にあります。
- React 学習ガイド 外部サイトreact.dev
- React リファレンス 外部サイトreact.dev
- React で考える 外部サイトreact.dev
- useState リファレンス 外部サイトreact.dev
- useEffect リファレンス 外部サイトreact.dev
- useContext リファレンス 外部サイトreact.dev
- TypeScript ドキュメント 外部サイトtypescriptlang.org
- TypeScript の設定 外部サイトtypescriptlang.org
- MDN Web Docs 外部サイトdeveloper.mozilla.org
- Pokemon API 外部サイトpokeapi.co
- PokeAPI 外部サイトpokeapi.co
- Vercel ドキュメント 外部サイトvercel.com
- Next.js ドキュメント 外部サイトnextjs.org