JavaScriptを基礎から勉強できるサービス10選+本3冊

JavaScriptを基礎から勉強できるサービス10選+本3冊


今やJavaScriptという言語は最も重要なプログラミング言語と言っても過言ではありません。なぜならどんなWebブラウザでも動作するほぼ唯一のプログラミング言語だからです。

Webアプリケーションが進化と拡大を続けている現在、JavaScriptの重要性は増すことはあれど減ることはないでしょう。

本エントリではJavaScript初心者が自分のペースでJavaScriptを学べるサービスをご紹介します。

image

目次
  1. そもそもJavaScriptとは?
  2. CodeCamp
  3. ドットインストール
  4. CODEPREP
  5. Progate
  6. Codecademy
  7. Schoo
  8. MOONBlock
  9. jsdo.it
  10. Paiza
  11. CODECOMBAT
  12. JavaScript学習者におすすめの本
  13. 確かな力が身につくJavaScript「超」入門 (確かな力が身につく「超」入門シリーズ)
  14. ノンプログラマのためのJavaScriptはじめの一歩
  15. スラスラわかるJavaScript
  16. まとめ

そもそもJavaScriptとは?

JavaScriptとはプログラミング言語の一種で、Webページに様々な機能を付加することができる言語です。例えば対象物の上でカーソルをかざすと動きが出る、いわゆる「マウスオーバー」のようなユーザの動きに応じたWebページにおける機能を作る際に活用されています。

しかしその反面、セキュリティが甘いなどのデメリットもあります。

なので、ユーザ認証機能のような具体的な処理内容が見られたらセキュリティ上問題となる箇所ではJavaScriptで実装しないようにします。

CodeCamp

image

画像出典:CodeCamp

現役エンジニアによるオンラインのマンツーマンレッスンを7時〜24時まで受ける事が可能。自分のスケジュールに合わせて学習スケジュールを組むことができ、学業や本業で忙しい人でも空いた時間で勉強を進めることができます。

「地方だから」や「スクールに通う時間がない」といった人におすすめ。無料体験も行っているので「オンラインレッスンってどんな感じ?」と思っている方は体験してみるとよいでしょう。

ドットインストール

「3分動画でマスターするプログラミング学習サイト(初心者向け)」と謳われているサイトです。様々なプログラミング言語やフレームワークの初心者向けレッスンを動画で配信しています。

image

画像出典:ドットインストール

様々なレッスンがありますが、JavaScript入門は初心者向けの内容になっているので、知識ゼロからの学習にはうってつけです。1回の動画は3分程度なので、隙間時間を使って学習できるのもありがたいです。

image

画像出典:ドットインストール

さらに、AngularJSやjQueryなど、重要なJavaScriptライブラリの入門レッスンも備えています。下記はjQueryで検索した結果です。45件と豊富なレッスンが提供されています。

image

画像出典:ドットインストール

入門を超えた内容もあることから、広くJavaScriptの学習ができるサイトと言えるでしょう。

CODEPREP

CODEPREPはプログラミングをオンラインで書きながら覚えるができる学習サービスです。

image

画像出典:CODEPREP

JavaScript初心者向けには「初めてのJavaScript」というレッスン(CODEPREP中の用語では『ブック』)が提供されており、ゼロから学ぶことができます。

CODEPREPは「毎日コツコツとコードを書き続けるのがプログラミング学習に置いて最も重要」という考え方のもと、プログラムの穴埋め問題を解いていくことで、徐々に理解が進むように工夫されています。

問題をテンポよくどんどん回答できる上に、正解すると経験値が得られるというゲーム要素もあり思わず先に進みたくなる、巧みな作りです。

また、ディスカッション機能が利用者に活発に利用されているのも特徴です。問題に詰まった時に他の利用者に助けを求めたり、あるテーマについて議論したりと多くの投稿で賑わっています。

image

画像出典:CODEPREP

応用編のレッスンは「jQueryでつくるパララックス」「Three.jsではじめる3Dグラフィックス基礎」などバラエティに富んでおり、レベルに応じた学習が進められます。

image

画像出典:CODEPREP

Progate

image

画像出典:Progate

Progateではステップごとにレッスンを進めることができ、テンポよくJavaScriptを学習することができます。

image

画像出典:Progate

プラウザ上の専用エディタに課題を入力してその場で正誤が判定され、あっていれば次のレッスンに、といった具合でレッスンは進んでいきます。レッスンが進むことで経験値がたまり、レベルがアップするためレベルをあげようとモチベーションを高く保つことができます。

Codecademy

image

画像出典:Codecademy

Codecademyは残念ながら日本語に対応はしていませんが、これが本当に無料なの!?と思ってしまうような充実のコンテンツを無料で受講することができます。

コースをこなすごとにバッジをもらえたり、自身の進捗状況が確認できるため継続しやすい仕組みづくりがしっかりとなされているのです。

またコースも言語別の他にWeb制作で使われているスキルに幅広く対応しております。 JavaScriptが終わったらそれ以外の言語もマスターしてさらにスキルを磨いていきたいですね!

Schoo

image

画像出典:Schoo

プログラミングの枠を超えた、様々な授業を動画で受けることができるサイトです。JavaScriptの講座は入門から実践まで、幅広く用意されています。

たとえプログラミングをしたことがなくても、JavaScriptの概念から説明した動画もあるのでご安心を。録画授業は有料ですが、無料で受けられる動画もあるので、まずは試してみることをおすすめします。

MOONBlock

image

画像出典:MOONBlock

MOONBlockはコードを書くプログラミング学習サイトではありません。背景を変えたり、人形を出したりできるブロックを組みあわせて、動くものを作っていくサイトです。「プログラミング自体がはじめて」という方が、プログラミングとはどういうものかをまず理解するのに適しています。

ブロックで作ったプログラムは、「ソース」を見ることでJavaScriptとして確認できます。日本語表記にも対応しているので、JavaScriptのはじめの一歩としてピッタリですね。

jsdo.it

image

画像出典:jsdo.it

WebデザインやJavaScriptエンジニアのようなフロントエンド(ユーザーから見える部分)を扱う、エンジニアのためのコミュニティがjsdo.itです。日本語に対応しており、コードを書いたその場で動かすことができます。 自分の技術に自信がなくても、jsdo.it上で共有されているコードを書き換えて、他のユーザーからテクニックを学ぶことが可能です。

Paiza

image

画像出典:Paiza

Paizaではコーディングスキルをはかる問題に、Web上で取り組むことができるサイトです。スキルレベルは「S・A・B・C・D・E」の6段階でランクに分けられます。JavaScriptの実力が着いてきたと思ったら、チャレンジしてみましょう。

CODECOMBAT

image

画像出典:CODECOMBAT

ゲームをしながらプログラミングを学べる画期的なWebサービスが、こちらのCODECOMBATです。RPGのような親しみやすいグラフィックで、コーディングをしながらゲームを進めることができます。 自分でコードを書いてゲームを作る、なんてこともできてしまう、初心者から上級者まで楽しめるサービスです。

JavaScript学習者におすすめの本

JavaScript学習におすすめのWebサービスを紹介しました。ここからは、JavaScriptを学ぶのに最適な本を、3冊イッキに紹介します。

確かな力が身につくJavaScript「超」入門 (確かな力が身につく「超」入門シリーズ)

確かな力が身につくJavaScript「超」入門 (確かな力が身につく「超」入門シリーズ)
SBクリエイティブ (2015-10-30) 売り上げランキング: 2,713

プログラミングのことはきちんと分かっていないけど、とりあえずJavaScriptを使ったプログラミングを書いてみたい方におすすめの本です。

本書の内容に従って作っていけば、JavaScriptを使った機能を自分の手で作る体験ができます。

ただ、細かい内容は省かれています。なので、本の内容から発展させて自分のオリジナルで何かをつくることは難しいでしょう。サイト上のコンテンツに動きを与える程度ととらえて、本書を利用するのがよさそうです。

JavaScriptをとりあえず触ってみて慣れることや、そもそもJavaScriptとはどういうものかを理解することを目的として利用するにはピッタリの一冊。

ノンプログラマのためのJavaScriptはじめの一歩

ノンプログラマのためのJavaScriptはじめの一歩 (WEB+DB PRESS plus)
外村 和仁 技術評論社 売り上げランキング: 222,495

簡単なJavaScriptであれば見よう見まねで書けるが、しっかりとは理解していない。

また、JavaScriptを基礎から勉強したいという方におすすめの本です。

一つ一つの関数に対して説明がとても丁寧にされており、基本的なプログラムから言語自体の仕組み・考え方を学ぶことができるようになっています。

JavaScriptの基本をしっかりと学ぶことができ、サンプルコードも付いているので基本を身に付けたいというときには目を通しておきたい一冊です。

ただし、プログラミング自体が全くの初めてというノンプログラマの方には、難しく感じる部分がある可能性があるので注意してください。

あくまでも「JavaScriptのはじめの一歩」であって、プログラミングのはじめの一歩にはなりえない本だとも言えますね。

スラスラわかるJavaScript

スラスラわかるJavaScript (Beginner's Best Guide to Programmin)
生形 可奈子 翔泳社 売り上げランキング: 34,789

上記の「ノンプログラマのためのJavaScriptはじめの一歩」と同じく、JavaScriptを触ったことはあるが正しくは理解しておらず、基本から勉強したいという方におすすめの一冊。

内容や構成も「ノンプログラマのためのJavaScriptはじめの一歩」と近くなっており、JavaScript初級者にとって分かりやすく、その内容量もちょうどよいです。

また、わかりやすくイラストが多く、平易な日本語で書かれた解説となっており、初級者にぴったりの入門書と言えます。

まとめ

冒頭で述べたように、JavaScriptは今や最も重要なプログラミング言語の1つです。デザイン面でも、動きを付けるためにjQueryを使う時にはJavaScriptの知識が必要ですので、非プログラマでも必要なスキルとなっています。

本エントリで紹介したサービスを使って、ぜひJavaScriptを扱えるようになってください。Webの世界がぐっと広がることを実感できると思います。

image

黒田剛司
ライター
黒田剛司

関連記事