“this.moveSpeed = Math.random() * 500;” で動く手作りバレンタイン@IT編集部から開発者見習いに贈る

» 2013年02月14日 00時00分 公開
[太田智美,@IT]

 2013年1月16日、ギブリーはアプリを開発しながらプログラミングを学べるオンラインプログラミング学習サービス「CodePrep」をリリースした。CodePrepは、「コードの概念は何となく知っていても、実際にアプリケーションを作ったことのない初心者」を対象としたサービスだ。CodePrepで学習することで、コードビューイングやサービス・アプリ開発のフローを理解できるようになることを目的として、設計されている。登録さえすれば、誰でも無料で学習できることも特徴だ。

 CodePrepには、開発フローが学べるいくつかの「トラック」があり、ユーザーはその中から学びたいアプリを選んで開発体験ができる。トラックには、診断アプリやじゃんけんアプリなどさまざまな種類があるが、その中から今回は2月限定バレンタインアプリ「Give me chocolate」トラックを実際に学んでみた感触を簡単にレポートする。

「Give me chocolate」 「Give me chocolate」

 Give me chocolateは、JavaScriptのプラグイン「jQuery」を利用したゲーム開発の大まかな流れについて学べるトラックである。ユーザー登録を行い、「このトラックで開発する」をクリックすると、早速問題が始まる。問題は4段階に分かれており、ステップアップしていく方式だ。

 CodePrepでは、左のページにある「コース」と「ヒント」を頼りに、右側のソースコードを書き変えて実行することで、開発フローを学んでいく。ステップ1ではまず、ゲームスタート処理の実行を学ぶ。

ステップ1

 正解すると、ステップ2に進むことができる。ステップ2では、制限時間の設定を学ぶ。

ステップ2

 同様に、ステップ3、ステップ4と実装を進めていくと、チョコレートミニゲームが完成する。

ステップ3
ステップ4

 実際に作りながら学んでいるため、Give me chocolateのトラックを終えるころには、文字や数字を自在に変えて楽しめるまでになっていた。今回は、ゲームの時間を8秒に、チョコレートの速さを“this.moveSpeed = Math.random() * 500;”と設定し、GETしたチョコレートの数によって出てくるコメントに手を加え、完成させた。

 Happy Valentine's day!

 ダブルクリックで、チョコを受け取ってください☆ 5コGETすると……?


Copyright © ITmedia, Inc. All Rights Reserved.

スポンサーからのお知らせPR

注目のテーマ

Microsoft & Windows最前線2025
AI for エンジニアリング
ローコード/ノーコード セントラル by @IT - ITエンジニアがビジネスの中心で活躍する組織へ
Cloud Native Central by @IT - スケーラブルな能力を組織に
システム開発ノウハウ 【発注ナビ】PR
あなたにおすすめの記事PR

RSSについて

アイティメディアIDについて

メールマガジン登録

@ITのメールマガジンは、 もちろん、すべて無料です。ぜひメールマガジンをご購読ください。