前回のブログ に書いたように、Reactの欠点は、導入時の学習コストの高さだと思います。今回はそのへんに付いて書いてみます。
いくつかの問題は現時点では解決していますが、以前 React を学ぼうとして失敗した時の印象が残っている人もいるかと思います。
開発環境の構築が難しい
私が 「作りながら学ぶ React 入門」 を書いた時点では、Reactを学ぼうという人がネット上の情報を見て開発環境を作ろうとしても動かない事が良くありました。
webpack も出始めで仕様が頻繁に変わりましたし、Bebel, ESLint 等のツールも頻繁にバージョンアップしていて一次情報(英語ページ)にアクセスしないと上手く環境が構築出来ませんでした。
しかし、現在は React開発元の Facebook が create-react-app をリリースし簡単に Reactの学習が簡単に出来るようになりました。
また、webpack も安定し、ネット上にもたくさんの情報が広がり導入コストは低くなったと思います。
公式サイトが日本語化されてなかった
日本以外で生まれた新しい技術のサイトが英語なのは当たり前な事で、現在のプログラマーは英語のサイトを使えないと生きて行けません。
とは言え大抵の日本人プログラマーには日本語サイトが無い事は、学習の第一歩には厳しいかもしれません。
しかし、2019年5月に多数のボランティアにより公式サイトに日本語ページが出来ました。 素晴らしい！
JSX
ReactではHTML作成の部分に JSX(XML-like syntax extension to ECMAScript)という、従来の View(HTML)作成に使われ来たテンプレートとは大きく違う方式を使っています。
JSXはプログラマーには抵抗が少ないかもしれませんが、Webデザイナーには敷居が高い部分があります。開発体制で問題になる、プログラマーとデザイナーとの協業がしづらい部分でもあります。
フレームワーク的なライブラリー
ReactはView(表示)構築用ライブラリーと呼ばれています。しかしコンポーネントの状態(state)の扱いに付いては特別視していてReactの流儀を強要されます。
Reactはフレームワークではないいう立場を取っていますが、フレームワーク的にコーディングスタイルが強要されます。また state を本質を理解せずに使おうとすると、思った通りに動かずに悩むと思います。このような強要は嫌だと思う人もいると思います。
コード量が増える
他のSPAフレームワークに比べ、コード量が増える傾向があります。これは上に書いた JSX や state の扱いも関連します。
ただし Hooks 等が追加され、 React.Componetクラスを継承する必用が無くなりコード量は減ってきました。 また ES6 の分割代入(Destructuring assignment) や スプレッド構文 を上手く使うコーディングスタイルも広まりコンパクトなコードを書く事に役立っています。
Redux
Reduxが登場して際に、その概念の素晴らしさから Reactを使うなら当然 Redux と一種に使うべきだ！ というブログが大量に書かれ・翻訳されました。
それに感化され、Reactと同時にReduxを学び、Reduxの複雑さから React の導入を諦めてしまった人もいるかと思います。
その後 あなたはReduxを必要としないかもしれない – You Might Not Need Redux by Dan Abramov のようなブログも書かれ、Reactの導入に Redux が必須でないことも広まって来たように思います。
宣伝
これらの学習コストの高さの解決には EY-Officeの教育もご検討下さい。導入を躊躇している方も 気軽に ご相談 下さい。
