「React開発入門」レビュー

書籍について

タイトル WebデベロッパーのためのReact開発入門 JavaScript UIライブラリの基本と活用
著者 著: 柴田 文彦
発行日 2016/12/01
ページ数 231ページ
価格 2500円
Amazon https://www.amazon.co.jp/dp/4295000337
読了日 2017/03/15

評価

良い点

  • Reactに関して基本的なことが整理されている
  • コード例の構成が全体的に一貫しており、理解しやすい
  • コード例はWebでダウンロードできるので、コード写経もしやすかった
  • React用Chrome拡張の使い方も掲載されており、これがかなり使いやすい。巻末だったが最初に掲載するべき

悪い点

  • 説明が冗長。一度説明した内容をほぼ同じようにまた説明するということがチラホラ
  • 説明がコードの内容をそのまま和訳したようなモノが多い。コードと実行結果を見れば説明を読む必要がない感じ
  • 応用的な例がほぼ無い。Reactがどんなものかはわかったが、それによってどんな楽が出来るかが伝わらない
  • 元々ページ数が少ない上、説明が冗長的なので事実上のコンテンツ量はかなり少ない
  • それで2500円はちょっと

その他

  • 序盤はJSX不使用だが、中盤以降はJSXが必須
  • JSX自体の説明に結構なページ数を割いている
  • Fluxに関しては巻末で簡単に説明する程度

内容とメモなど

1. Reactとは

Reactに関する概要がズラッと書かれている。Reactにおけるキーワード、専門用語も一通り書かれているので、最初に一読、最後にもう一読すると良さそう

JavaScriptフレームワーク全体でのReactの位置付けについても触れているが、比較対象がAngularしか無いのは少し寂しい

2. Reactのコンポーネント

Reactの基本的な使い方全般。この章ではJSXは使われておらず、純粋なReactの機能だけでReactコンポーネントを構築している。

順を追って読んでいるとなんだか不便だなと感じるが、次章でJSXが登場すると突然便利さを感じることができるので、すぐにJSXに飛びつかずにこの章をしっかりやると良さそう

3. JSXの基本

JSXに関する説明、JSXの利用方法、JSXを用いたReactコードの書き方をそれなりのページ数を割いてまとめている。

基本的には前章で作成したコードをJSXを用いたものに書き換えることで、JSXがどれほど便利なのかを主張している。

個人的に、通読前はJavaScript内にXMLが突然あらわれることに強い抵抗を持っていたが、この章を読んでみるとJSXなしのReactは考えられないなと思った

4. Reactを使いこなす

本章では、フォーム要素を対象に、プロパティやステート、単方向データバインディングなど、Reactの具体的な部分に触れている。

Angularの双方向データバインディングに慣れていた自分にとってはすんなり受け入れられたが、そうでもない人にとってはかなり違和感のある章だと思う

5. Reactの一歩進んだ使い方

本章では、以下のようなReact本体ではない外側の要素について触れている

  • アドオン
  • React DeveloperTools
  • Flux

どれも触り程度で具体的な内容はほぼ書かれていないが、React自体に慣れ、ステップアップを詰むためのヒントとなる内容がかかれている。意欲のある人が本書をきっかけに次のステップに進むための足掛けになるとは思う。

所感

本書でなくReactを使ってみた感想

  • 全体的に「あ、この動き、Angularで見たやつだ」となる部分が多かった
  • その上でもReactはUI操作に特化しているので、Angularだけではできそうにない実装ができそう
  • JavaScript中にXMLを書くのに強い抵抗があったが、やってみると別に気にならなくなった
  • JavaScript中にXMLを書くため、デザイナとの作業の分離が難しくなる気はする
  • システム全体で使うよりも、システム内の、UI色の強い一部機能にのみ採用するという使い方ができそう
  • ReactというよりVirtualDOMの考えがスゴイんだ
  • サードパーティ製のアドオンが豊富なようなので、スタイリッシュなUIなど探せば沢山ありそう
  • ChromeのReact Developer Toolsがスゴイ。これはデバッグも捗るし使ってて楽しい
  • jQueryという闇を払拭できそう

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です