📌 新刊書『React全部入り：Reactマスター Zero To Hero』リリース

React新刊書リリース

Reactの新刊書を昨日リリースしました。

【React全部入り：Reactマスター Zero To Hero ― 自信をもってReactコードが書けるようになる本】

私はすでに数冊、ビギナー向けのReact入門書（下掲）を書いていますが、本書はそれらを終えた方が次に読むのに最適な一冊として書いた、いわば「正式な続編」にあたります。

対象読者は『HTML／CSSの学習を終えた人すべて』なので、私の既刊書を読んでいなくても問題のない難易度です。

本書も好評のハンズオン（作りながら学ぶ）形式で進むので、飽きることなく学習を進められます。

---

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

🔷BASEショップ：monotein.base.shop

🔷note：note.com/monotein

🔷楽天：books.rakuten.co.jp

🔷Booth：monotein.booth.pm

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

対象読者

🔶 HTML／CSSの学習を終えた人（JavaScriptの知識不要）

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

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

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

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

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

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

本書の特徴

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

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

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

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

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

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

具体的には次のような項目をカバーしています。

---

ウェブアプリケーションの仕組み

フロントエンド／バックエンドの役割

JavaScriptの働き

JavaScriptのデータ

オブジェクト／配列／関数

レンダリング

仮想DOM

JSX

SPA

React + Vite

useState／useEffect

カスタムHook

useContext／useReducer

Redux

テスト

サーバーコンポーネント

Next.js

---

ハンズオン（作りながら学ぶ）スタイル、つまり自分の手でコードを書きながら進むので、飽きずに学習を続けられます。

本書は、多くのReactビギナーがつまづくfunction、コンポーネント、そしてイベントのコードと記法について大きく記述を割いているのが特徴です。

そのため、これまでReactコードを「なんとなく」書いていたReact初級者〜中級者にとっても学びのある一冊となっています

また、プログラミングに慣れていない人のために、各所各所で出てくる英語のコードや英単語の説明にも力を入れています。

私は英語を使えるようになったあとでプログラミングの勉強をはじめたので、英語表記のコードにつまづくことはありませんでしたが、英語に強い苦手意識をもっている方は、英語で書かれているコードにも馴染みにくさを感じるというケースを多数見てきたためです。

【試し読み】 monotein-master-books-reading.netlify.app

本書を書いた理由

私が最初のReact入門書『はじめてつくるReactアプリ』を書いたのは3年前です。

はじめてつくるReactアプリ

【2024年4月新版発売。HTMLとCSSの知識だけで始められるReact開発。好評なハンズオン形式でスイスイ進める】

1859 → 0円

Amazonのページに移動する

それ以来、この本は多くの読者の方に受け入れてもらえ、好意的なご感想を数多くいただきました。

その中でよく見かけたのが、「三好さんの本でReact入門に成功できたけど、次に読む本がわからない」という声です。

『はじめてつくるReactアプリ』などの入門書において、私は最優先事項を「読者に成功体験をひとつ、できるだけ最短時間で作ってもらう」ということに置いていました。

つまり読者に、「自分でもできるんだ！」「Reactって難しそうだったけど、勉強を進めていけそうだ！」という前向きな気持ちを持ってもらうことです。

そのため、Reactの網羅的な解説書は目指さず、「レンダリング」や「仮想DOM」といったReactの基礎概念の説明もすべて書かないようにしました。

「できる」を「わかる」よりも優先させていたのです。

そのため、いずれはReactについてもう少し深く解説したものを書きたい気持ちがずっとありました。

対象読者は依然として「Reactビギナー」「HTML／CSSの学習を終えた人」におきながらも、しっかりしたReactの知識を身につけられ、そして読後には自信をもってReactコードを書けるようになる学習書です。

構想から執筆までかなり時間がかかりましたが、ようやく読者の方に届けられるところまで来ることができてうれしく思います。

なお副題にある「Zero To Hero」とは、文字通り「ゼロからヒーローになる」という韻を踏んだ英語の表現で、「Reactの知識・経験ゼロから、ヒーロー（上級者）になる」という意味を込めています。

---

*本書は現在のところAmazon Kindle版での発売予定はありません。下記サイトより直接ご購入ください。PDF版（A5／全262ページ）のダウンロードとなります。

React全部入り：Reactマスター Zero To Hero ― 自信をもってReactコードが書けるようになる本

【JavaScript／Reactの基礎から発展的内容まで全範囲を網羅。自信をもってReactを書けるようになる本】

販売ページに移動する

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

🔷BASEショップ：monotein.base.shop

🔷note：note.com/monotein

🔷楽天：books.rakuten.co.jp

🔷Booth：monotein.booth.pm

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

続編をリリースしました（2024年3月）

「TypeScriptをReactで使う」にフォーカスした新刊書を出しました。

本書を読まれた人が、次に読むのに最適な一冊になっています。

くわしくは：https://monotein.base.shop/p/00002

TypeScriptマスター with React

【TypeScriptをReactでつかうことに徹底フォーカス。2024年の開発現場で必須のスキルを最短で学べる一冊】

販売ページに移動する

文字数と分量

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

• 「Reactマスター（本書）」の文字数：*240,360

• 「はじめてつくるReactアプリ with TypeScript」の文字数：97,919

くわしい内容一覧

🔷 アプリケーションの仕組み／フロントエンドの役割／バックエンドの役割／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と名前付きインポート／配列の扱い方／カスタムHook／条件付きレンダリング／オンラインで公開する方法（Netlify Drop）

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

目次

はじめに

🔷 第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.279 ― 今後の勉強の進め方

P.280 ― あとがき
P.282 ― 関連書籍
P.283 ― 著者について

P.279 ― あとがき

React全部入り：Reactマスター Zero To Hero ― 自信をもってReactコードが書けるようになる本

【JavaScript／Reactの基礎から発展的内容まで全範囲を網羅。自信をもってReactを書けるようになる本】

販売ページに移動する

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

🔷BASEショップ：monotein.base.shop

🔷note：note.com/monotein

🔷楽天：books.rakuten.co.jp

🔷Booth：monotein.booth.pm

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