最初の3匹であるヒトカゲ、ゼニガメ、フシギダネ。
「3匹しか残っとらんが、お前に1匹やろう！さあ、選べ！」
皆さんはどのポケモンを選んでましたか？
僕は見た目重視でヒトカゲ一択でしたね！おかげでタケシのイワークには苦労しましたけど。。
というわけで冒頭からいきなり話が逸れてしまいましたが、
今回は、JavaScriptの3大フレームワークの一つであるReactが他フレームワークとどう違うのかについて解説していきます。
色合い的には、
- Angular → ヒトカゲ
- React → ゼニガメ
- Vue.js → フシギダネ
といった感じですかね。
僕もどの技術を選択するか迷いましたが、結果、ゼニガ…じゃなくて「React」を選びました！
その理由も当記事で紹介したいと思います。
- React・Angular・Vueのどれを学ぶか迷っている人
- それぞれの特徴がいまいちピンときていない人
- Reactがどうやって誕生したか知りたい人
では早速見ていきましょー！
目次
3大フレームワークの比較
ではまず3大フレームワークと言われている各技術について、誰が開発しているのか、どんな特徴なのかを簡単に説明します。
Angular
Angularは「Google」とコミュニティによって開発されていて、日本にも公式コミュニティが存在しています。
Angularは、必要なモジュールが一通り揃ったフルスタックフレームワークであることが特徴です。
基本的には公式が用意してくれたものを使えばいいのでモジュール管理が楽だということが一番メリットではないかと思います。
それゆえ、企業や大規模開発で採用される傾向にあります。
Vue.js
Vue.jsは「Evan You」という中国の方が開発者で、Angularと同様、公式コミュニティによって開発されています。
Vue.jsは、AngularJSから必要最低限の機能だけに絞った軽量なフレームワークであることが特徴です。
元々Evan You氏はGoogleで勤務されており、AngularJSの開発には携わっていないものの、もっと軽量なフレームワークにできないか？とはじめたのがVue.jsです。
AngularJSやReactの機能をいいとこどりしたフレームワークで、日本語ドキュメントが豊富なこともあり、初学者にはとっつきやすいフレームワークとして人気があります。
ただ、軽量なフレームワークゆえに大規模開発にはあまり向かない意見もあります。
React
Reactは、「Facebook」によって開発され、創始者はFacebookの社員である「Jordan Walke」という方です。
Reactでは仮想DOMという技術が使われ、更新された部分のみが変更されます。
通常だと一部が変更されるとページ全体が更新されてしまいますが、この仮想DOMのおかげで最小限の更新で済み、高速で描画されるのでレスポンスがよくなるというのが特徴です。
また３大フレームワークと呼ばれていますが、厳密にはReactはフレームワークではなく、ライブラリです。
もう少しわかりやすくすると、
- フレームワーク＝おでんセット
- ライブラリ＝大根・こんにゃく・たまご・ちくわ etc…
といった感じですね！
アプリケーションを動かすために必要な機能が初めから一通り用意されているものがフレームワークで、一方のライブラリは必要に応じて機能をインストールして利用するという違いがあります。
フレームワークの方がすぐ使えて便利じゃないか！というのも一理ありますが、ライブラリだと開発アプリによって柔軟に対応できるというのがメリットです。
これがAngularとVue.jsとの大きな違いですね。
どうやってReactは誕生したのか
せっかくなので、Reactがどうやって生まれたのかを少し深掘りしてみます。
Facebookには「BoltJS」というMVCフレームワークがあり、広告用のアプリケーション構築に使用されていました。
Jordan Walke氏がBoltJSの欠点を改善するため、個人のGitHubリポジトリでReactの全身である「FaxJS」の開発を始めました。
経緯としては、Vue.jsの創始者であるEvan You氏と似ていますね！
「FaxJS」の「F」は、コンポーネントを関数型プログラミング（Functional Programming）で書くBoltJSの改良版という意味とFaxJSへのオマージュで命名しました。
詳しくは「Our First 50,000 Stars（最初の5万スターを獲得するまで）」という記事に書かれていますので、全貌を知りたい方は覗いてみてください！
僕がReactを選んだ理由
3大フレームワークがどんなものかわかったところで、なぜ僕はReactを選んだのかについて説明します。
ざっくりと以下の理由で決めました。
ロゴがカッコいい
そんなことが理由なの？って言われちゃいそうですが、重要なポイントですよ！
スタイリッシュでクールなReactのロゴが好きな開発者は少なくないはず。
ちなみに初めてReactを一般公開したときの公式サイトをデザインしたのはInstagramのデザイナーさんだったんですが、その際に核反応をイメージしてReactのロゴも作ったそうです。
通りでロゴがカッコいいわけですね〜。
トップシェアなので情報が豊富
やはり人気があるということはそれだけ情報が多くあり、学習を有利に進められるのが大きいですね。
npm trendsが3大フレームワークのダウンロード数を公表してくれている通り、2021年1月3日時点でReactが圧倒的にトップとなっています。
- オレンジ：React
- ブルー：Angular
- グリーン：Vue.js
npm trends(@angular/core vs react vs vue)
ネイティブアプリも作りたい
僕はWebアプリ開発も好きなのですが、いずれはネイティブアプリ開発もやりたいなーと考えています。
ネイティブアプリというのは、AndroidやiPhoneなどで動作するアプリのことです。
今まではAndroidならばKotlin、iPhoneならばSwiftといった、それぞれのプログラミング言語の技術が必要でした。
ですが、昨今ではクロスプラットフォームと呼ばれる、AndroidでもiPhoneでも同じプログラミング言語で開発できる技術が勢いを増しています。
Googleが開発しているFlutterやFacebookが開発しているReact Nativeなどが代表的ですね。
Reactを学んでおけば、React Nativeを学ぶ時に学習コストを減らすことができるよなーと思ったわけです。
最後に
いかがだったでしょうか。
アーキテクチャーの思想に賛同できるかどうか、開発アプリの規模がどれくらいなのかなどによって、選ぶ技術は変わってくるかと思います。
最初の3匹とは違い、途中で乗り換えることもできるので気軽に始めてみるといいかもしれません！
僕はあくまでReact推しですが！！
当記事で技術選定の助けになれば嬉しい限りです。
以上、
【React、君に決めた！】Reactと他フレームワークを比べてみる
をお送りしましたー！
