Web制作

jQueryはオワコンなのか?_これからJavaScriptで学ぶべき内容とは?

jQueryはオワコンなのか?_これからJavaScriptで学ぶべき内容とは?

ぶたっち

大学生時代にプログラミング学習を始め、Web業界に興味を持つ。
スクールでプログラミングを勉強し、プログラミングのインターンに参加する。
プログラミングスクールに通ったこと、未経験からプログラミングを学んだこと、徹底的にプログラミングスクールを比較した経験をもとに、プログラミングについての記事を執筆中。

jQueryがオワコンって本当なの?
jQueryがダメなら何を勉強すれば良いの?
jQuery勉強したのに時代遅れだった?



みたいに思っている人がいるのではないでしょうか?

プログラミングのことがよくわかっていない状態で、急にjQueryがオワコンと言われても


「どういうこと?」


みたいになりますよね。


ということで



ポイント

  • jQueryがそもそもどういうものかを知りたい人
  • jQueryがオワコンと言われている理由を知りたい人
  • jQuery以外に何を勉強すべきか知りたい人



みたいな人におすすめの内容となっています。


これからWeb制作を始めようといしている人は、以下の記事でロードマップを確認することができますので、参考にしてみてください。



合わせて読みたい


そもそもjQueryとは?

そもそもjQueryとは?



まず、jQueryとは?というところから確認していきましょう。



jQueryというのは、JavaScriptのライブラリとなっています。


jQueryを使うことで、JavaScriptでは数十行に渡る処理だったものをわずか数行で実行できるようになりました。




つまり



「JavaScriptだといろいろと面倒なことが多いので、jQueryというもので簡易的に作業ができるようにした」






という感じで理解しておきましょう。




そのため、できることとしてはJavaScriptと似ているという特徴があります。



JavaScriptの方ができることが多いですが、特に目に見えるイベントはjQueryでも実行できます。



jQueryは本当にオワコンなのか?_必要性について

jQueryは本当にオワコンなのか?_必要性について



ここで重要なjQueryがオワコンなのか?ということですが

「オワコンではないが、古いスキルである」




という感じです。


具体的に


ポイント

  • Web制作を勉強するなら必要
  • Web開発を勉強するなら不必要



となっています。



Web制作を勉強するなら必要


jQueryは、主にWeb制作の分野で使用されています。



先ほども言いましたが、jQueryを使えばJavaScriptよりも簡潔なコードで書けますし、もともとWeb制作にjQueryがメインで使われていたということもあります。





初心者にとっては少しでも手間が少なく覚えやすい方が良いので、Web制作を勉強する際はjQueryから学ぶことが多いです。





実際に、僕もTechAcademyというプログラミングスクールの受講経験がありますが、その時もjQueryから勉強しました。






ここで1つ頭に入れておくべきことがあるのですが、数年前にVue.jsReact.jsというJavaScriptの新しいフレームワークやライブラリが出てきたことです。






簡単に言うと、jQueryを使うよりもVue.jsやReact.jsを使うほうができることの幅が広がるので、新たな開発にはjQueryを使わないという流れがあるということです。






ただ、Web制作の分野ではjQueryでまかなえることが多いため、依然としてjQueryの人気はあります。


今まではjQueryしかなかったので、jQueryが使われているサイトが多く残っています。
また、WebサイトをVueやReactで作るというのはあまり見かけません。




そのため、Vue.jsやReact.jsが出てきたころからjQueryはオワコンと言われているのですが、急にすべてが変わるわけではありませんので、現時点では混在している状況になります。




jQueryは学習コストも低いので、これからWeb制作を学ぶ人は学習するべきです。



jQueryが日本と世界で使われている割合を表す図
出典:feb19



上図からも、国内ではまだjQueryが使われていることが分かります。





一方の海外ではjQueryの割合が減ってきており、日本も世界を追随する形を取りますので、徐々にjQueryの使用率は下がっていくでしょう。


Web開発を勉強するなら不必要


Web制作の場合はjQueryが必要でしたが、Web開発をするならjQueryは必要ないでしょう。




jQueryはWeb制作の分野で使われることが一般的ですし、JavaScript自体の性能も上がってきていることが挙げられます。





また、jQueryはDOM操作を手動で行う必要がありますし、SPAのニーズに対応できていないなど、大規模な開発には不向きとなっています。




Web開発の分野も刻一刻と進化しているため、jQueryより高度な処理ができるVueやReactに置き換わっているということです。




もともとはjQueryだけで対応できていましたが、今となっては対応できず、代わりにVueやReactが使われるようになったと考えておくと良いでしょう。



DOM操作を詳しく知りたい方
SPAを詳しく知りたい方



jQueryを使うメリットとは?

jQueryを使うメリットとは?



では、jQueryを使うメリットについてです。


ポイント

  • コードを短く書くことができる
  • JavaScriptと比較して学習コストが低い
  • ブラウザごとの対応が不必要
  • プラグインが豊富


となっています。


1つずつ見ていきましょう。

コードを短く書くことができる


jQueryの方がコードを短く書けることは少し話しましたが、実感がわかないと思いますので、以下を参考に見てみましょう。

//JavaScriptの場合
document.getelementByID('ID名').textContent="おはよう";

//jQuery
('#ID名').html("おはよう");



のような感じになります。


あんまり変わらないじゃないか!



と思う人もいるかもしれません。





しかし、今回は1行でしたが、通常のコーディングでは数百行とありますので、違いが大きくなることが分かると思います。

JavaScriptと比較して学習コストが低い


jQueryは初心者の方でも比較的理解が進みやすいです。





あるイベントと記述が対になっていることが多く、無駄が少ないのもポイントです。






JavaScriptも簡単と言われていますが、jQueryよりも奥が深く



「これどうなっているの?」



となることが出てきます。



JavaScriptの方が視覚的にとらえにくいイベントが多いことも一因だと思います。



最初に分からないことが多いと学習が進みにくくなりますので、理解しやすいjQueryから始めるのも1つの手です。




ブラウザごとの対応が不必要


JavaScriptなど、フロントエンドの開発でブラウザの違いは大きな問題を生む原因になります。




プログラミングをしていなければ、EdgeかChromeのブラウザを使っていることが多いと思いますが、






その他にも、AppleのSafariやMozillaのFirefoxなど、たくさんのブラウザがあります。



ブラウザがたくさんあることは分かったけど、それに何の問題があるの?



という風に思うとはずです。



実は、ブラウザが変わることで、内部で使われているエンジンも変わるため、同じコードでも実装される内容が変わるという問題があるのです。




つまり、Chromeで実装したら動くのに、Safariで実装するとエラーが出るという可能性があるということです。




特に、Internet Explorerはバージョンが更新されるごとに動作が異なっていたので、いろいろと面倒でした。



ということは、ブラウザごとに適したコードを書かないといけないの?




と心配されると思いますが、jQueryを使えばどのブラウザでも同じコードで同様の動作が行えるという特徴があります。



jQueryが飛躍的に人気となった理由の1つとして、ブラウザ間での問題を解決したことにあります。



ということは、これからJavaScriptを勉強するからブラウザごとの対応もできるようにならないといけないの?




と考えてしまいますが、最近は特に気にしなくても良いようになっています。




というのも、問題だっだInternet Explorerのサポートが打ち切られたということと、ブラウザ間での違いがほとんどなくなったので、JavaScriptでも問題なく対応できるようになりました。






今となってはjQueryのメリットは小さいものの、jQueryがなぜ人気だったのかということが分かったと思います。



プラグインが豊富


プラグインとは、機能を拡張させるためのものです。



このプラグインがjQueryには豊富に用意されているため、一からすべて覚えなくてもプラグインで補強することで解決できるようになります。





つまり、めちゃくちゃ楽ということです。



「これおしゃれだな…便利だな…」と思うものの大半がプラグインで対処できるようになっています。




コードもコピペで使えるようになっていますので、プラグインを使えばやりたいことのほとんどは実行できると考えて問題ないです。


注意点として、プラグインを使いすぎるとサイトが重くなったり機能しなくなるという不具合が生じる場合があります。



jQueryを使うデメリットとは?

jQueryを使うデメリットとは?



jQueryはメリットばかりではありませんので、次はjQueryのデメリットです。


ポイント

  • 処理が遅くなる可能性がある
  • JavaScriptの理解が進まない原因になる
  • 他のライブラリ・フレームワークと共存しにくい
  • プラグインが古いことがある




となります。


1つずつ見ていきましょう。



処理が遅くなる可能性がある


jQueryで書くとコードの読み込みに時間がかかり、その分動作速度が遅くなる可能性があります。





JavaScriptで記述した方が読み取りがスムーズに行える場合が多いので、速度を重視したい場合はjQueryの使用はおすすめできません。




また、jQueryの方が記述が簡単ですので、コードの中についつい無駄な記述が含めてしまうという可能性もあります。






となると、実際は使っていない指示も実行しようとしますので、注意しなければ余計に速度が遅くなるという可能性も考えられます。




速度を重視したい場合にはJavaScriptで統一したいですし、万一jQueryを使う場合は細心の注意を払う必要があります。



JavaScriptの理解が進まない原因になる


jQueryを使うとJavaScriptの理解が進まない可能性があります。





jQueryはJavaScriptよりも簡単に記述できたり、コピペで対応できたりと、何かと便利なことが多いです。







ですが、jQueryに慣れてしまってJavaScriptの学習を疎かにしていると、JavaScriptで問題が発生した時に対処できなくなるかもしれません。





時代の流れ的にも脱jQueryという感じで動いていますので、jQueryでできる実装内容はJavaScriptでも再現できるように勉強する必要があります。


他のライブラリ・フレームワークと共存しにくい



jQueryの性質的に、他のライブラリやフレームワークとの共存が難しいというものがあります。




何度も登場していますが、VueやReactもJavaScriptのフレームワークやライブラリの一種ですので、万一VueやReactが使われていると不具合が生じる可能性があります。




jQuery単体で使う場合には便利で良いですが、他にライブラリやフレームワークが使用されている場合は、エラーが出ずに動くかよく確認するようにしましょう。




プラグインが古いことがある



先ほどjQueryには多くのプラグインがあって便利であることを伝えましたが、豊富にある分更新されていないプラグインもたくさんあります。





通常のコーディングですと、バージョンに合わせた記述を心がければ問題ないですが、プラグインの場合は作成者次第ですので、どうしようもありません。



jQueryそのものが古くなってきていますので、最新の環境でjQueryのプラグインを使うと、jQueryのせいで脆弱になったりとトラブルの原因となることもあり得ます。



jQueryを単体で使うときはもちろん、他の技術と合わせて使う場合には慎重に使用するプラグインを決める必要があります。

jQueryの代わりに学ぶべきこととは?

jQueryの代わりに学ぶべきこととは?



ここまでの内容で、jQueryが徐々に使われなくなってきていることが分かったと思います。



ということで、jQueryの代わりに勉強するものとして挙げられるのが



ポイント

  • JavaScriptそのもの
  • Vue.js
  • React.js



です。


フライングして登場していたのでなんとなくわかっていたと思います。



これらも1つずつ見ていきましょう。



JavaScriptそのもの


jQueryがダメならJavaScriptです。




jQueryもあくまでJavaScriptのライブラリですので、原点に戻れば大丈夫です。





それに、JavaScript自体の性能もjQueryが使われるようになった時と比べると飛躍的に性能が向上していますので、JavaScriptだから問題があるということはありません。



JavaScriptの方ができることが多い分、習得までには時間がかかりますが、まずはjQueryでもできるような操作から慣れていくと良いでしょう。


Vue.js


Vue.jsはJavaScriptのフレームワークになります。


ユーザーが見れる部分の動作を高速化することができ、その上シンプルな設計となっているため、初心者の方でも比較的理解しやすいという特徴があります。






JavaScript関連の流れとしてはReactの方が人気が出つつありますが、Vueの方が初心者には優しいつくりとなっていますので、初めてフレームワークに挑戦される方はVueから始めて見てもよいでしょう。



将来性の面では、今のところどちらのフレームワークもありますので、心配する必要はありません。



React.js



最後はReact.jsです。



ReactはVueと比べられることが多かったり、できることが多岐にわたる点からフレームワークと勘違いされることが多いのですが、正確にはライブラリという立ち位置になります。




Reactの方がVueと比べると学習コストが大きかったり、日本語での解説が少ないという習得の難しさはあります。






ただし、Vueでは扱うことのできないような大規模開発にはReactの方が向いていたりと、汎用性の高さではReact有利な状況となっています。





React Naitveというものを使えばスマホアプリも開発できますので、少々難しくてもいろいろなものが作りたいという人はReactが向いているかもしれません。


jQuery以外では何を学べば良いの?

jQuery以外では何を学べば良いの?



ここまでで、おおよそのJavaScript関連の解説は終了しましたが



結局どれを勉強すれば良いの?



という人が多いでしょう。


簡単にまとめてしまえば


Web制作の分野に進みたい人

  • JavaScriptの基本を勉強
  • jQueryの勉強
  • jQueryの内容をJavaScriptでも実装できるようにする



Web開発(フロントエンド)の分野に進みたい人

  • JavaScriptの基本を勉強
  • VueかReactを使えるようにする



という流れで大丈夫です。





今は全体像がいまいちよくわからないかもしれませんが、勉強を進めるうちにやりたいことと習得すべきことが分かってくるはずです。




特にVueとReactで悩まれる人は多いと思いますので




クラウドソーシング




などに登録して、実際にどのような仕事があるのかを事前に確かめておくと良いでしょう。



まとめ【jQuery以外にもスキル習得を目指そう!】

jQuery以外にもスキル習得を目指そう



今回はjQueryがオワコンかどうかということについて紹介しました。




結論、jQueryはまだ使われてはいますが、脱jQueryの動きがあるのは確かです。




jQueryのメリット

  • コードを短く書くことができる
  • JavaScriptと比較して学習コストが低い
  • ブラウザごとの対応が不必要
  • プラグインが豊富




jQueryのデメリット

  • 処理が遅くなる可能性がある
  • JavaScriptの理解が進まない原因になる
  • 他のライブラリ・フレームワークと共存しにくい
  • プラグインが古いことがある






Web制作の道に進む方であればjQueryを勉強する価値はありますが、Web開発の道に進まれる方ならjQueryを学ぶ必要はありません。





VueやReactといったWeb開発がしやすいフレームワークやライブラリが出てきていますので、新しい技術に挑戦して、時代の流れに合ったエンジニアになることを目指しましょう!



合わせて読みたい


  • この記事を書いた人
  • 最新記事

ぶたっち

大学生時代にプログラミング学習を始め、Web業界に興味を持つ。
スクールでプログラミングを勉強し、プログラミングのインターンに参加する。
プログラミングスクールに通ったこと、未経験からプログラミングを学んだこと、徹底的にプログラミングスクールを比較した経験をもとに、プログラミングについての記事を執筆中。

-Web制作