Yahiro Nakamoto

フロントエンド
UIデザイン

クイズアプリ mondai

今回作ったアプリ「mondai」は、ブラウザだけで簡単に使えるクイズアプリです。クイズアプリといっても、一人で淡々と解いていくというよりも、友達やイベントなど大人数で同時にクイズを解いていける、クイズ大会をオンラインで実現するサービスになっています。
例えば、友達同士で通話してる時、ちょっと手軽なミニゲームしたくなった時や、
イベントでのアイスブレイクに使うと、会話をつなげるツールになります!

サービスを作るきっかけ

作業しながら雑談の生配信を見ていた際に、大勢の視聴者が手軽に参加できるミニゲームのようなサービスがないことを気づきました。コロナ禍で「オンライン+娯楽」を提供できるツールが求められていましたし、自分も欲しかったのでその点をベースに考えはじめました。
そして、大勢のユーザーが気軽に参加でき、大人数で遊んだ時でも破綻せず、簡単な操作で楽しんでもらえるコンテンツとは何か考えた時に、クイズを使ったサービスを思い浮かびました。

開発期間

1ヶ月:178 commits
1ヶ月でなんとかリリースできました。

構成

Next.js + TypeScript + Firebase(Cloud Firestore)で構築しました。

TypeScriptを今回のプロジェクトで初めて1から使いましたが、Propsに対するIDEの補助がとてもよかったです!Next.jsもReactも今回の開発でほとんど初めて使いましたが、これまで使っていたNuxt.jsよりも自由度が高く素直に使えて良いなーとなっています。デプロイ先はもちろんVercelです。
処理に最低限必要なAPIの実装には、Next.jsのAPI Routeを使っています。しかし、Vercelに依存しすぎるのは結構リスクが高いので、スケールした場合には、Cloud Functionsにでも引っ越ししたいなと思っています。

Zennに記事を書きました

https://zenn.dev/yahiro/articles/aaec73767b8c00

GitHub

https://github.com/Yahirrro/mondai

受賞歴

N予備校 WEBアプリコンテスト2020冬 N高等学校部門 最優秀賞受賞
https://progedu.github.io/webappcontest/2020/winter/result/index.html

みにいく