【初心者向け】Javascriptを実際に使えるレベルになるまでの勉強手順を解説【オススメ動画5選】

こんにちは、Autumn（オータム）です。

今回はJavascriptの仕組みから、実際にホームページに組み込めるレベルまで理解度を高める勉強手順を解説していきます。

など、Javascriptが使えるようになれば、リッチなWEBサイトを作成することが可能です。

実際に仕事として制作する場合には必須のスキルですので、コツコツ勉強していきましょう！

Contents

Javascriptを実際に使えるレベルになるまでの勉強手順

結論から言うと、勉強手順は以下の３ステップです。

それぞれ順番に見ていきましょう。

Javascriptを勉強する上で挫折する一番の問題は、
「結局何してるかよくわからん！」
という状態に陥りやすい点です。

HTMLやCSSはブラウザ上にテキストや画像で視覚的に確認できるので理解しやすいんですが、Javascriptは単体でコードを入力しただけでは基本的に何も起こりません。

HTML・CSSなどの他言語と組み合わせて使用することで、初めてパワーを発揮する言語なんです。

「まずJavascriptって何ができるの？」
「何のために必要な言語なの？」
といった大枠をまずは抑えていくことが大事です。

そこで、私が実際に見た動画がこちら。

元yahoo!のフロントエンドエンジニアで、現在は起業家であるしまぶーさんの解説動画です。

Javascriptの基礎概念だけでなく、そもそもどうやってホームページは見れるようになってるの？など、イラストを交えてわかりやすく解説してくれるので超オススメです！

こちらの動画は全9回のシリーズものになっていますが、どれもとても重要な内容なので頑張って勉強していきましょう。

さて、Javascriptがどういった言語かざっくりわかったら基礎文法の勉強をしていきましょう。

これもyoutubeに有益な動画がありますのでご紹介します。

こちらはキノコードさんという方が発信している、基礎文法の解説動画です。
約１時間に必要最低限の文法や基礎知識が凝縮しており、途中で練習問題もあるので勉強したことをすぐ復習できる流れになっています。

とてもわかりやすく書かれているので、この動画を1~2周すれば基礎文法はおおよそ理解できていると思います。

最後に、実際に制作物を作ってみましょう。

やはり実践から得られるものには敵いませんので、基礎は早めに終わらせて作りまくる。これが上達の1番の近道です。

youyubeには実践編の解説動画もたくさんありますが、私目線でわかりやすかった動画を3つご紹介します。
本当、youtubeがある時代に生まれてよかったと思います。笑

セイト先生のWeb・IT塾さんの投稿で、Javascriptで簡単なクイズゲームを作ることができます。
if文、while文の使い方や配列の使い方を楽しく実践で学ぶことができるし、終わった頃には一つWEBアプリケーションを作ることができる最高の動画です。

こちらもセイト先生の投稿動画です。これを見ればホームページでよくみるタブメニューを作成できるようになります。

フロントエンドチャンネルさんの動画で、フワッと浮かび上がるスクロールアニメーションを実装できる方法が解説されています。少し難易度は高めですが、実装できたらめちゃくちゃ興奮するのでぜひ挑戦してみてください。

改めて、Javascriptを学習する３ステップは以下の通り。

プログラミング学習において、この手順は他の言語を勉強するときにも適用できますので、ぜひ覚えておいて欲しいです。

また、今回実践編でご紹介した内容はJavascriptでできる内容のほんの一部です。他のアニメーションを実装してみたい、と思った方は制作途中で鍛えた「ググり力」で色々な情報を集めて、いろいろ挑戦してみてください！

また、エンジニア転職までのロードマップも作成しました。ぜひ参考にしてみてください。

今回も読んでいただきありがとうございました！