🟡 週末を使えば読み終わる本書。

🟡 たった2日間で、JavaScriptとReactの理解をプロレベルまで引き上げ、Reactコードを自信をもって書けるようになります。

🟡 JavaScriptの基礎の基礎、Reactの基本コンセプト、そして発展的内容まで、Reactの全範囲をカバー。

🟡 この本だけで、2024年のフロントエンド開発で必要となる最新のReactの知識をすべて習得できます。

🟡 既刊書で好評のハンズオン形式（作りながら学ぶスタイル）。
自分でコードを書きながら進むので飽きづらく、さらにはアプリを作り上げていく楽しさと充実感も味わえます。

🟡 最新のReact開発環境構築ツールReact + Viteをベースに、2024年に必要な最新知識を伝授。

🟡 HTMLとCSSの知識だけで始められる優しい入門書。JavaScriptの基礎の基礎もカバーしています。

🟡 Reactのベーシックから発展的内容まで学ぶので、これまでReactを「なんとなく」書いてきた中級者にも学びが多い内容です。

「なぜReactにはfunctionを使うものと使わないものがあるの？」
「なぜイベントの書き方には種類があるの？」
「レンダリングってなに？」
「レンダリングがなぜ重要なの？」
「ダークモードってどうやって作るの？」
・・・・・といった多くのReactビギナー 〜 中級者が抱く疑問にすべて答えます。

【対象読者】
🔶 HTML／CSSの学習を終えた人（JavaScriptの知識不要）

🔶 理論や説明を読むのではなく、自分の手を動かしながら学んでいきたい人

🔶 2024年最新のReact開発環境（React + Vite）で学びたい人

🔶 他のReact入門書で挫折した人

🔶 Reactを使って何個もアプリを作ったことはあるけど、いまいち自信をもってコードが書けないReact中級者

🔶 React公式ドキュメントを難しいと思った人

🔶 VueからReactに切り替えたい人

【試し読み】
https://monotein-master-books-reading.netlify.app/react-master-book-trial-miyoshi-aki.pdf

【発売日】
2024年2月21日

*本サイトはネットショップ開設サービス「BASE」を利用して作られています。決済サービスもBASE社の提供しているものです。

本書は現在下記4つのプラットフォームからご購入いただけます。

🔷BASEショップ（本サイト）
https://monotein.base.shop/items/83491615

🔷note：https://note.com/monotein/n/nc8a5768fcc27

🔷楽天
https://books.rakuten.co.jp/rk/7055fd7127093b7b952b11f87d9b1056/

🔷Booth
https://monotein.booth.pm/items/5611184

*各プラットフォームの販売手数料が異なるため、価格も異なります。
*BASEショップ（当サイト）がもっとも安くご購入いただけます。

【分量】
本書は既刊書「はじめてつくるReactアプリ with TypeScript」の約2.5倍の分量です。

• 「Reactマスター（本書）」の文字数：240,360
• 「はじめてつくるReactアプリ with TypeScript」の文字数：97,919

*本書はPDFファイルでのご提供となります（283ページ／A5サイズ）

*本書ではMacを使用しています。Windowsの方は一部表示が異なることに注意してください。

🔷 アプリケーションの仕組み／フロントエンドの役割／バックエンドの役割／CRUD操作／ターミナルの使い方／Node.js／VS Codeのインストール／npmパッケージのバージョンの確認方法／エラーが起きた時の対処方法

🔷 Reactの概要／Reactが使われる理由／コンポーネント／仮想DOM／レンダリングの種類／レンダリングのステップ／初回レンダリング／再レンダリング

🔷 JavaScriptの歴史／オブジェクトと配列／データの種類／定数宣言／組み込みfunction／function／console.log()／map()／slice()／switch／演算子／分割代入／スプレッドオペレーター

🔷 React + Viteの環境開発セットアップ／フォルダ構成の考え方／Reactコード（コンポーネント）の構造／Reactアプリの構造／SPA／CSSの適用方法／fetch()／Promise／非同期処理（async／await）／state／state更新の方法（useState）／テンプレートリテラル／イベントの種類／イベントの書き方のバリエーション／単方向データフロー／ページの設定方法（react-router-dom）／ページの移動／Layoutコンポーネント／ページタイトルの設定

🔷 stateの整理／useContext／ローディング／エラー処理／try／catch／ダークモードの仕組みと実装／CSS変数／localStorage／useEffectのレンダリング制御方法／デフォルトimportと名前付きimport／配列の扱い方／カスタムHook／条件付きレンダリング／オンラインで公開する方法（Netlify Drop）

🔷 分割代入と省略記法／functionの書き方のバリエーション／useStateの書き方／useEffect／useLayoutEffect／useContext／useReducer／useRef／memo／useMemo／useCallback／useTransition／Suspense／Lazy／Redux／テスト（vitest）／サーバーコンポネント（Next.js）


【試し読み】https://monotein-master-books-reading.netlify.app/react-master-book-trial-miyoshi-aki.pdf

Amazonベストセラー1位を複数回獲得している『はじめてつくるReactアプリ with TypeScript』著者。

自身のJavaScript挫折経験をもとに、HTMLとCSSの知識だけで本格的なアプリ開発を始められる入門書を多数執筆中。合計著作は22冊を超える。

専門用語なしでプログラミングを教えるメソッドに定評があり、1200人以上のビギナーを、最新のフロントエンド開発入門に成功させる。

🔶 既刊書はこちら（Amazon） → https://www.amazon.co.jp/stores/author/B099Z51QF2

◆ウェブサイト → https://monotein.com
◆X（Twitter）→ https://twitter.com/monotein_
◆ note → https://note.com/monotein/

はじめに

🔷 第1章　アプリケーションの仕組みを知ろう + 開発の準備

P.8 ― この章で学ぶこと

P.9 ― JSONデータの整形

P.9 ― ウェブサイトとウェブアプリケーションの違い

P.10 ― フロントエンドとバックエンド

P.16 ― CRUD操作

P.18 ― ターミナルの使い方

P.18 ― Node.js

P.19 ― npm

P.20 ― VS Code

P.20 ― エラーが発生した場合の対処方法

🔷 第2章　Reactについて知ろう

P.21 ― この章で学ぶこと

P.22 ― Reactの概要

P.22 ― Reactが使われる理由

P.23 ― コンポーネント

P.29 ― 仮想DOM

P.31 ― JSX

P.32 ― レンダリング

P.32 ― Reactのレンダリングと、ブラウザのレンダリング

P.33 ― トリガーリング

P.34 ― レンダリング

P.34 ― コミッティング

🔷 第3章　JavaScriptを知ろう

P.35 ― この章で学ぶこと

P.36 ― JavaScriptの簡単な歴史

P.36 ― 「データ」について

P.37 ― データの種類

P.37 ― データの形（オブジェクトと配列）

P.40 ― データに名前をつける（定数宣言）

P.41 ― データを操作する手段（2種類）

P.41 ― デフォルトの操作手段（組み込みfunction）

P.42 ― オリジナルの操作手段（function）

P.43 ― 組み込みfunction

P.45 ― console.log()

P.47 ― map()

P.51 ― slice()

P.52 ― function

P.58 ― switch

P.59 ― その他の文法

P.59 ― 論理演算子（&&）と三項演算子（?）

P.59 ― 分割代入

P.60 ― スプレッドオペレーター

🔷 第4章　Reactの基礎を学ぼう

P.62 ― この章で学ぶこと

P.63 ― アプリの構成の確認

P.65 ― React開発ツールのインストール

P.65 ― create-react-app

P.65 ― React + Vite

P.65 ― Next.js

P.70 ― フォルダ構成の方法

P.71 ― フォルダ構成例 1（ページベース）

P.71 ― フォルダ構成例 2（機能ベース）

P.74 ― Reactコードの構造

P.82 ― 共通コンポーネントの準備

P.84 ― Formコンポーネント開発 1（データを取得する）

P.93 ― Formコンポーネント開発 2（データの管理／stateとイベント）

P.108 ― Formコンポーネント開発 3（取得データの整理）

P.117 ― Recipeコンポーネント開発 1（Reactのデータフロー）

P.127 ― Recipeコンポーネント開発 2（取得データを表示）

P.134 ― Recipeコンポーネント開発　3（ページの設定）

P.144 ― Layoutコンポーネント作成

P.148 ― 画像とCSS

🔷 第5章　Reactをもっと使ってみよう

P.150 ― この章で学ぶこと

P.151 ― stateの整理（useContext）

P.164 ― ローディングの設定

P.171 ― エラー処理（try／catch）

P.173 ― ダークモード開発 1（ダークモードの仕組み／CSS変数）

P.177 ― ダークモード開発 2（ダークモードの実装）

P.187 ― ダークモード開発 3（カスタムHookの作成）

P.192 ― 検索履歴の開発（概要）

P.193 ― 検索履歴の開発 1（検索履歴が表示・削除される仕組み）

P.195 ― 検索履歴の開発 2（配列へのデータ保存方法）

P.203 ― 検索履歴の開発 3（useEffectの使い方）

P.213 ― 検索履歴の開発 4（履歴を削除する方法）

P.217 ― 検索履歴の開発 5（条件付きレンダリング）

P.223 ― アプリをオンラインで公開する（デプロイ）

🔷 第6章 さらに深くReactを知ろう

P.224 ― この章で学ぶこと

P.225 ― 分割代入と省略記法

P.227 ― functionの書き方のバリエーション

P.228 ― 関心の分離（ロジックと表示）

P.230 ― React Hooksの種類と分類

P.232 ― useStateの記法

P.235 ― useLayoutEffect

P.237 ― useReducer

P.244 ― useRef

P.249 ― useMemo／useCallback／memo

P.257 ― useTransition

P.261 ― SuspenseとLazy

P.264 ― Redux

P.271 ― テスト（function）

P.274 ― サーバーコンポーネント（Next.js）

P.280 ― あとがき
P.282 ― 関連書籍

P.283 ― 著者について