React本格入門 ~実践力が身に付くコンポーネント開発~
- 樹下雅章 著
- 定価
- 3,300円(本体3,000円+税10%)
- 発売日
- 2026.4.15
- 判型
- B5
- 頁数
- 304ページ
- ISBN
- 978-4-297-15523-0
概要
ReactはWebアプリケーション開発におけるUI開発に特化した人気のJavaScriptライブラリです。本書では最新の安定版であるReact19をベースに、「環境構築」「コンポーネントの使い方」「プロパティ(props)の使い方」「フックの使い方」「アクションの使い方」などReactの押さえておくべきポイントを体系的に学べます。また、集大成として、実際にアプリケーションを開発することで最新のWebアプリケーション開発の一連の流れが学べるため、近年需要が高まっているセミナーや研修でも利用できます。
こんな方にオススメ
- はじめてReact使用してWeb開発する人
目次
1章 Reactの世界へようこそ
1-1 Reactとは
- 1-1-1 Reactの特徴
- 1-1-2 React学習のメリット
1-2 開発環境の整備
- 1-2-1 Node.jsのインストール
- 1-2-2 Visual Studio Code(VSCode)のインストール
1-3 Vite の活用
- 1-3-1 Viteの利用理由
- 1-3-2 初回Reactプロジェクトの作成
1-4 Reactプロジェクトの構造理解
- 1-4-1 プロジェクト構造の確認 29
- 1-4-2 VSCodeの拡張機能のインストール
2章 コンポーネント
2-1 JSXの基礎
- 2-1-1 JSXの特徴
- 2-1-2 JSX記述のルール
2-2 コンポーネント指向
- 2-2-1 コンポーネント指向の理解
- 2-2-2 画面コンポーネントの設計
2-3 コンポーネントの作成
- 2-3-1 フォルダ構造の検討
- 2-3-2 小規模コンポーネントからの作成
3章 props(プロップス)とstate(ステート)
3-1 props(プロップス)の基礎
- 3-1-1 props(プロップス)の概要
- 3-1-2 props(プロップス)の使用方法
3-2 state(ステート)の基礎
- 3-2-1 state(ステート)の概要
- 3-2-2 state(ステート)の使用方法
4章 状態のリフトアップとイベント
4-1 状態のリフトアップの基礎
- 4-1-1 状態のリフトアップの概要
4-2 イベント処理の基礎
- 4-2-1 イベントの概要
- 4-2-2 主要イベントの活用
5章 副作用(サイドエフェクト)の理解
5-1 useEffectの基礎
- 5-1-1 useEffectの概要
- 5-1-2 useEffectの使用方法
5-2 クリーンアップ関数の基礎
- 5-2-1 クリーンアップ関数の概要
- 5-2-2 クリーンアップ関数の使用方法
6章 Context(コンテキスト)の理解
6-1 プロップスドリリング(props drilling)
- 6-1-1 親から子へのpropsの受け渡し
- 6-1-2 プロップスドリリング(props drilling)の考え方
6-2 Context(コンテキスト)の基礎
- 6-2-1 Context(コンテキスト)の概要
7章 React Routerによるページ遷移
7-1 React Router DOMの基礎
- 7-1-1 React Router DOMの概要
- 7-1-2 React Router DOMの使用方法
7-2 パラメーターを使った動的ルート
- 7-2-1 useParamsの使用方法
- 7-2-2 複数URLパラメーターの扱い方
7-3 ネストされたルートと
- 7-3-1 ネストされたルートの概要
7-4 NotFound ページの実装
- 7-4-1 NotFound(404)ページの概要
8章 フォームと入力値の管理
8-1 フォームの基本と値の管理
- 8-1-1 フォームの概要
- 8-1-2 バリデーションの概要
8-2 React Hook Formの活用
- 8-2-1 React Hook Formの概要
- 8-2-2 React Hook Formの使用方法
9章 非同期処理とAPI
9-1 非同期処理とAPIの基礎
- 9-1-1 同期処理と非同期処理の比較
- 9-1-2 APIの概要
- 9-1-3 Web APIの概要
9-2 非同期処理によるAPIの活用
- 9-2-1 fetch関数の概要(Promiseとの関係)
- 9-2-2 fetch関数を用いたサンプルの作成
10章 MUI
10-1 MUIの導入
- 10-1-1 MUIの概要
- 10-1-2 MUIコンポーネントによるUI作成
10-2 MUIの活用方法
- 10-2-1 MUI公式サイトの活用手順
11章 AxiosによるAPI通信の最適化
11-1 JSON Serverの活用
- 11-1-1 JSON Serverの構築
- 11-1-2 JSON Serverの概要
11-2 Axiosの活用
- 11-2-1 fetchの復習
- 11-2-2 AxiosによるJSON Serverとの通信
12章 基盤ファイルの作成(総合演習)
12-1 作成するアプリケーションの説明と準備
- 12-1-1 作成するReact アプリの概要
- 12-1-2 プロジェクトの準備
- 12-1-3 プロジェクト構成の理解と整理
12-2 独立性の高いファイルの作成
- 12-2-1 レイアウト(見た目の枠組み)の作成
- 12-2-2 入力チェックの作成
- 12-2-3 Contextの作成
13章 コンポーネントの作成(総合演習)
13-1 UIコンポーネントの作成
- 13-1-1 Todoを入力して保存するフォーム
- 13-1-2 1件分のTodoを表示する部品
- 13-1-3 Todoを一覧で表示する部品
- 13-1-4 確認ダイアログ
13-2 ページコンポーネントの作成
- 13-2-1 Todo一覧ページの作成
- 13-2-2 Todo新規作成ページの作成
- 13-2-3 Todo編集ページの作成
14章 ルーティング処理とテスト(総合演習)
14-1 ルーティングの設定
- 14-1-1 ページ遷移(ルーティング)
- 14-1-2 React Routerの主要コンポーネント復習
14-2 全機能の動作確認
- 14-2-1 テストの概要と前準備
- 14-2-2 テストシナリオ
プロフィール
樹下雅章
大学卒業後、ITベンチャー企業にてエンジニアとしてキャリアを開始。要件定義から保守まで開発工程を一通り経験し、SES・自社パッケージ開発など多様なプロジェクトに携わる。その後、大手食品会社で社内SEとして業務改善やベンダー管理を担当。事業部撤退を機に「教える道」へ転向し、現在はIT講師として新人・企業研修を担当している。「難しいことを、誰にでもわかるように」を信条に、初学者の“最初の一歩”を支える教材づくりに情熱を注いでいる。