りあクト! TypeScriptで始めるつらくないReact開発【② React基礎編】
Physical (worldwide shipping)
- 紙本+電子セット(第5版)Mailbin OKPhysical (via warehouse)1,550 JPY
Physical (ship to Japan)/ Digital Download
- 電子版 (第5版)Digital1,200 JPY
- 紙本+電子セット(第5版)Mailbin OKPhysical (via warehouse)1,550 JPY
- 無料サンプルDigital0 JPY
- 電子版 (旧4版)Digital1,200 JPY
- 紙本+電子セット(旧4版)Out of StockPhysical (via warehouse)1,430 JPY
- 紙本+電子セット(旧3.1版)Out of StockPhysical (via warehouse)1,430 JPY
- 電子版 (旧3.1版)Digital980 JPY

💡 4版から 5版への変更内容については以下の記事をご参照ください https://klemiwary.com/blog/riakuto-5ed-launch ―――― シリーズ累計 3.5 万部を突破、現場のエンジニアからもっとも支持されている React 教本、『りあクト! TypeScript で始めるつらくない React 開発』の改訂第 5 版。全 3 部構成となっている第 2 部「React 基礎編」です。 最新の React 19 に対応。第 2 部の本書では、React の歴史と各種概念を理解したうえでコンポーネントの作り方を学んでいきます。React の表面的な使い方を紹介するのではなく、なぜテンプレートではなく JSX という拡張言語を使うのか、なぜコンポーネントを組み合わせてアプリケーションを作るのか、どのようなメカニズムで UI が更新されるのかといったことまで掘り下げて解説します。 また現場でよく使われている UI ライブラリ、ビルドツールや静的解析ツールの最新情報と使い方を紹介。読めば次の日から業務に役立てられる内容のことまちがいなし! なお第 1 部ではモダン Web 開発のための JavaScript と TypeScript、第 3 部ではルーティングやデータ取得、高度なフォームの実装などを説明しています。併せてお求めください。 ▫️ https://oukayuka.booth.pm/items/2368045 (① 言語・環境編) ▫️ https://oukayuka.booth.pm/items/2367992 (③ React 実践編) ◎ 2025年 5月 30日発行 / B5 判・216 ページ / PDF・EPUB・AZW3 形式 📗 無料サンプル(61ページ分)がご覧いただけます。「無料ダウンロード」ボタンからどうぞ。
■ こんな方にオススメ!
◎入門者の方 😟 JSX って書きづらそう…。そもそもコンポーネントって何のこと? 😟 JavaScript / TypeScript のフレームワークを使うのは初めて 😟 公式サイトや動画コースで React を学んでみたけど、今イチよくわからなかった ◎初〜中級者の方 🤔 React を仕事で使っているけど、今の書き方でいいのか自信がない 🤔 ここ数年の React の変化についていけていない気がする 🤔 Vue や Angular から React への移行を考えている ▵この本に向かない方 😼 Web アプリケーションの開発経験がない 😼 理屈よりもとにかく手を動かしておぼえたい 😼 とにかく動けばいいので、コードの可読性やメンテナンス性は気にしない
■ 読者からの感想
「なぜ初学者に React が難しいといわれるのか原因を追求し、それを解消するため React の原理原則の解説に力が入れられています。React が根本からここまくわしく書かれている書籍は他にはないのではないでしょうか」 「よくある内容の薄い本のクォリティかと思ってたけど、とんでもない本だった。正直 React を学ぶならこれだけでまずは十分なのでは。公式では説明されてない TypeScript での書き方も学べるので、かなりコスパが高い」 「書店に並んでる React 本よりぜんぜん実践的で、かつわかりやすいです。Rails エンジニアに React を教える設定の対話体にするという着想が素晴らしい。すごく具体的でポイントを絞った解説です。まさに力作」 「ベテランと若手の対話方式で進んでいくので、自分も React 初心者だけど超わかりやすい! 使っているライブラリのバージョンとかもちゃんと書いてあるのもいい」 「対話形式の文章だから、内容に入り込みやすい。公式ドキュメントやブログ記事、サンプルコードなどを色々かいつまんで得た知識が、この本を読むことで点が線となってつながり、React の理解度がかなり上がった気がする!」 🗨その他、読者の方からいただいたレビュー・感想を以下のページにまとめています。 https://klemiwary.com/reviews
【第2部 目次】
第5章 JSX でUI を表現する 5-1. なぜ React はJSX を使うのか 5-1-1. JSX はどのように変換されるか 5-1-2. なぜ React ではデザインとロジックを混在させるのか 5-1-3. なぜReact はHTML テンプレートを使わないのか 5-1-4. JSX は汎用的にUI を表現する 5-2. JSX 構文の書き方 5-2-1. JSX の基本的な文法 5-2-2. JSX とコンポーネントの関係 5-2-3. React の組み込みコンポーネント 第6章 React をめぐるモダン Web 開発の歴史(前編) 6-1. 第1 世代:Ajax とDOM 操作のためのツールキット 6-2. 第2 世代:SPA フレームワークの登場 6-3. パラダイムシフトを起こした React 6-3-1. React 誕生秘話 6-3-2. React は何を革新したのか 第7章 ビルドツールでプロジェクトを運用する 7-1. React 開発におけるビルドツールの変遷 7-1-1. React の開発環境を作るのに必要なツール 7-1-2. webpack 帝国の完成 7-1-3. 新世代ビルドツールの台頭 7-1-4. Vite の時代 7-1-5. Vite のライバルとビルドツールの将来 7-2. Vite で開発環境を構築する 7-2-1. create-vite によるセットアップ 7-2-2. Vite 環境のカスタマイズ 7-2-3. 拡張子、書くべきか書かざるべきか 第8章 コンポーネントの基本を学ぶ 8-1. UI コンポーネントライブラリの導入 8-1-1. UI コンポーネントライブラリとは 8-1-2. コンポーネントのスタイリング戦略 8-1-3. shadcn/ui の環境を構築する 8-2. コンポーネントに Props を受け渡す 8-3. コンポーネントに状態を持たせる 8-4. コンポーネントで副作用を扱う 8-5. React におけるコンポーネント構文の変遷 8-5-1. 最初はクラスだったコンポーネント 8-5-2. 関数コンポーネントと Hooks 8-6. コンポーネントからロジックを分離し、再利用できるようにする 第9章 リンターとフォーマッターでコード美人に 9-1. リンターでコードの書き方を矯正する 9-1-1. リンターの選定 9-1-2. ESLint の設定記法 9-1-3. Flat Config で ESLint の設定を書く 9-1-4. ESLint の環境をさらにカスタマイズ 9-1-5. ESLint の設定内容を確認する 9-2. フォーマッターでコードを整形する 9-2-1. フォーマッターの地位を確立した Prettier 9-2-2. Prettier の環境を作る 9-3. Git Hooks と連携して実行させる 第10章 React をめぐるモダン Web 開発の歴史(後編) 10-1. 第3世代:SPA モデル黄金時代 10-1-1. React 登場以後の世界 10-1-2. Angular 10-1-3. Vue.js 10-1-4. Svelte 10-2. 第4 世代:メタフレームワークの時代 10-2-1. バック・トゥ・ザ・サーバ 10-2-2. React の上に構築されたフレームワーク 10-2-3. Next.js 10-2-4. Remix(React Router v7 以降) 10-2-5. どのメタフレームワークを採用するべきか
■「りあクト!」はココが違う
✅ 新人と先輩エンジニアの対話による解説形式。初学者がつまづきやすいポイントや抱きがちな疑問に、先輩キャラが丁寧に対応してくれます。 ✅ 随所に脚注で公式ドキュメントなどの該当するページへのリンクを掲載。疑問に思った箇所はすぐ一次ソースに当たって理解を深めることができます。 ✅ 各技術について使い方だけでなく、その登場した背景や歴史、開発者の横顔なども紹介。なぜその仕様なのか納得しながら学習を進められます。 ✅ 進化の早い React や TypeScript、ESLint の最新の記法にいち早く対応。各種設計手法を取り入れた綺麗なコードで、現場の第一線で活躍しているエンジニアのやり方が学べます。
■ 本文中のサンプルコード
サンプルコードは全て、そのまま動く状態で章・節ごとに GitHub に掲載。 https://github.com/klemiwary/Riakuto-StartingReact-ja5.0 自由に手を加えて動作の確認ができるほか、ご自身のプロジェクトのボイラープレートとしてもお使いいただけます。
■ 電子版の閲覧について
本書の電子版ファイルは PDF と EPUB、AZW3 の 3 つの形式で提供しています。 お手持ちの環境で快適に閲覧していただけるよう、「よりよい環境で電子版をお読みいただくために」というドキュメントをご用意しました。 https://github.com/klemiwary/Riakuto-StartingReact-ja5.0/blob/main/ebook-tips.md 各フォーマットのフォント事情やおすすめアプリなどをご紹介していますので、本書をご利用の前にぜひご覧ください。
■ 旧4版について
古い環境で開発している方のため、旧 4 版も引き続き販売中です(電子版のみ)。 「② React 基礎編」の 4 版は、5 版と主に以下の点が異なります。 ✓ React はバージョン 18 系を使用 ✓ ESLint の設定は eslintrc 形式で記述 ✓ Vite による SPA 構築のみを対象。Next.js などのフレームワークの説明がない ✓ UI コンポーネントライブラリには Chakra-UI を使用 4 版の無料サンプルや目次は以下のページに掲載しています。 https://github.com/oukayuka/Riakuto-StartingReact-ja4.0
■ シリーズその他の作品
『りあクト! TypeScript で極める現場の React 開発』 https://booth.pm/ja/items/1312815 👉 今作からのステップアップ となる内容です。テストの書き方や便利な周辺ライブラリを紹介。 『りあクト! Firebase で始めるサーバーレス React 開発』 https://booth.pm/ja/items/1572683 👉 コミック情報アプリを作りながら Firebase を学んでいく、実践的な内容です。