はじめに
私事ですが去年の10月に結婚式をあげました！結婚式の準備をほとんど妻に任せてしまった代わりに、なにか自分でやらねばと思い…。
そういえば、「上司が以前結婚式クイズのアプリを作っていたな」と思い出し、今回はAWSではなくGCP版で作ろうと考え、作成しました。
参考にした記事はこちらです！
エンジニア夫婦が自分たちの結婚式用にプロフィールサイトとウェブアプリを作った話
作ったもの
結婚式の余興で行う、結婚式クイズをwebアプリケーションで構築しました。 基本的にはデザイン・フロント・バックエンド・GCPのインフラ周りすべて私一人で行いました。 スマホで見たときの細かい見た目の調整や問題の内容については二人で決めました。結婚式当日
受付時にエスコートカードと併せて、クイズサイトのQRコードを載せたカードをお渡ししました。
参列者の方にはこのQRコードを読み取っていただいて、クイズ画面を開く。
フルネームを入力いただき、全8問の4択クイズを回答という流れです。
アーキテクチャ
GCPをつかっためちゃくちゃシンプルなサーバーレス構成です。 DBを持たないで、Spreadsheetを回答のデータベースとして使っています。 理由は、結果発表のときにサクッとスマホで見れるから。
ちなみにこの構成だと基本リクエストによる従量課金になり、結婚式の参列者（90名位）の規模であればほぼ料金は発生しません。
ここも推しポイントです。
Cloud Run Functions
| 無料枠 | 実際の使用量 | |
|---|---|---|
| リクエスト数 | 200万回/月 | 約180回 (90名 × 2API) |
| コンピュート | 400,000 GB秒/月 | 数秒レベル |
Firebase
| 無料枠 (Sparkプラン) | 実際の使用量 | |
|---|---|---|
| ストレージ | 10 GB | 数MB (React build) |
| 転送量 | 360 MB/日 | 90名アクセスで数十MB程度 |
Google Sheets API
- 個人のGoogleアカウント利用なら無料
- APIクォータ: 300リクエスト/分 → 180回は余裕
GitHub Actions
- パブリックリポジトリなら無料・無制限
- プライベートでも無料枠2,000分/月に対し、デプロイは数分のみ
フロントエンド
ReactでコーディングしたwebアプリをFirebaseにホスティングしました。 WebサイトのURLもここで変えて、QRコードにしたって感じです。 GitHub Actionsを使って、GitへのCommitをトリガーにソースのビルド、Firebaseへのデプロイができるようにしています。バックエンド
回答をSpreadsheetにまとめたり、回答済みの名前をチェックしたりするAPIをPythonでコーディングしました。 名前をチェックして未回答だったらクイズ画面、回答済みだったら自分の回答と答えを表示できるような切り分けをしていました。 最初に回答した名前と違う名前を入力したら再回答できる、みたいな穴はありましたが、まさかそんな人はいないだろうと高をくくっていました（笑）もちろんいなかったですが（笑） これもGitHub Actionsを使ってCloud Run Fuctionsにデプロイしています。さいごに
一から構成を考えて構築するというのは初めての試みだったですが、うまくいってよかったです。 正直誰でもできるような簡単な構成でしたし、コーディングに関してはAI駆動で行ったということもあり、短い期間でいいものが作れたんじゃないかなと思います。 それでも皆さんに喜んでいただけたことが何より嬉しかったです。最後に、ご参列いただいた親族や友人、そしてアイレットでお世話になっている方々への感謝を込めて、本記事の締めくくりとさせていただきます。
皆様のおかげで、一生の思い出に残る最高の門出となりました。本当にありがとうございました。