JavaScript学習におすすめのサイト&ゲーム10選!

JavaScriptはブラウザ上で動作するプログラミング言語です。今ではブラウザに動きをつける言語のデファクトスタンダード(事実上の標準)になっていて、JavaScriptが書かれていないWebページを見つけるほうが難しいくらいです。今回は、JavaScriptを学習するための無料おすすめサイトをご紹介します。

JavaScript無料サイトおすすめ7選

JavaScript入門 – パズルネット智慧

JavaScript入門 - パズルネット智慧

JavaScriptビギナーを対象とした解説サイトです。初めてJavaScriptを触る人を対象にしているので、JavaScriptの基本を簡単なソースを交えながら丁寧に解説しています。HTMLの基礎はできていることを前提としています。

JavaScript入門 – AjaxTower

JavaScript入門 - AjaxTower
こちらもJavaScript初心者向けの解説サイトです。ブラウザの設定やエラーの確認方法から、JavaScriptの記述方法、構文といった基本的な内容を各項目に分けて解説しています。主だったクラスやオブジェクトの説明もしているので、より実践的な内容になっています。

初心者のためのJavaScript入門 – @IT

初心者のためのJavaScript入門 - @IT
IT技術情報サイトとして有名な@ITの、JavaScript入門特集記事群です。実際にプログラムを組みながら説明しているので、手を動かしながら学習することができます。また、より高度な内容の記事も用意されているので、発展学習にも使えます。

JavaScript入門 – ドットインストール

JavaScript入門- ドットインストール
プログラミング教育サイトで有名なドットインストールの学習サイトです。無料会員登録をすると、学習状況を管理できるので便利です。解説はすべて動画ですので、JavaScriptがまったくわからないという超初心者に向いています。また、動画の教材なのでクライアントサイドでの挙動を確認しやすいです。

サンプルで学ぶJavaScript入門

サンプルで学ぶJavaScript入門
最初からHTML込みのJavaScriptサンプルを載せているサイトです。とりあえず理解できなくてもサンプルをコピー&ペーストして動かし、動きを見てから内容を理解する、といったスタイルで学習できます。

JavaScript初級者から中級者になろう – uhyohyo.net

JavaScript初級者から中級者になろう
タイトル通り、中級者として必要な知識をまとめたサイトです。初級編のサイトを一通り見終わって、もっと詳しく知りたいという人に向いています。JavaScriptで制作可能な一通りのものを、自分で作れるようになるためのサイトです。

コピペで使える JavaScript逆引きリファレンス

コピペで使える JavaScript逆引きリファレンス
逆引きでサンプルコードを探すことができる便利なサイトです。教科書的な使い方ではなく、実際に開発をしている最中に辞書的に使うことを目的としています。基礎知識は身につけて、JavaScriptの開発者となった人におすすめです。

ゲームで学習できるサイト3選

ロジックサマナー~閃光の召喚プログラマ

ロジックサマナー~閃光の召喚プログラマ
遊びながらプログラミング技術の習得度を試せる無料のゲームです。自身が召喚士となり、召喚獣を呼び出して世界を争いから開放していく、といった内容です。召喚獣の呼び出しにはアイテムが必要となり、各所で出題されるプログラミング問題を解いて、そのアイテムを入手します。

ブラウザ上でプログラムを実行する環境も用意されているので、気軽に始められます。難易度の高い問題では、プログラミングスキルを競うモードもあり、世界のプログラマと腕を競い合うこともできます。

プログラミングで彼女を作る

プログラミングで彼女を作る
ゲーム上の彼女に身につけて欲しいアイテムを選択して、プログラミングの問題を解くことでそのアイテムを入手できるゲームです。恋愛シミュレーションを楽しみながらプログラミングを学ぶことができます。アイテムを入手するためにコードを書くのですが、その速さのランキングに参加することができます。また、今まで提出したコードの数やバイト数も記録されるため、モチベーションが維持しやすいです。

FIGHT CODE

FIGHT CODE
JavaScriptでロボットの動作を記述して、他のユーザーのロボットと対戦させることができるサービスです。全部英語なのが難点ですが、そのぶんプレイヤー数も多いという特徴があります。プログラミングで他のユーザーと戦える機能もあります。

JavaScript習得のコツ

Webの仕組みと言語の理解

まずはWebアプリの大枠の仕組みを理解しましょう。インターネットで検索すれば解説サイトがあります。次に、簡単に言語そのものの文法や思想を理解しましょう。全てを覚える必要はありませんが、前述したような学習サイトで代表的な文法は習得しておきましょう。

フレームワークの習得

言語の大枠を掴んだら、実際に開発をする上で大切なフレームワークについて学んでおきましょう。フレームワークは、サービスを開発する上での枠組みのことです。フレームワークを活用することで、開発効率を向上させたり、大人数で開発する際の規則の統一がしやすくなったりします。

実際の開発

これらを習得したら、実際の開発をしてみましょう。学習サイトや書籍を活用して、ひとつのサービスを完成させてみてください。実用的なサービスでなくとも、1サービスを一貫して作成することで、より実践的なスキルが身につきます。

まとめ

今回は、JavaScriptを学習するための無料おすすめサイトをご紹介しました。JavaScriptは大変メジャーな言語なので、解説サイトもたくさんあります。今回ご紹介したサイトも参考にしながら、自分にあったサイトを見つけてください。

関連記事

ページ上部へ戻る