CodeRush

https://github.com/nka21/CodeRush

Next.js

Go

GitHub

AWS

TailwindCSS

見抜け、バグ。解き明かせ、意図。

naoki

清水大雅

knomura

takayuki mase

推しアイデア

エンジニアに馴染み深い、ターミナル風UIを採用。 リアルタイム対戦によって仲間と競い学ぶことが出来る。

作った背景

夏といえばプログラミング! 未来のエンジニアの為に 楽しく、競いながら、学べるクイズアプリが欲しい!

推し技術

GitHubの進捗管理のおかげで個々の役割が明確になった。 Cladueのデザイン案がUI作成に大きく役立った。

プロジェクト詳細

概要

本アプリは、プログラミング学習者が「コードリーディング力」をゲーム感覚で鍛えるためのクイズアプリです。

使用技術

フロント  :TypeScript, Next.js, TailwindCSS バックエンド:Go, Echo, Gorllia データベース : DynamoDB

ゲームプロセス

・ホーム画面 [Make room]ボタンを押すとホストとして部屋を作成できます。その際にランダムで生成される4桁の数字が部屋のIDになるのでそれを共有すれば同じ部屋に合流できます。 [Join room]部屋IDの入力画面が出てくるので、そこで入力することで参加ができます。

・待機画面 1~4人までゲームに参加可能です。 正常に部屋に参加できた場合一覧に追加されていきます。 [Return home]ボタンは全プレイヤー共通で表示されていて、押すとホーム画面に戻ります。 [Start game]ボタンがホストにのみ表示されていて、押すとクイズゲームの画面に移ります。

・ゲーム画面 制限時間(30秒)内に、画面中央のコードの期待される出力を画面下部の4つの選択肢から選択して回答します。 回答者は一人のみで正誤にかかわらず次の問題に移ります。 10問目が終了した時点でゲームが終了し、結果画面に移ります。

・結果画面 ランキングを表示します。同着の場合は次の順位を飛ばした順位が付与されます(例:1位が2名の場合は3, 4位と続く)。 [待機画面に戻る] ボタンが押されると待機画面に戻ります。再選したい場合やルームを作り直したい場合にこのボタンを押します。 [問題の確認]ボタンが押されると出題された10問とその答えが確認できます。

展望

今回実装できなかったが今後実装していきたい機能としては、 ・C言語以外の言語を選択できる機能 ・難易度を選択する機能 ・問題の解説 ・AIによる問題の生成 などが挙げられるので、今後の課題としていきます。

naoki

@naoki