JavaScript初心者におすすめの学習サイト10選!効率よく学習を進めよう!

今回はJavaScriptを学習することのできる初心者向けのサイトを紹介していきたいと思います。これからJavaScriptの学習を始める人や既に学習中でどんなサイトがあるのか知りたい人は参考にしてみてください。

それぞれのサイトで有料プランがあるものもあるから、無料で使ってみて良い感じだったら有料プランを検討してみるといいと思います。ではいってみよう。

マンガで分かるJavaScriptプログラミング講座

マンガで分かるJavaScriptプログラミング講座

その名の通りマンガでJavaScriptを学ぶことのできる学習サイト。我こそはプログラミング初学者という方はここから始めてもらいたいぐらいの分かりやすさです。プログラムって何?JavaScriptって何?ってところから始めたいならおすすめ。

マンガ形式だから登場人物の会話で学習していくスタイル。

既にJavaScriptを学び始めた人には物足りないだろうけど、初歩の初歩が分からない・これからプログラミングに手を出すっていう人には取っつきやすいはずです。

分かりづらいクッキーの利用なんてシンプルで分かりやすい。セッションに関することも知らないとそこらへんはごちゃごちゃになるだろうけど、とっかかりとして良いですね。

全体的に初心者でも分かるようにやさしく書かれているのが特徴です。

ドットインストール

ドットインストールは動画形式で学ぶことができるプログラミング学習サイト。かなりの種類の講座があって、他のサイトにはないようなものもあるのが特徴です。その中にもちろんJavaScriptの講座もある。

javascriptで検索するだけで204件のレッスンと429件のレッスン動画が見つかりました。

講座はいくつもあるけど、これからjavaScriptを学んでいきたいっていうなら「はじめてのJavaScript」っていうレッスンがおすすめです。PREMIUMって書いてあるやつは有料プランじゃないと見れなかったりするけど、PREMIUMじゃないものは無料で見ることができます。(PREMIUMの講座多いけど・・・)

動画で学習内容を説明してくれて、右側のエディタでタイピングして進めることができる。

はじめてのJavaScript

各レッスンの動画時間はそんなに長くないから割とサクサク進めると思います。ちなみに有料プランは月額1080円だから無料で使ってみて良い感じだったら有料プランでガシガシ学習を進めてみるといいと思います。

JavaScriptのレッスンの種類だけでもけっこうあります。

他にもJavaScriptで何かを作ってみる講座やReact・Vueの講座もあったりします。

  • JavaScriptでモーダルウィンドウを作ろう
  • JavaScriptでハンバーガーメニューを作ろう
  • JavaScriptでアコーディオンUIを作ろう
  • JavaScriptでタブメニューを作ろう
  • JavaScriptでカルーセルを作ろう
  • jQuery入門
  • React入門
  • ReactでTodo管理アプリを作ろう
  • Vue.js入門
  • Chart.js入門
  • Node.js入門
  • Express入門
  • progateのJavaScript講座

PREMIUMプランじゃないと受講できものばかりだから、有料のプレミアムプランを契約したら全力で気になるものに取り組んでできるだけお金をかけずに学習しまくってしまおう。

Progate

Progateは有名ですよね。スライド形式でプログラミングを学ぶことができる。

JavaScriptを初めて学ぶ際はJavaScriptのレッスンを見てみるといいです。

ReactやNode.jsもあるからJavaScriptのレッスンが終わって気になったら見てみるといいでしょう。

Progateは学習を進めるごとにレベルアップしていくからゲーム感覚でできるのも良いところです。

それとスマホアプリもあるから、スマホでプログラミング学習をやりたいっていう場合は試してみるといいですよ。

CODEPREP

CODEPREPもProgateと同じように画面に出ているヒントを頼りにエディタにタイピングして学習していくスタイル。

JavaScriptだけでも学習できる教材はいくつかあるけど、JavaScriptを最初に触る時には入門編の基本操作編からやるのがおすすめです。

また、ディスカッションボードっていうものがあって、ここに質問を書き込んで回答を待つことができる。

どうしても分からない部分があったら質問を投げかけられるところはいいですよね。

現代のJavaScriptチュートリアル

現代のJavaScriptチュートリアルはテキスト形式で学ぶことのできるサイト。

テキストだからちょっと堅苦しい感じがするかもしれないけど、MDNのJavaScriptリファレンスなんかよりは読みやすいと思います。(詳しく書かれているので詳細に知りたかったら読んでみるといいと思います。)

現代のJavaScriptチュートリアルはJavaSciptちょっと書けるようになってきた、詳しく知りたいっていう時におすすめ。いろんなものが載っています。

JavaScriptでオブジェクトって何なの?関数って何なの?とか思ったら、それに関するところを読んでみるといいです。サンプルコードもテキスト内に書かれているから、そこまで読みづらくはないはず。

paiza

paizaはスキルチェックだったり問題集だったりいろいろあるけど、講座の種類もかなりある。

JavaScriptだとJavaScript体験編とJavaScript入門編がある。学習画面はこんな感じで左側に説明動画、右側にエディタがある。

動画を見ながら学習していくスタイルですね。

ちなみにpaizaはけっこういろんなことができて、プログラミングを学習していくサイトを探しているなら覗いてみるといいですよ。

Udemy

Udemyは動画教材を買って学習することのできるサイト。個人的にUdemyは独学でプログラミング学習をするにはおすすめのサイトで自分でもいくつか講座を買っています。全部で41コース買っていました。

Udemyの講座は有料だけあってクオリティの高い講座が多く分かりやすいです。プログラミング以外の講座もたくさんあるけど、試しにJavaScriptの講座は検索すると色々出てくる。

良さそうなものがあったらクリックして中身を覗いてみるといいです。購入前にどんな内容の講座なのかを知ることができます。

ちなみにUdemyではタイムセールをやっていたりすることが多いから、その時期に買うといいです。大体1000~3000円ぐらいで買うことができます。

JSFiddle/Codepen

学習サイトではないけど、JSFiddleCodePenといったブラウザで使えるオンラインエディタは何かを試す際には結構おすすめです。いろんなライブラリを使って試すこともできるから良い。

JavaScriptを動かす環境を作るのが面倒だったり、このデザインCSSで作れるかなあ?とか試したりするときに使ってみるといいと思います。エディタのデザインも綺麗で使いやすいです。

ライブラリのサイトなどのチュートリアル

それぞれのJavaScriptライブラリのサイトなんかにチュートリアルが掲載されていることもあるから、それを見つつどんなもんか試してみるのもいいと思います。

JavaScriptって何?って状態だと手を付けられないけど、これからReact学びます、Vue学びます!といった段階だと一度は目を通してやってみるといいです。

まとめ

学習サイトを大きく以下の2つに分けられます。

  • テキスト形式の学習サイト
  • 動画形式の学習サイト

どちらかを選ぶなら個人的には動画形式で学習できるサイトがおすすめだけど、いろいろ見てみるといいと思います。最初無料の学習サイトで学習しつつ物足りなくなったらUdemyに手を出してみるのがおすすめ。Udemyには結構お世話になってきた。