背景
- ふと子供の身長どのぐらいだっけ？と思った
- あと何cm延びたら、あそこのアトラクション乗れるんだっけ？と考えた
- 測った後にあのアトラクション乗れるようになった！と言えるとお互いに嬉しそう
- そんなサービスがあれば、測るのが楽しくなるかな
試してみた
- Claudeと壁打ち開始
- ClaudeCodeで実装中
技術スタック
| レイヤー | 採用技術 | 選定理由 |
|---|---|---|
| フロントエンド | Next.js 14+（App Router / TypeScript） | モバイルファースト対応、SEO効果あり、SSR/SSG対応 |
| スタイリング | Tailwind CSS + shadcn/ui | 高品質UIコンポーネントをすぐ使える。開発速度が大幅に向上 |
| バックエンド | Next.js API Routes | フロントと同一リポジトリで完結。構成がシンプル |
| 認証・DB | Supabase（PostgreSQL） | 認証・DB・Storageを一括提供。個人開発の運用コストを最小化 |
| 認証方式 | Google / Apple / メール+PW | Supabase Auth で3方式を標準対応。実装コストほぼゼロ |
| 画像ストレージ | Supabase Storage | 施設画像・ユーザーアイコンの保存に使用 |
| ホスティング | Vercel | Next.jsとの親和性最高。GitHubへのpushで自動デプロイ |
| 想定コスト | MVP段階はほぼ無料 | Vercel無料枠＋Supabase無料枠で十分。スケール後に有料プランへ |
