本格的にプログラミングを学習するとなると、初心者でも需要が高く、尚且つ長期的に使い続けることができるJavaScriptは外すことができません。

現在のウェブサービスのほとんどはこのJavaScriptが使われているため、WEB系言語では必須だと言えるでしょう。

とはいえ、いきなりJavaScript関連の本を買って学習を始めようとすると、変数・関数・条件分岐・DOM・オブジェクト指向など、わけわからん単語と格闘することになるため、大半の人が最初の段階で学習を諦めてしまいます。

avatar
諦めかけた人、はい。私ですw
avatar
なんか難しそう‥

いつかは勉強しなければならないJavaScript。ですが初心者がいきなり挑戦するのは少し危険な匂いもする‥。

実際JavaScriptを独学で挑戦して苦しんだ経験を持つ私が、一体どのようなステップでJavaScriptを取り組めば良いのか?今回はその点について掘り下げていきたいと思います。

もし今の段階でJavaScriptをスムーズに勉強できているのであれば、この記事は読む意味が全くありません。

今回の内容は『プログラミング初心者向け』の記事になっています。

そもそもJavaScriptとは?

まずこのJavaScriptという言語は、簡単に言ってしまえば

『ブラウザで動的なプログラムを書くことができる言語』

になります。

そして最初にお伝えしておきますが、このJavaScriptに関しては

『HTML・CSSを学習していることが前提で使われる言語』

となるため、今の段階でHTML・CSSが分からない場合はまずそちらから始めていきましょう。

全てはそこからです。

avatar
順番を逆にすると、意味わからんことになりますのでご注意を‥
補足

HTMLでは、文章の構造をコードとして書くことができ、CSSはHTMLで書かれたコードに色や装飾を付けていきます。この2つである程度のサイトは作れますが、そこに動的な動きを入れるための手段として、このJavaScriptが使われることになるのです。

まずはこの簡単な前提を理解しておきましょう。

何も知らない状態でJavaScriptを学び始めても、結局HTML・CSSに戻ることになりますからね笑。

最初からJavaScriptに手を出すと事故(挫折)が起きる!?

プログラミング言語の中でも特に需要の高いJavaScriptですが、この言語を初心者がいきなり独学で勉強すると、高い確率で挫折すると思います。

もちろん最初からスムーズに理解できる人はいると思います。

しかし実際にJavaScriptに取り組んでみると、HTML・CSSの時とは少しレベルの違う難しさと直面することになります。

avatar
プログラミング言語は最初が少し大変です。

まずは何でも良いので、一度JavaScript関連の書籍を読んでみてください。

そこであなた自身がどのような感想を抱くのか?それによって次の行動が変わってきます。

私の事例をお話しすると、最初にHTML・CSSの知識をある程度脳みそに入れる流れは多くの人と同じでした。

しかしその後、私はどうしてもJavaScriptを学ぶ必要があったため、独学でいきなり勉強をし始めたのですが、まぁ意味わかりませんでしたね笑。

avatar
共感していただける方は、今回の記事はとても参考になります笑。

HTML・CSSの学習がスムーズにいったことにより、心のどこかで

『プログラミング余裕じゃね?(HTML・CSSはプログラミングではないのですが‥)』

と思ったところに、初心者には難易度の高いJavaScriptがどーーん!と私のメンタルを破壊しました。

ここで一度学習する流れを変える選択肢を迫られたのです。

プログラミング初心者がJavaScriptを学習する流れ

avatar
これからあなたがJavaScriptと対峙して、どのような感想を持つかは分かりませんが、過去の私のようなパターンで挫折しそうになる可能性はゼロではありませんので、一通りの流れと逃げ場を確保しておきましょう。

様々な失敗を経て私がたどり着いた理想的なルートは以下の通りです。

重要なのは、ルートから外れそうになった時に

『どのような対処法を持っておくか?』

です。

まず最初にHTML・CSSを学ぶ

どんなルートを辿るにしても、最初にHTML・CSSを学ぶことは必須となります。

なのでここに最低でも2週間、長くても1ヶ月2ヶ月の期間を注いで基本的な知識は取り入れておいてください。

プログラミング言語を学ぼうとした時に、HTML・CSSの基礎が分からないとなると、思ったようなスピードで学習ができなくなります。

実際のところ、この2つの学習は全体像を理解すれば簡単です。

avatar
大枠を掴むまでは少し時間がかかるかもしれません。

HTMLはタグを覚えればある程度形になりますし、CSSもフレームワークを活用すれば簡単に扱うことが可能です。

もしHTML・CSSが難しいと感じる場合は、学習時間が足りていないか、書籍や教える人が悪い可能性が高いので、早めに対策を打っておきましょう。

一度HTML・CSSを使ってサイトを作ってみる

簡単な知識を脳みそに入れたところで、次は実際に入れた知識を吐き出していく作業をしていきましょう。

avatar
この段階でおそらく1つの壁にぶち当たると思います(すぐ乗り越えられますが)。

というのも、自分が覚えた気になっても、実際にサイトを作る際に知識をアウトプットしようとすると、マジで脳みそから出てこようとしません。

ちゃんとインプットしたはずなのに、何で自分の手でサイトが作れないのか?という理想と現実のギャップが起こることで、HTML・CSSが少し嫌になってきます笑。

インプット:脳みそに知識がある状態

アウトプット:脳みその知識を引き出しから取り出せる状態

しかしこの流れはめちゃめちゃ順調です。

この作業をすると、自分ができないことが明確になってくるため、あとは足りない知識を取り入れてアウトプットできるように反復するだけです。

この段階に入れば、インプット1割:アウトプット9割くらいで考えて実践していきましょう。

avatar
大げさではなくマジです。

そして形が整っていなくても良いので、まずは1つ簡単なサイトを作り上げてみましょう。

動的な動きを入れるためにプログラミング言語を学び始める

HTML・CSSの基礎を学ぶ→自分でアウトプットして簡単なサイトが作れた。

ここまでくれば、いよいよ動的な要素を取り入れるためのプログラミング言語の習得に時間を使っていきましょう。

ようやくこの段階に入って、初めてJavaScriptと対峙するのが王道的な流れとなるのです。

しかし途中でもお伝えした通り、私はこの王道ルートでJavaScriptに絶望しました笑。

そのため、一旦ルートを変えてJavaScriptからPHP・JQueryを学ぶ路線に移ったのです。

avatar
一般的にはJavaScriptよりもPHPの方が簡単だと聞いて、そちらに移行しました。

王道ルートから外れても、結局今ではJavaScriptをある程度扱うことができます。

私の場合はJavaScriptよりもPHP・JQueryの方が簡単に感じたため、このような路線変更をすることで、挫折という最悪のイベントを回避することができたのです。

HTML・CSSの次にJavaScriptは正しいルートなのか?

あらゆる失敗を経験したからこそ言えることですが、今考えるとプログラミングの学習に王道ルートなんて存在しないのかもしれません。

大学でC言語を学んで独学で習得できる人もいますし、いきなりJavaScriptを学んで実務で使っている人もたくさんいます。

そのため、正しいルートを探すというよりは

『いかに自分が挫折しづらいルートを見つけるか』

を考えて頂きたいのが本音です。

プログラミング学習を挫折したら全てがゼロになりますが、学習し続けることができれば1が10にも100にもなります。
avatar
挫折すると何も残りませんからね。

他人が正しいということが自分に当てはまることはそう多くはありません。

それを考えると、HTML・CSS→JavaScriptという流れを守る必要はないのです。

オススメはJavaScriptの前にJQueryに逃げること!

もし仮にJavaScriptがあまり理解できなかった‥と仮定した場合、私が推奨するのは

『真っ先にjQueryに逃げてください!』

ということです。

軽くご紹介しておくと、このjQueryはJavaScriptのライブラリの一つであり、言ってしまえば

『JavaScriptを扱いやすくしたもの』

になります。

実際JavaScriptでコードを入力すると複雑になるものでも、jQueryであればコンパクトなコードで実現できてしまいます。

補足

イメージとしては、JavaScriptだと何十行になるコードが、jQueryだと数行で収まる感じですね。

つまり圧倒的にJavaScriptよりも簡単だということです。

avatar
一度無料で使えるプログラミング学習サイトでJavaScriptとjQueryの違いを確認してみてください。

事実、JavaScriptよりもjQueryの方が現場で使われていますし、簡単に動的な操作ができるため学習がかなり楽しいです。

型さえ覚えてしまえば、プログラミング初心者だったとしても、すぐにサイトに取り入れることができます。

そしていずれ複雑な動きを実現しようと思った時、ここでようやくJavaScriptが登場することになるのです。

その際にはある程度のjQueryの知識が頭に入っていますので、全く初心者の状態の時よりもJavaScriptの知識が取り入れやすくなっています。

jQuery→JavaScriptの流れを踏むことによって、挫折率を大きく下げた学習ができるようになるのです。

これはかなり効果的な方法なので、ぜひ試してみてくださいね。

結論としては最終的にJavaScriptを学べれば何でも良い!

なんだかんだプログラミング学習では失敗を経験することになりますが、結果的にJavaScriptが勉強できていれば順序はそこまで意識する必要はありません。

avatar
業界ではHTML・CSS→JavaScriptの流れが定番となっているようですが、ここはそこまで気にせずに、まずはプログラミング言語で自分が何をやりたいのか?それを実現するためにはどの言語を学ぶべきなのか?を考えてみましょう。

その際にJavaScriptが必要になったのであれば、最初にjQueryを学んでからでも遅くはありません(むしろ学習効率は上がると思います)。

HTML・CSS→PHP→jQuery→JavaScript(私のパターン)

HTML・CSS→jQuery→JavaScript

HTML・CSS→JavaScript

様々なルートがありますが、まずは全てのプログラミング言語を無料サービス(ドットインストールやプロゲートなど)で視聴してみて、そこから自分なりのルートを見つけてみてくださいね。

JavaScriptを効率よく学べる環境に飛び込むのが理想!

今回の内容は独学することが前提で考えてみましたが、結局のところ、最短ルートを駆け抜けるためにはJavaScriptを効率よく学べる環境に飛び込むのが一番です。

avatar
WEB系言語(JavaScript・jQuery・PHPなど)を学ぶことができれば、まず仕事に困ることはなくなります。

独学で学ぶ意欲も大切ですが、短期間で挫折せずに学習を進めるためには

『プログラミングスクール』

を活用し、プロの講師に教わるのが一番早いです。

今なら無料で体験できるところも数多くありますので、ぜひこちらも上手に活用してみてください。

未経験の方にオススメのプログラミングスクール(教室)を厳選してみた!

まとめ

スキル0の状態からJavaScriptに挑戦するのは、なかなか苦戦することも多いと思います。

avatar
HTML・CSSがスライムであれば、JavaScriptはゴーレムくらいの強さです(ドラクエ分からない方すいませんw)。
それを倒すためには、真正面からぶつかっていくだけではなく、別の場所でレベル上げをしてから戦いを挑むのも一つの戦略としては効果的です。

レベルが低いのに強い敵ばかりを相手にしてしまうと、やがて心が折れて挫折してしまいますからね。

息の長い数少ないプログラミング言語であるJavaScript。

ここをマスターすることで世界は大きく開けますので、ぜひ自分なりのルートを見つけて学習を進めていってください。