JavaScript系のフレームワークを学ぶなら、React、Vue、Angular、jQueryのどれがいいかまとめてみました！

 

端的に

• React：アプリエンジニアとして複雑なことがしたいならこれ！
• Vue：少人数で書きたいならこれ！
• Angular：大人数チームに入るならこれ！
• jQuery：デザイナーとしてモーションを入れたいならこれ！

 

補足

出身分野別おすすめ結論

React

元々機能多めのWebアプリを書いていたフロントエンジニアやアプリエンジニア出身の方におすすめ。

• 良くも悪くも周辺ライブラリの選択肢が多いためカスタマイズ性は抜群で有名ライブラリはほぼほぼ対応している
• React Nativeもある程度読めるようになるため、アプリエンジニアへの転生も比較的容易
• 日本と中国以外はほぼReact一強のため、オープンソース開発への参加や外資系企業への就職なども選択肢に
• 結果、 複雑なアプリを書くのに向いている

Vue

HTML、CSS、シンプルなJavaScriptを書いていたコーダー出身におすすめ。

• Reactに比べるとシンプルに書けるよう作られていて、本格的なアプリを初めて書く人からすると怖さが少ない（大事！）
• 日本語で情報が調べやすく、教材も簡単でわかりやすく書いてくれていることが多い
• 開発者が中国系アメリカ人のため「ソースコード中の日本語（や絵文字含むマルチバイト文字）が原因の謎エラー」がほぼ起きない
• 結果、少人数で書くアプリに向いている

Angular

PHP Laravel、Ruby on Rails、Java Spring、C# ASP.NET などフルスタック系バックエンドエンジニア出身で、フロントエンドもできるだけバラけない構成でやりたい方におすすめ。

• ルーター（URL制御）やHTTPリクエストやview周りの統一制御など、ある程度以上のWeb開発なら必須の機能が最初から入っていて、技術選定・初期設定などに工数が取られにくい
  （逆にいうと現実的にはReactやVueはそれ単体ではほぼ成り立たず、Next.js、NUXT、Vite、Tailwind CSS...などなど外部ライブラリを選んで入れていき、全て学ぶ手間がある）
• 技術的選択肢が少ないことでチーム全体でコードの統一やノウハウ共有がしやすく、テスト工数や謎ライブラリによる謎バグの可能性も下げられる（大規模開発では超大事！）
• 結果、 人数が多いチームに向いている

jQuery

デザイナー出身で、デザインのためのモーションやちょっとしたインタラクションを入れたいだけの方におすすめ。

• 要求仕様がシンプルなら、CDN（<script></script>での読み込み）でjQueryを読み込んで使うのがいまだに最も簡単で、最も実装が早く、アップロードも楽
  
• 画像もSVGにして埋め込んでしまえば HTML 1ファイルだけで完結することも十分現実的で、FTPが使えずソースコードエディタしかさわれないWordPressなどでもリッチなページが作れる
• 調べて出てくるコピペコードが非エンジニア出身でもすぐ動かせる
• 結果、アプリ未満のシンプルな動きを書きたいならこれ

ゼロから学習したい方向けおすすめ結論

React

将来的にアプリ開発も視野に入れている方。

または外資企業への就職も考えている方。

就職の募集は日本でもVueよりReactの方がやや多いと思います。

Vue

ゼロイチ系フリーランサー、特にWeb系フルスタックエンジニアを目指す方。

Reactよりもとっつきやすく、Angularよりも「プロのフルスタックエンジニアとして学ぶべき取捨選択判断」の勉強が自然とできる。

「しばらくは1人で受託したい」ならばVueから始めるのがいいと思います。

Angular

大企業や大企業向け開発をやっている会社に就職する予定の場合。

Javaの募集と同じような空気感があり、ド派手系より安定を目指す方には現実的な選択肢。

jQuery

今後もデザイン（Adobe系ツール、Canva系ツール、Sketch、Figmaなど）を主戦場とする方はまずはここから。

 

おまけ〜デザイナーさんのステップアップとお給料〜

Webに限ると、下記はお給料が違うことが多いです。

まずはjQueryからはじめて、つよつよデザイナーを目指しましょう！🧑🎨

 

Lv1. 動きを考慮しない画像を作ることができる

• できること
  • バナー、LPの画像での書き出し
  • アプリUI開発で「スマホ1デザイン＋PC1デザインの静止画」を納品する場合もこちら
    

Lv2. 静的レスポンシブページのコーディングができる

• できること
  • HTML、CSSの組み込みができる
  • 必ずしも自分の手でゼロから書く必要はなく、ツールでの書き出しやAI出力、NoCodeなどでも十分なことも多いが、さまざまな環境で正しく見えていることをテストできる能力は必要
• お給料がなぜ上がるか
  • 広告LPだけでなくWebサイトの受注ができる
  • SEOが圧倒的に強まる（Googleは基本的に文字しか見ないので、画像書き出しではSEO力はゼロに近い）
  • レスポンシブの正確な仕様を理解、指定することができる（一般的にデザイナーよりも高額なエンジニア側の工数を抑えることができる）
    
    などなど売上や利益への貢献度が爆上がりする
    

Lv3. モーション等が実装できる

• できること
  • jQueryやJavaScriptの実装ができる
• お給料がなぜ上がるか
  • ユーザーの目を惹き売上が立つ可能性が高まる
  • 発注者の満足度が上がる（結果、リピート受注や案件単価アップ）
  • 非同期処理の理解などを通じて高機能案件の受注が見えてくる
    
  • シンプルな案件ならエンジニアを呼ばなくても完結できるようになる

Lv4. デザイナー兼フロントエンジニアのサポートとしてWebアプリにデザインを組み込める

• できること
  • ReactやVueなどへのデザイン組み込みができる
  • SCSSやTailwind CSSをはじめとしたユニバーサルなCSSライブラリが使える
• お給料がなぜ上がるか
  • 数百万円代〜の案件で実質2人分の仕事ができる
  • または自社開発のための採用を一人分抑えられる（コストが年間数百万変わる！）