推しアイデア
二郎系ラーメンでは”コール”と呼ばれる呪文のようなものがあります... 初めて行くには怖い...緊張する... そんなあなたのために！！！ アプリで簡単ずんだもんコール！！ コールをずんだもんにしゃべらせることが出来ます！
58hack-jirou
二郎系ラーメン専用のwebアプリケーション
作った背景
チームメンバーの3/5が二郎系ラーメンが好き！！！ 考えてみたら二郎系ラーメン専用のアプリは聞いたことがなく開発することに！既存アプリはあったもののUIが古かったり機能が少なかったりしたのでより良い専用アプリケーションを！！と思い開発に至りました。
推し技術
cloudflare メンバー全員が初めてのcloudflare環境で開発しました！初見のため難しかった場面もありましたがデプロイが楽だったりD1・R2といったDB.ストレージが簡単に扱え、学習・開発共にいい体験になりました。
プロジェクト詳細
プロダクト概要
初心者向けの二郎系ラーメン専用アプリケーション
機能
auth
jwtを使って認証
map
MAPBOXAPIで保存された店舗を表示
口コミ
店舗別の口コミ
写真投稿
コール
自分がよく頼むコールを保存しVOICEVOXAPIで音声出力
技術スタック
フロントエンド(web)
Next.js
cloudflare pages
バックエンド(api)
Hono/Drizzle/D1
cloudflare works
アーキテクチャ
全体
フルスタックTSだったのでTurborepo(monorepo構成)を採用
フロントエンド・バックエンド共にレイヤードアーキテクチャを採用
frontend
backend
infra
voicevoxapiの接続
[PC] ↓ SSH [EC2] ├─ Docker │ ├─ アプリ用コンテナ │ └─ Nginxコンテナ └─ Wrangler ↓ Cloudflare Workers ↓ workers.devで公開
頑張ったところ
チーム内でアーキテクチャの学習とアーキテクチャに沿った開発
レビューを使った開発
GitHubActionsでCICD
Cloudflareでdev/main デプロイ
AI活用
アーキテクチャや技術の学習に使用
コード生成で時短＋レビューでコードの綺麗さを保てた
懸念点
企画
中間発表でのレビューを聞いて企画の爪が甘かったので今後はしっかり企画をねっていきたい
API
ボイスボックスのAPIを使用したがCloudflare環境ではそのAPIが使えなかったためAWSを構築した。技術選定の際にもっと念入りに調べておくべきだった
map
クエリで二郎系ラーメンだけを取ってくるのが難しくDB保存という形でmapを実装、お金かけてGooglemapを使うべきだった
まとめ
懸念点はあるもののメンバー個々が初めての技術、環境で学習しながらの開発ができ知見や学習になり得るものがあって良かった
