あらすじ
有名なJavascriptのフレームワークといえば、まず上げられるのがJQueryではないでしょうか。
しかし、Javascriptのフレームワークには他にも多数あり、その中でも3大フレームワークと呼ばれるものがあります。
それが
- React.js
- Vue.js
- Angular.js
です。
今回はこの3つに焦点を当てて、それぞれの歴史や特徴、メリット・デメリットを徹底比較していきたいと思います。
Javascriptのフレームワーク
CSSでいうところのBootstrapのようなものです。
CSSのフレームワークについてはこちらfa-arrow-circle-down
Javascriptのフレームワークには大きく分けて2種類
Javascriptのフレームワークには大きく分けて2種類あります。
フロントエンド用のフレームワークとバックエンド用のフレームワークです。
フロントエンド用のフレームワークには、上記でも言及しました
- JQuery
- React.js
- Vue.js
- Angular.js
といったものがあり、バックエンドにはNode.jsと呼ばれるフレームワークがあります。
今回はフロントエンドの中でも世界中で利用されており、Javascript三大フレームワークと呼ばれる
- React.js
- Vue.js
- Angular.js
について、徹底比較していきたいと思います。
Github内での3大Javascriptフレームワークの比較
React.js
まずは海外で一番人気があるReact.js(リアクト・ジェーエス)。
フロントエンドで利用されるJavascriptのライブラリです。
主に(UI)ユーザーインターフェースの構築に使われます。
React.jsの歴史
2013年の5月にFacebookのエンジニア、Jordan Walker(ジョーダン・ウォーカー)さんによって開発されました。
現在ではFacebookの他に、多くの企業やコミュニティによってその技術が管理されており、更新も都度行われています。
React.jsの特徴
React.jsはSPAやモバイルアプリで利用されることが多いです。
SPAを利用することでページを毎度更新する必要がないので、UXの向上が大幅に上がります。
また、React Nativeと呼ばれる、AndroidやiOS用のモバイルアプリ開発のために利用されるフレームワークも存在します。
Component(コンポーネント)と呼ばれる要素ごとに分けることができ、管理がしやすくカスタマイズしやすい特徴があります。
React.jsを実際に利用している企業
実際にReact.jsを利用して自社のwebサイトを開発している企業は数多くあります。
中でも有名なところでいうと
- Yahoo
- New York Times
- Netflix
- AirBnB
などが挙げられます。
React.jsのメリット
- コンポーネント単位で管理ができるため、カスタマイズがしやすい。
- SPAに特化しているため、他のフレームワークに比べてSPAが作りやすい。
- 世界中で人気のあるフレームワークなので、React.jsを使えるだけで海外勤務もできる可能性が高まる。
- Angular.jsとは違い、利用者人口が右肩上がり。
React.jsのデメリット
- コンポーネントが増えすぎると管理が難しい。
- Component を作る際にClass component(クラス・コンポーネント)とFunctional component(関数・コンポーネント)の2種類があるのでややこしい。
- Functional componentが最新の技術ですが、ネットで検索すると大概class componentで書かれていることが多いです。
- 勉強するのに時間がかかる。
React.jsを学ぶ際におすすめな書籍fa-arrow-circle-down
Vue.js
続いてVue.js(ビュー・ジェーエス)について。
海外でもReact.jsと同じくらい人気のあるJavascriptのフレームワークです。
React.js同様(UI)ユーザーインターフェースの構築に使われます。
Vue.jsの歴史
2014年2月にGoogleのEvan You(エヴァン・ユー)さんによって開発されました。
他のフレームワークの中では一番歴史が浅いですが、その人気は年々高まっています。
Vue.jsの特徴
React.jsやAngular.jsに比べると比較的シンプルで利用がしやすく、他のフレームワークに比べてルールが柔軟なため、開発者の好みにアプリ開発ができるようになっています。
DirectiveというView.js独自の属性があり、HTMLなどの要素を比較的簡単に操作することができます。
React.jsと同様にComponent指向であり、小規模なプロジェクトに向いています。
Vue.jsを実際に利用している企業
- Nintendo
- Louis Viton
- Slack
- Apple
- BMW
Vue.jsのメリット
- React.jsやAngular.jsに比べて難易度は低めなため、習得まで時間はかからない。
- 小規模のアプリ制作時にその力を発揮する。
- 高機能なSPAを作ることができる。
- Javascriptを事前に知っていれば、習得は比較的容易。
- コード数が他のフレームワークに比べて少ない。
Htmlタグをそのまま利用することが可能。
Vue.jsのデメリット
大規模アプリ作成のプロジェクトの際は効率が悪い。
Vue.jsを学ぶ際におすすめな書籍fa-arrow-circle-down
Angular.js
最後にAngluar.jsについて。
こちらもフロントエンドで利用されるJavascriptのライブラリで、他のフレームワーク同様(UI)ユーザーインターフェースの構築に使われます。
Angluar.jsの歴史
上記3つのフレームワークの中で、歴史が一番古いフレームワークです。
2009年にGoogleの他に個人やコミュニティによって開発されました。
また、2016年にはAngular.jsにとって変わるAngularがリリースされました。
Javascriptを利用していたAngular.jsとは違いAngularはTypescriptを推奨言語としています。
Angluar.jsの特徴
フルスタック対応しているので、大規模プロジェクトに向いており、初期の段階から必要な機能が備わっているのがAngular.jsの大きな特徴の一つです。
また、他のフレームワークに比べて歴史が古く、いまだに多くの人に利用されています。
Angluar.jsを実際に利用している企業
- Microsoft
- Forbes
- Paypal
- Samsung
- Delta
Angluar.jsのメリット
- フルスタック対応している。
- 大規模なアプリを作成の際に、必要な機能が最初から備わっているため、他のフレームワークに比べて効率よく作成できる。
Angluar.jsのデメリット
- Javascriptのみならず、Typescriptについての知識が必要。
- 他のフレームワークに比べて難易度が高め。
- 学習時間に時間がかかる。
- React.jsやVue.jsの人気の方が高まっている。
Angular.jsを学ぶ際におすすめな書籍fa-arrow-circle-down
まとめ
いかがだったでしょうか。
JavascriptのフレームワークはCSSなどのフレームワークとは違い習得まで比較的時間がかかります。
全てできるに越したことはありませんが、どれか一つを極めて、他のフレームワークを学習する方法がベストではないかと感じます。
ぜひ、この比較結果を元に自分に合ったフレームワークを選んでみてください。
