Reactビギナーズガイド ―コンポーネントベースのフロントエンド開発入門

Reactビギナーズガイド ―コンポーネントベースのフロントエンド開発入門

by Stoyan Stefanov, 牧野 聡
Released March 2017
Publisher(s): O'Reilly Japan, Inc.
ISBN: 9784873117881

Read it now on the O’Reilly learning platform with a 10-day free trial.

O’Reilly members get unlimited access to books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial

Book description

Reactでは小さくて管理が容易なコンポーネントを組み合わせて、大きくて強力なアプリケーションを作成できます。本書の前半は入門編で、簡単なサンプルを使いながらReactの基本やJSXについて学びます。後半は、実際のアプリケーション開発に必要なものや開発を助けてくれるツールについての解説です。具体的には、JavaScriptのパッケージングツール（Browserify）、ユニットテスト（Jest）、構文チェック（ESLint）、型チェック（Flow）、データフローの最適化（Flux）、イミュータブルなデータ（immutableライブラリ）などを取り上げます。対象読者は、ES2015（ES6）の基本をマスターしているフロントエンド開発者。

Table of contents

  1. 　大扉
  2. 　原書大扉
  3. 　クレジット
  4. 　献辞
  5. 　まえがき
  6. 　　本書の構成
  7. 　　サンプルコードの使用について
  8. 　　意見と質問
  9. 　　表記上のルール
  10. 　　謝辞
  11. 第1部　基礎
  12. 　1章　Hello world
  13. 　　1.1　セットアップ
  14. 　　1.2　ハロー、Reactワールド
  15. 　　1.3　内部で起こっている処理
  16. 　　1.4　React.DOM.*
  17. 　　1.5　特別なDOMの属性
  18. 　　1.6　ブラウザの拡張機能（React Developer Tools）
  19. 　　1.7　予告：カスタムコンポーネント
  20. 　2章　コンポーネントのライフサイクル
  21. 　　2.1　最低限の構成
  22. 　　2.2　プロパティ
  23. 　　2.3　propTypes
  24. 　　　2.3.1　プロパティのデフォルト値
  25. 　　2.4　ステート
  26. 　　2.5　ステートを持ったテキストエリアのコンポーネント
  27. 　　2.6　DOMのイベント
  28. 　　　2.6.1　従来のイベント処理
  29. 　　　2.6.2　Reactでのイベント処理
  30. 　　2.7　プロパティとステート
  31. 　　2.8　初期状態をプロパティとして渡す（アンチパターン）
  32. 　　2.9　外部からコンポーネントへのアクセス
  33. 　　2.10　プロパティの事後変更
  34. 　　2.11　ライフサイクルのメソッド
  35. 　　2.12　ライフサイクルの例：すべてをログに記録する
  36. 　　2.13　ライフサイクルの例：ミックスイン
  37. 　　2.14　ライフサイクルの例：子コンポーネントの使用
  38. 　　2.15　パフォーマンスの向上：コンポーネントの更新を阻止する
  39. 　　2.16　PureRenderMixin
  40. 　3章　<Excel>：高機能な表コンポーネント
  41. 　　3.1　まずはデータから
  42. 　　3.2　表のヘッダーを描画するループ
  43. 　　3.3　コンソールに表示された警告への対応
  44. 　　3.4　<td>のコンテンツの追加
  45. 　　　3.4.1　コンポーネントへの機能追加
  46. 　　3.5　並べ替え
  47. 　　　3.5.1　コンポーネントへの機能追加
  48. 　　3.6　並べ替えの矢印
  49. 　　3.7　データの編集
  50. 　　　3.7.1　編集可能なセル
  51. 　　　3.7.2　入力フィールドのセル
  52. 　　　3.7.3　データの保存
  53. 　　　3.7.4　まとめと仮想DOMの差分
  54. 　　3.8　検索
  55. 　　　3.8.1　ステートとUI
  56. 　　　3.8.2　コンテンツのフィルタリング
  57. 　　　3.8.3　検索への機能追加
  58. 　　3.9　操作手順の再実行
  59. 　　　3.9.1　再生への機能追加
  60. 　　　3.9.2　別の実装方法
  61. 　　3.10　表データのダウンロード
  62. 　4章　JSX
  63. 　　4.1　ハロー、JSX
  64. 　　4.2　JSXのトランスパイル
  65. 　　4.3　Babel
  66. 　　4.4　クライアント側でのトランスパイル
  67. 　　4.5　JSXでのトランスパイル
  68. 　　4.6　JSXでのJavaScript
  69. 　　4.7　JSXでの空白
  70. 　　4.8　JSXでのコメント
  71. 　　4.9　JSXでのHTMLエンティティ
  72. 　　　4.9.1　XSS対策
  73. 　　4.10　スプレッド演算子
  74. 　　　4.10.1　親から渡された属性とスプレッド演算子
  75. 　　4.11　複数のノードの生成
  76. 　　4.12　JSXとHTMLの違い
  77. 　　　4.12.1　classとforは指定できない
  78. 　　　4.12.2　styleにはオブジェクトを指定する
  79. 　　　4.12.3　閉じタグは必須
  80. 　　　4.12.4　キャメルケースの属性名
  81. 　　4.13　JSXとフォーム
  82. 　　　4.13.1　onChangeハンドラ
  83. 　　　4.13.2　valueとdefaultValue
  84. 　　　4.13.3　<textarea>の値
  85. 　　　4.13.4　<select>の値
  86. 　　4.14　JSX版のExcelコンポーネント
  87. 第2部　実践
  88. 　5章　開発環境のセットアップ
  89. 　　5.1　アプリケーションのひな型
  90. 　　　5.1.1　ファイルとフォルダー
  91. 　　　5.1.2　index.html
  92. 　　　5.1.3　CSS
  93. 　　　5.1.4　JavaScript
  94. 　　　5.1.5　モダンなJavaScript
  95. 　　5.2　必要なソフトウェアのインストール
  96. 　　　5.2.1　Node.js
  97. 　　　5.2.2　Browserify
  98. 　　　5.2.3　Babel
  99. 　　　5.2.4　Reactなど
  100. 　　5.3　ビルドの実行
  101. 　　　5.3.1　JavaScriptのトランスパイル
  102. 　　　5.3.2　JavaScriptのパッケージング
  103. 　　　5.3.3　CSSのパッケージング
  104. 　　　5.3.4　ビルドの結果
  105. 　　　5.3.5　開発と同時のビルド
  106. 　　5.4　デプロイ
  107. 　　5.5　これからの作業
  108. 　6章　アプリケーションのビルド
  109. 　　6.1　Whinepadバージョン0.0.1
  110. 　　　6.1.1　セットアップ
  111. 　　　6.1.2　コーティングの開始
  112. 　　6.2　コンポーネント
  113. 　　　6.2.1　セットアップ
  114. 　　　6.2.2　コンポーネント一覧
  115. 　　　6.2.3　<Button>コンポーネント
  116. 　　　6.2.4　Button.css
  117. 　　　6.2.5　Button.js
  118. 　　　6.2.6　フォーム
  119. 　　　6.2.7　<Suggest>コンポーネント
  120. 　　　6.2.8　<Rating>コンポーネント
  121. 　　　6.2.9　ファクトリーとなる<FormInput>コンポーネント
  122. 　　　6.2.10　<Form>コンポーネント
  123. 　　　6.2.11　<Actions>コンポーネント
  124. 　　　6.2.12　<Dialog>コンポーネント
  125. 　　6.3　アプリケーションの設定
  126. 　　6.4　<Excel>コンポーネント（改良版）
  127. 　　6.5　<Whinepad>
  128. 　　6.6　全体をまとめる
  129. 　7章　品質チェック、型チェック、テスト、そして繰り返し
  130. 　　7.1　package.json
  131. 　　　7.1.1　Babelの設定
  132. 　　　7.1.2　スクリプト
  133. 　　7.2　ESLint
  134. 　　　7.2.1　セットアップ
  135. 　　　7.2.2　実行
  136. 　　　7.2.3　ルール全体
  137. 　　7.3　Flow
  138. 　　　7.3.1　セットアップ
  139. 　　　7.3.2　実行
  140. 　　　7.3.3　型チェックのための準備
  141. 　　　7.3.4　<Button>の修正
  142. 　　　7.3.5　app.js
  143. 　　　7.3.6　プロパティとステートの型チェックに関する補足
  144. 　　　7.3.7　型のインポートとエクスポート
  145. 　　　7.3.8　型変換
  146. 　　　7.3.9　インバリアント
  147. 　　7.4　テスト
  148. 　　　7.4.1　セットアップ
  149. 　　　7.4.2　最初のテスト
  150. 　　　7.4.3　Reactでのテスト
  151. 　　　7.4.4　<Button>のテスト
  152. 　　　7.4.5　<Actions>のテスト
  153. 　　　7.4.6　その他の操作のシミュレーション
  154. 　　　7.4.7　インタラクション全体のテスト
  155. 　　　7.4.8　カバレージ
  156. 　8章　Flux
  157. 　　8.1　考え方の要点
  158. 　　8.2　Whinepadの見直し
  159. 　　8.3　Store
  160. 　　　8.3.1　Storeでのイベント
  161. 　　　8.3.2　<Whinepad>からStoreを利用する
  162. 　　　8.3.3　<Excel>からStoreを利用する
  163. 　　　8.3.4　<Form>からStoreを利用する
  164. 　　　8.3.5　Storeとプロパティの使い分け
  165. 　　8.4　Action
  166. 　　　8.4.1　CRUDのAction
  167. 　　　8.4.2　検索と並べ替え
  168. 　　　8.4.3　<Whinepad>からActionを利用する
  169. 　　　8.4.4　<Excel>からActionを利用する
  170. 　　8.5　Fluxのまとめ
  171. 　　8.6　イミュータブル
  172. 　　　8.6.1　イミュータブルなStoreのデータ
  173. 　　　8.6.2　イミュータブルなデータの操作
  174. 　カバーの説明
  175. 　著者紹介
  176. 　奥付

Product information

  • Title: Reactビギナーズガイド ―コンポーネントベースのフロントエンド開発入門
  • Author(s): Stoyan Stefanov, 牧野 聡
  • Release date: March 2017
  • Publisher(s): O'Reilly Japan, Inc.
  • ISBN: 9784873117881

You might also like

book

Pythonではじめる機械学習 ―scikit-learnで学ぶ特徴量エンジニアリングと機械学習の基礎

by Andreas C. Muller, Sarah Guido, 中田 秀基

Pythonの機械学習用ライブラリの定番、scikit-learnのリリースマネージャを務めるなど開発に深く関わる著者が、scikit-learnを使った機械学習の方法を、ステップバイステップで解説します。ニューラルネットを学ぶ前に習得しておきたい機械学習の基礎をおさえるとともに、優れた機械学習システムを実装し精度の高い予測モデルを構築する上で重要となる「特徴量エンジニアリング」と「モデルの評価と改善」について多くのページを割くなど、従来の機械学習の解説書にはない特長を備えています。

book

アルゴリズムクイックリファレンス 第2版

by George T. Heineman, Gary Pollice, Stanley Selkow, 黒川 利明, 黒川 洋

実用上、本当に速いコードを書くにはまず正しいアルゴリズムの選択から。本書は実践的側面を重視した、新しいタイプのアルゴリズム事典です。どのアルゴリズムを使うべきか、どう実装するのか、さらに性能を向上させる方法はあるのかを解説。主要な40余りのアルゴリズムを網羅し、C、C++、Java、Pythonでの実装例を示します。改訂版では、フォーチュンアルゴリズム、マージソート、マルチスレッドクイックソート、AVL平衡二分木、R木と四分木などの新たなアルゴリズムを追加。実際にベンチマークを取る手法も紹介した実際的、実践的な一冊です。

book

インタラクティブ・データビジュアライゼーション ― D3.jsによるデータの可視化

by Scott Murray, 長尾 高弘

D3は、ウェブページにロードしたデータからビジュアルを生成するJavaScriptベースのツールです。本書は、プログラマではない人々を対象として、D3を使ったデータビジュアライゼーションのプログラミングについて解説しています。ビジュアルのスキルはあるもののデータやコードをいじったことがないアーティストやグラフィックデザイナ、または大量のデータを持っているがビジュアルやコードを相手にしたことがないジャーナリストや研究者などには、本書が大いに役立つでしょう。もちろん、データの可視化について学びたい読者にもおすすめします。

book

初めてのTypeScript ―型安全なJavaScriptでWeb開発を加速する

by Josh Goldberg, 今村 謙士, 原 隆文

TypeScriptの本格的な入門書。TypeScriptは、世界で最もよく使われ、かつ最も好まれているプログラミング言語の1つです。本書では、JavaScriptの基礎的な知識のあるプログラマーを対象に、「型」や「型システム」の基本から、明快かつ包括的にTypeScriptを解説します。TypeScriptはバグやタイプミスを防ぎ、コードを読みやすくするのに有用なだけでなく、JavaScriptがどのように動くべきかを宣言し、それを維持するのに役立つ優れたシステムです。読者は本書を読むことで、TypeScriptの基礎と最も重要な機能をマスターできるでしょう。