2日でTypeScript + Reactの苦手意識を捨てされる本

🟡 2024年のフロントエンド開発現場で必須のTypeScript。基礎から高度な内容までを全カバー

🟡 「TypeScriptをReactで使う」という点に徹底フォーカス。React + TypeScript開発で必須の知識とスキルを効率的に獲得


🟡 最新のReact開発環境構築ツール「React + Vite」を使用

🟡 「手を動かしがら学ぶ」ハンズオン形式なので、飽きづらく、最後まで読み終えられる構成

🟡 土日の2日間を使えば終わる分量

🟡 自信をもってReact + TypeScriptコードが書けるようになる一冊

🟩「TypeScriptだけ」、あるいは「Reactだけ」にフォーカスした書籍はいくつもありますが、本書のように「TypeScriptをReactで使う」という点に重点を置いた本はほぼありません。

🟩「TypeScriptをReactで使う」にフォーカスした本書で、2024年の必須スキルを身につけましょう。


【対象読者

🔶 2024年のReact開発現場スタンダードのスキルを身につけたい人

🔶 理論重視ではなく、手を動かす実践ベースで学習を進めたい人

🔶 Reactの基礎を学習した人

🔶 Reactアプリを数回作ったことのある人

🔶 TypeScriptのコードは複雑でむずかしいと感じている人

🔶 TypeScript初心者〜中級者

🔶 TypeScriptのコードを「なんとなく」書いている人

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

発売日】
2024年3月14日

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

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

🔷BASEショップ(本サイト)
https://monotein.base.shop/items/84090644

🔷Note
https://note.com/monotein/n/n62b9bada87f4

🔷楽天
https://books.rakuten.co.jp/rk/2eed4efeb7313fa0a27b2dc90dd3e53d/

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

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

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

• 「TypeScriptマスター with React(本書)」の文字数:166, 833
• 「はじめてつくるReactアプリ with TypeScript」の文字数:97,919

*本書はPDFファイルでのご提供となります(224ページ/A5サイズ)

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

著者:三好アキ

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

くわしい収録内容

🔷 プログラミング言語の役割/TypeScriptを使う理由/TypeScriptにむずかしさを感じる理由/JavaScriptとTypeScriptの違い/動的型付け言語と静的型付け言語/データの種類と形/オブジェクト/配列/プリミティブ/Reactの復習(function/コンポーネントの記法/分割代入)


🔷 React + Vite + TypeScriptのセットアップ/型定義の書き方/useStateの型/propsの型/分割代入したpropsの型の記法/◆ イベントの型/イベントの型の記法/functionの型の構造/非同期処理の型/型を確認する方法/型推論/any型/複雑な構造をしたデータの型/Layoutコンポーネント/ローディングの設定/childrenの型/JSX.Element/React.ReactNode/React.ReactElement/デプロイ(Netlify)


🔷 TypeScriptの開発環境セットアップ/TypeScriptのコンパイル方法/TypeScriptとJavaScriptのコード比較/tsconfig.jsonの設定/interfaceとtypeの違い/配列の型定義/インターセクション型/lookup型


🔷 タプル型/ユニオン型/リテラル型/型引数/ジェネリクス/ジェネリクスの記法(Arrow function)/型ガード/ナローイング/

ページ設定/useStateでオブジェクトを扱う方法/Local Storage/イベント・オブジェクトの型/ログイン状態の維持の仕組み/ログイン状態によって表示を変える/useEffectの働き/非Nullアサーション/Reactコンポーネントの汎用化/柔軟な型を定義する方法/非同期処理/型定義を共有する方法


🔷 型の確認方法/CSSProperties/ComponentProps/ComponentPropsWithoutRef/restオペレーター/functionの型定義/型アサーション(as)/as const/anyとunknown/Type Utility/Pick/Omit/Partial/Required/Record/ジェネリクス/インデックス・シグネチャ/enum

目次

🔷 はじめに

P.4 ― 本書のねらい

P.4 ― 本書の対象読者

P.5 ― 本書の構成

P.6 ― コードのダウンロードと本書で使うツール

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

P.7 ― Node.js

P.7 ― npm

P.8 ― VS Code

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


🔷 第1章 TypeScriptについて知ろう

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

P.9 ― この章ですること

P.10 ― データとTypeScript

P.12 ― TypeScriptをむずかしいと感じる理由

P.13 ― TypeScriptの追加機能

P.16 ― Reactの予備知識(コンポーネントとfunctionの記法)


🔷 第2章 TypeScriptでReactアプリを開発しよう その1

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

P.22 ― この章ですること

P.23 ― 開発ツールのインストール(React + Vite + TypeScript)

P.27 ― ReactコンポーネントをTypeScriptで書く

P.40 ― アプリの構成を確認する

P.45 ― イベントとfunctionに型をつける その1

P.53 ― イベントとfunctionに型をつける その2

P.61 ― 複雑な構造のデータに型をつける

P.70 ― フォームの入力文字を消す

P.72 ― 画像とCSSを追加する

P.74 ― ローディングを追加する

P.76 ― childrenに型をつける

P.84 ― アプリをオンラインで公開する(デプロイ)

🔷 第3章 TypeScriptだけを使ってみよう

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

P.85 ― この章ですること

P.86 ― TypeScriptの開発セットアップ

P.91 ― 配列の型定義

P.92 ― typeとinterface

P.94 ― 入れ子になった型定義(lookup型)

🔷 第4章 TypeScriptでReactアプリを開発しよう その2

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

P.95 ― この章ですること

P.96 ― アプリの構造の確認

P.101 ― ツールの準備とクリーンアップ

P.102 ― ページとルーティングの準備

P.107 ― ユーザー登録機能を開発する

P.119 ― ログイン機能を開発する

P.127 ― 複数のデータを受け取るコンポーネントを開発する

P.144 ― 柔軟な型を定義してコンポーネントを汎用化する

P.150 ― 外部データを取得するコンポーネントを開発する

P.158 ― ローディングとボタンを開発する

P.165 ― 複数の型定義をひとつのコンポーネントで使う方法

P.178 ― CSSと画像を追加する

P.181 ― アプリをオンラインで公開する(デプロイ)


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

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

P.182 ― この章ですること

P.183 ― セットアップ

P.184 ― 型の確認方法

P.185 ― CSSProperties

P.188 ― ComponentProps

P.191 ― 引数とreturnがあるfunctionの型定義

P.193 ― 型アサーション(as)

P.195 ― as const

P.199 ― ユーティリティタイプ(Type Utility)

P.203 ― anyとunknownの違い

P.205 ― ジェネリクス

P.218 ― インデックス・シグネチャ(Index Signature)

P.220 ― enum

P.221 ― あとがき
P.223 ― 関連書籍

P.224 ― 著者について