シェアしたくなる最新のWebサービス・ITニュース情報をチェック!
  • follow us in feedly

アプギガトップ > Webサービス > ソースコードの「バグ」を修正する速さを競うWebゲーム「CodeFights」で遊んでみた!
注目記事ピックアップ
匿名もOK!SkypeでWebコードエディタを共有できる「Interviews on Skype」が無償公開中!
share0
匿名もOK!SkypeでWebコードエディタを共有できる「Interviews on Skype」が無償公開中!
まだ進化を続けるGoogle検索の特殊機能12選をまとめてみた!
share0
まだ進化を続けるGoogle検索の特殊機能12選をまとめてみた!
登録不要!匿名で記事も公開できる究極にシンプルなWebエディタ「IO」が最高の使い心地だった!
share0
登録不要!匿名で記事も公開できる究極にシンプルなWebエディタ「IO」が最高の使い心地だった!
英語で「VR空間作って」と書くだけで、本当にWeb上でVR体験が実現する「GuriVR」を使ってみた!
share0
英語で「VR空間作って」と書くだけで、本当にWeb上でVR体験が実現する「GuriVR」を使ってみた!
JavaScriptでマインクラフト風の建造物が作れる無料Webアプリ「Web Blocks」で遊んでみた!
share0
JavaScriptでマインクラフト風の建造物が作れる無料Webアプリ「Web Blocks」で遊んでみた!
ブログ感覚でオンラインのプログラミング講座を作成・公開できる「educative」は課金機能も無料で利用可能!
share0
ブログ感覚でオンラインのプログラミング講座を作成・公開できる「educative」は課金機能も無料で利用可能!
思わずWeb開発したくなる最強のJavaScriptライブラリ7選が楽し過ぎてヤバイ!
share0
思わずWeb開発したくなる最強のJavaScriptライブラリ7選が楽し過ぎてヤバイ!
有名WebサービスのAPIをすべて同じ書き方でプログラミング可能な「RapidAPI」は、検索・テストもブラウザ上で実行可能!
share0
有名WebサービスのAPIをすべて同じ書き方でプログラミング可能な「RapidAPI」は、検索・テストもブラウザ上で実行可能!
編集ソフト不要!アップロードした画像のURLをいじるだけで多彩な加工編集を実現する「Scaley.io」が登録不要で無料公開中!
share0
編集ソフト不要!アップロードした画像のURLをいじるだけで多彩な加工編集を実現する「Scaley.io」が登録不要で無料公開中!
エアフォースワンの内部もVR空間に!Web上であらゆる場所を歩き回れる「Matterport 3D Gallery」の没入感がスゴイ!
share0
エアフォースワンの内部もVR空間に!Web上であらゆる場所を歩き回れる「Matterport 3D Gallery」の没入感がスゴイ!
Web上でプログラミングに特化したスクリーンキャストを無料で作れる「Scrimba」の革命的な機能がスゴイと話題に!
share0
Web上でプログラミングに特化したスクリーンキャストを無料で作れる「Scrimba」の革命的な機能がスゴイと話題に!
ブラウザ上でサイト構成図(マップ)を作成して複数人とコラボ連携可能な「FlowMapp」を使ってみた!
share0
ブラウザ上でサイト構成図(マップ)を作成して複数人とコラボ連携可能な「FlowMapp」を使ってみた!
筆跡がリアルに変化する「自作Webフォント」を生成可能な「Calligraphr」で自分用フォントを手書きしてみた!
share0
筆跡がリアルに変化する「自作Webフォント」を生成可能な「Calligraphr」で自分用フォントを手書きしてみた!
コピペ一発!どんなWebサイトもチャットサポートを無料で導入可能な「Crisp」を使ってみた!
share0
コピペ一発!どんなWebサイトもチャットサポートを無料で導入可能な「Crisp」を使ってみた!
「アプギガ!!」2016年の総まとめ!もう一度読みたくなる人気のバズ記事をまとめてみた!
share0
「アプギガ!!」2016年の総まとめ!もう一度読みたくなる人気のバズ記事をまとめてみた!
ブラウザから即起動!ゼロからSVG画像を作成できるWebエディタ「Vectr」が完全無料で公開中!
share0
ブラウザから即起動!ゼロからSVG画像を作成できるWebエディタ「Vectr」が完全無料で公開中!
1枚の写真だけで超リアルな3D顔面をWeb上で高速生成できる「3D Face Reconstruction」を使ってみた!
share0
1枚の写真だけで超リアルな3D顔面をWeb上で高速生成できる「3D Face Reconstruction」を使ってみた!
スクショ付きでブックマークを一元管理できるWebアプリ「Bookmark OS」を使ってみた!
share0
スクショ付きでブックマークを一元管理できるWebアプリ「Bookmark OS」を使ってみた!
「docs・Wiki・task」が融合した超軽量Webエディタ「Notion」の潜在能力が高過ぎる件!
share0
「docs・Wiki・task」が融合した超軽量Webエディタ「Notion」の潜在能力が高過ぎる件!
今すぐブラウザ上に「ライブ配信」のスタジオ環境をタダで構築できる「Lightstream」を使ってみた!
share0
今すぐブラウザ上に「ライブ配信」のスタジオ環境をタダで構築できる「Lightstream」を使ってみた!
Webサービス
ad 今の年収で満足ですか?
typeで転職した71%が年収アップ!
2015/07/08 21:30

ソースコードの「バグ」を修正する速さを競うWebゲーム「CodeFights」で遊んでみた!

codefights_01 どうも、まさとらん(@0310lan)です!

プログラミングで何らかの「エラー」が発生すると、いつも途中で諦めてしまう人に朗報です!

コード内に潜む「バグ(エラー)」を素早く発見し、正しいコードに修正する速さを競い合うWebゲームのご紹介です。

【 CodeFights 】
codefights_02 世界中の猛者とオンライン対戦し、競い合っているうちにプログラミング能力が飛躍的に高まるとして、海外で話題になっています。


どうやって使うの?
サイトにアクセスし、無料のユーザー登録を済ませると、自分専用の「マイページ」が表示されます。
codefights_03 このページから、さまざまなゲームを楽しむことができるようになっています。


早速オンライン対戦をやってみたいのですが、いきなり「対人戦」だと心配…という人のために「練習モード」が用意されています。
codefights_05

このモードは、簡単に言うと「CPU対戦」となっており、自分のレベルを上げることによって多彩なキャラと戦えるようになります。
codefights_06 まずは、初心者用のキャラクター「Ratiorg」を選択しましょう。


すると、メインの対戦画面が表示されます!
codefights_07 「CodeFights」では、出題された問題に対して、自分でコードを書くのではなく、すでにプログラミングされたコードを「読む」ことから始めるのが大きな特徴です。


そして、面白いことに必ず「バグ(エラー)」が潜んでいるのです!

そう! ユーザーは、このバグを素早く発見し、正しく動作するプログラムに修正しなければいけません。


コードを修正したら、「Run」ボタンをクリックして実行結果を確認することも可能です。
codefights_08 ただし、使用回数が決められているので、不用意に実行するとこの先の戦いが苦しくなってしまうので要注意…。


見事に正しいコードに修正できたら、「Correct!」が表示されます!
codefights_09

また、「Show Solution」ボタンをクリックすれば、答え合わせも出来るようになっています。
codefights_10

対戦が終了すると、結果が表示されて「経験値」と「コイン」を得ることができます。
codefights_11_1 この経験値を一定以上貯めることで、どんどんレベルアップしていくようになっています。


また、対戦をする度に自分の「ライフゲージ」が減少し、ゼロになると対戦できなくなります。
codefights_11_2 ライフゲージを回復するには、しばらく待つか「コイン」を使って回復する必要があります。
このあたりは、最近のスマホゲームに近い世界観かもしれません。


ある程度ゲームの基本が分かってきたら、今度は世界中の猛者たちに挑戦してみましょう!
codefights_12 対戦相手は、自動的にマッチングされる仕様となっています。


対戦相手よりも早く「コード」を修正すれば、得られる経験値は多くなります。
codefights_13 見知らぬ相手と戦っても良いし、社内のチームで楽しむのもアリでしょう!


まだある、こんな「ゲームモード」!
「CodeFights」では、対戦モード以外にもユニークなゲームが楽しめるようになっています。

例えば、「チャレンジモード」!
codefights_14

これは、世界中のユーザーが独自に作った問題に挑戦できるモードで、期待通りに動くプログラミングをする必要があります。
codefights_15 難しい問題が多いですが、その分たくさんの「コイン」をゲットできるチャンスとなっています。


他にも、「トーナメントモード」が用意されています。
codefights_16

これは、ほぼ毎日開催されており、複数人が参加して勝ち抜き戦によって「優勝」を目指すモードです。
codefights_17 だれでも参加できますが、すぐに枠が埋まってしまうので、挑戦したい人は注意深くチェックしておきましょう。


また、「フォーラム」も気軽にマイページからアクセスできるようになっているので、分からないことがあればすぐに投稿できるのも便利です。
codefights_18 このように、楽しみながらゲームで遊んでいるうちに、プログラミングのスキルがアップするだけでなく、「問題解決能力」も同時に向上するのが大きな魅力となっています。


「No.1」プレイヤーを目指そう!
自分のマイページからは、ユーザーランキングや国別ランキングなどを随時チェックできるようになっています。
codefights_19 歴代のランキングや、週間ランキングなどを閲覧できるようになっており、現在は「インド」がトップを維持しています。

ユーザーは、経験値を稼ぐ度にレベルが上がっていき、多彩な「バッジ」も獲得していきます。
さらに、対戦成績やトーナメンの状況なども、自動的にプロフィール画面に反映されていきます。
codefights_20 これにより、見知らぬユーザー同士でも、プロフィール画面を見ればだいたいどんな人なのかが分かるので便利です。

しばらく利用していると、他のユーザーから対戦を挑まれるケースもあったりするので、プロフィールの確認は意外と重要だったりします…。


おまけ
今回ご紹介した「CodeFights」のように、プログラミング能力を飛躍的に高めることができる他のWebサービスも合わせてご紹介しておきます。

【ソースコードを解析することで、プログラミング学習が可能になるWebサービスまとめ!】
codefights_21 プログラミング通りにしか動かないロボットを操縦して、世界中の人とオンライン対戦するサービスや、ソースコードを修正しながら遊ぶゲームなど、ちょっと変わった面白いサービスをまとめています。

これらのサービスを上手く活用すれば、もう「初心者」は卒業と言っても良いでしょう。

ご興味ある方は、ぜひ参考にしてみてください!


まとめ
ある程度、基本的なプログラミングが出来るようになってきたら、ぜひ今回ご紹介した「CodeFights」を試してみることをオススメします。

他人のソースコードを「読む」というのは、思った以上にスキルアップすることができます。

さらに、「CodeFights」で多彩なバグを修正していくことで、たいていのエラーは問題なく解決できるようになるでしょう。

スキルアップを目指す方は、ぜひ挑戦してみてください!


<参考>
「CodeFights」公式サイト



wirtten by まさとらん

まさとらん

国内外問わず「良いモノ」だけひたすら集めて情報共有してます。
厳選ネタはアプギガ内で分かりやすく情報発信中!
その他の旬なネタは、twitterにて発信してますので、お気軽にどうぞ!

twitter:0310lan

この記事を読んでいる人は、他にこんな記事も読んでいます。
Related Posts Plugin for WordPress, Blogger...

ページトップへ戻る