paiza開発日誌

IT/Webエンジニア向け総合求人・学習サービス「paiza」(https://paiza.jp ギノ株式会社)の開発者が開発の事、プログラミングネタ、ITエンジニアの転職などについて書いています。

【初心者向け】ゲームで遊ぶだけでJavaScriptが学べる7つのサイトが楽しすぎる!

f:id:paiza:20180226134702j:plain
Photo by Chase N.
f:id:paiza:20140916135428p:plainこんにちは。谷口です。

JavaScript初心者の皆さんは、これからどうやって勉強を進めていこうと考えていますか?

プログラミング初心者の人が勉強を始めるとなると

  • 独学でどう勉強したらいいのか分からない
  • 経験者向けの解説を読んでも難しい

といった悩みもあるかと思います。

そんな中、最近はゲーム感覚で楽しくJavaScriptを学べるサイトやサービスがかなり増えてきました。勉強するのは大変だけど、ゲームやクイズを通して遊び感覚で学べたら続けやすいですよね。

そこで今回は「初心者だけどJavaScriptを楽しく勉強したい!」という方のために、ゲーム感覚で楽しくJavaScriptを学べるサイトを紹介していきます。

最近は、こういった遊び感覚でプログラミングについて学べるサイトやサービスがかなり増えてきましたので、以前より学習のハードルはかなり下がっていると思います。


【目次】

自分でプログラミングした3Dロボットを動かせる対戦ゲーム

Code Warriors

f:id:paiza:20170516125220j:plain
Code Warriorsは、3Dロボットの動きを自分でプログラミングして対戦させることができるゲームです。

ロボットはパーツや武器を交換してアップグレードすることもできます。自分のロボットを強くするためにカスタマイズをしながら、効率のよいコードの書き方を楽しく考えることができます。オンラインで友達と対戦することも可能です。

Code Warriorsについて詳しく解説している記事はこちら
paiza.hatenablog.com

コードを書いて美少女を集めよう!プログラミングが学べる本格無料ゲーム

コードガールこれくしょん

paizaが公開しているコードガールこれくしょん略してガルこれは、美少女ナビゲーターと一緒にプログラミング問題を解いて「コードガール」を集めながらストーリーを進めていくことができます。

ゲーム内ではクエスト報酬やログインボーナス・ミッションクリア等の各種特典として手に入る「コイン」や「ダイヤ」を使って、ガチャでさまざまな「コードガール」を収集することができます。クエストで有利になる特殊スキルを発動させたり、「これくしょん」に入れてマイページに飾ったりと、コードガールをたくさん集めるほど楽しみ方が広がります。

JavaScriptだけでなくPHPRubyPythonJavaC言語C++C#にも対応しています。

効率いいエレベーターのアルゴリズムを考えるゲーム

Elevator Saga

f:id:paiza:20160530175817p:plain
Elevator Sagaは、エレベーターのアルゴリズムJavaScriptで書くゲームです。

何秒間のうちに何人を運ぶなどといった条件がステージごとに決まっているので、クリアを目指してコードを追記・修正したりしながら、エレベーターの動きを制御します。

f:id:paiza:20160530181858p:plain

エンジニアの方なら、エレベーターがなかなか来なくて「どんなアルゴリズムで動かしとるんや……」と思った経験があると思いますので(ない?)、効率のよい動きをさせるためにぜひチャレンジしてみてください!シンプルですが意外にハマります。

プログラミング×異世界転生ファンタジーRPG

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


ロジックサマナー~閃光の召喚プログラマ』は、さまざまな難易度の封印(※プログラミング問題)を解くことで進める異世界ファンタジーRPGです。

主人公はひょんなことから異世界に迷い込んだITエンジニア。異世界では、なんとプログラミングしたコードが召喚獣を呼び出すための詠唱魔法だった!?召喚魔法(※プログラミング)が使える主人公は急に世界を救う伝説の召喚士として盛大に歓迎されてしまい……。

あなたのプログラミングスキルを駆使しながら、世界に平和を取り戻しましょう!ゲームはメインシナリオ以外にも、高難度問題の解答スコアを競うランキングモードがあり、世界中のプレイヤーとプログラミングスキル対決ができます。また、プレイスタイルに応じた称号システムやキャラクター・アイテムのコレクションなども可能です。

JavaScriptだけでなくPHPRubyPythonJavaC言語C++C#Scala、Swift、Goなど多数の言語に対応しています。

戦略をプログラミングして勝利を目指す美麗グラフィックゲーム

Empire of Code

f:id:paiza:20160530173224p:plain
Empire of Codeは、「自分の部隊をどう動かして敵地を攻めるか」をプログラミングしながら進めていく戦略ゲームです。

f:id:paiza:20160530173943p:plain

武器や兵隊等を選択すると、エディタが表示されますので、右側に出るドキュメントを読みながら動きをカスタマイズしていきましょう。

f:id:paiza:20160530174000p:plain

ビジュアルも本格的で美しく、「どうしたら勝てるか?」の戦略を考えていくのが楽しいゲームです。Empire of Codeについて詳しく解説している記事はこちら。
paiza.hatenablog.com

プログラミングで理想の彼女ができる!?

paizaオンラインハッカソンVol.7 プログラミングで彼女をつくる


アンドロイド彼女の「安藤 杏(あんどう あん)」ちゃんと同居生活を始めたあなた。プログラミング問題をどんどん解いて、杏ちゃんの着せ替えアイテムを集めたり、2人の親密度を上昇させたりしてください。


レアアイテムの問題は少々難しめですが、ノーマル問題はpaizaスキルチェックで言うとD問題レベル(初心者向け)です。

JavaScriptだけでなくPHPRubyPythonJavaC言語C++C#Scala、Swift、Goなど多数の言語に対応しています。

豊富な問題と対応言語で自分の腕試しに最適!

Codewars

f:id:paiza:20160530175914p:plain

Codewarsは、クイズ形式で豊富なプログラミング問題を解くことができます。レベル付けやユーザーランキングもあったりするので、自分の実力をはかることもできますよ。

f:id:paiza:20160530182047p:plain

問題に正解すると、他人の回答コードを見ることができるので勉強になります。とにかくたくさんプログラミング問題が解きたいという人におすすめです。

まとめ

初心者がプログラミングを学ぶに当たり、環境構築も書き方の勉強も独学で一から始めるとなるとかなり大変ですよね。上記のようなゲーム感覚でプログラミングを学べるサービスで「気軽に遊んでみる」のは、プログラミングに楽しく触れるよいきっかけになるかと思います。

さらに、勉強してある程度の基礎が身につきましたら、ぜひpaizaスキルチェックでご自分のスキルをはかってみてください!





paizaラーニング」では、未経験者でもブラウザさえあれば、今すぐプログラミングの基礎が動画で学べるレッスンを多数公開しております。

そして、paizaでは、Webサービス開発企業などで求められるコーディング力や、テストケースを想定する力などが問われるプログラミングスキルチェック問題も提供しています。

スキルチェックに挑戦した人は、その結果によってS・A・B・C・D・Eの6段階のランクを取得できます。必要なスキルランクを取得すれば、書類選考なしで企業の求人に応募することも可能です。「自分のプログラミングスキルを客観的に知りたい」「スキルを使って転職したい」という方は、ぜひチャレンジしてみてください。

paizaのスキルチェック





※このブログで紹介しているキャンペーンやイベント、およびサイト内の情報については、すべて記事公開時の情報となります。閲覧されたタイミングによっては状況が変わっている場合もございますのでご了承ください。

ITプログラマー・エンジニア転職・就活・学習のpaiza

プログラミング入門講座|paizaラーニング

PHP入門編Ruby入門編Python入門編Java入門編JavaScript入門編C言語入門編C#入門編アルゴリズム入門編AI機械学習入門

エンジニアのためのプログラミング転職サイト|paiza転職

プログラミング スキルチェックエンジニア求人一覧

未経験からエンジニアを目指す人の転職サイト|EN:TRY

プログラミング スキルチェックエンジニア未経験可求人一覧

エンジニアを目指す学生の就活サイト|paiza新卒

プログラミング スキルチェックエンジニア求人一覧

ブラウザを開くだけで エディタ、Webサーバ、DB等の開発環境が整う|PaizaCloud