『はじめてさわるReact & JavaScript』リンクページ
更新日：2024/01/24
- *補足情報（2024年1月）「create-react-appを学習用に使うことについて + 【React + Vite】の使い方」：解説ページへ移動する
- 本書に関するインタビュー記事：https://monotein.com/blog/interview-about-my-books
- 見本アプリ：https://react-book-corona-tracker-app.netlify.app
- ソースコードダウンロード：https://github.com/mod728/react-book--corona-tracker
- Amazonでレビューする：https://www.amazon.co.jp/review/create-review/?ie=UTF8&channel=glance-detail&asin=B09693ZJCV
全般
【 2026年6月7日まで 】限定特典
★ Next.jsでつくるフルスタックアプリ動画（180分）を無料プレゼント ★
ReactとTypeScriptを学んだあと、多くの方が「次はNext.jsを使いたい」と思います。
そこで6月7日までの期間限定で、『Reactマスター』と『TypeScriptマスター』の「まとめ買い」をご購入いただいた方限定の特典として、「Next.jsでつくるフルスタックアプリ」（動画41本／180分）をプレゼントします。
本ページをご覧の方限定のキャンペーンです。
限定販売ページはこちら ▼
https://monotein.base.shop/items/145752295
- 日本の感染データ： https://monotein-books.vercel.app/api/corona-tracker/country/japan
- Node.js： https://nodejs.org/en/download
- VS Code： https://code.visualstudio.com/download
- JSON Formatter： https://chromewebstore.google.com/detail/json-formatter/bcjindcccaagfpapjjmafapmmgkkhgoa
- エラー発生時の対処方法： https://monotein.com/blog/how-to-find-and-fix-errors
- countries.json用のデータ： https://github.com/mod728/react-book--corona-tracker/blob/chapter3/src/countries.json
- CSSファイル： https://github.com/mod728/react-book--corona-tracker/blob/chapter3/src/App.css
- 全世界の感染データ： https://monotein-books.vercel.app/api/corona-tracker/summary
- 第3章完了時のソースコード： https://github.com/mod728/react-book--corona-tracker/tree/chapter3
- Netlify： https://www.netlify.com
第1章
第2章
第3章
第4章
学習ロードマップ（2026年）
ここでは、依然として高い人気をほこる「フロントエンド」の学習ロードマップを紹介します。
フロントエンドの開発ツールでもっとも需要があるのがReactです。
2020年ごろの日本ではVueに勢いがありましたが、その後は「React一強」となっています。
しかしReactは高度なツールのため、実際の開発現場や本格的なアプリ制作を行うには、多くのことを学ぶ必要があります。
次のリストを見てください。
- ›Hooksの深い理解（useState・useEffect・useRef・useContext・useReducer....）
- ›カスタムHooksの設計と活用
- ›TypeScriptの基礎とReactでの型安全な開発
- ›TypeScriptとReactの組み合わせ方
- ›コンポーネント設計の考え方（責務の分離・再利用性・単一責任の原則）
- ›State管理の戦略（どこに・なぜ置くのか）
- ›再レンダリングの仕組みとパフォーマンス最適化
- ›propsの正しい使い方とデータの流れの設計
- ›副作用・フォーム処理・条件付きレンダリングの扱い方
- ›リスト・keyの仕組みと注意点
- ›Context APIによるグローバルなState管理
- ›React Routerを使ったページ遷移の実装
- ›APIとの連携（データフェッチ・非同期処理）
- ›エラーハンドリングの考え方
- ›React 19の新機能（Actions・useActionState・useなど）
学ぶべきことはたくさんあります。
そのため多くのReactビギナーが
「何から学べばいいかな」
「どの順番で進めればいいのだろうか」
と迷い、なかなか進歩を実感できない状態になります。
情報というのは、いつでも好きだけ、しかも無料で入手できるのに、学習を進められない人がいる.....。
いやむしろ増えている.....。
不思議といえば不思議な状況です。
しかし、当然といえば当然の帰結です。
私たちは迷います。
情報が増えるほど、どれを選べばいいのか分からなくなり、結局最後には「何も選ばない」という選択をしてしまうのです。
つまり「前進しない」という選択です。
本書を読んで「Reactでアプリ開発ができるようになりたい」、「2026年最新のフロントエンドスキルを身につけたい」と思った人は、次の教材に進んでみましょう。
•『Reactマスター』
•『TypeScriptマスター』
この2つは、現在のフロントエンド開発で必要なスキルを体系的にまとめた教材です。
必要なことがすべて入っているので、迷うことなく、もっとも効率的にReactとTypeScriptスキルを身につけられます。
詳しくは下記ページからご覧ください▼