2025年7月、quick-idea-starter を整備した。アイデア検証用のフルスタック雛形。元々は「Any SaaS Idea」という名前で作り始めて、途中で今の名前に変えた。

狙いははっきりしていて、アイデア検証の最大の敵は環境構築。思いついてから動くものになるまでの摩擦をゼロに近づけたかった。48時間で形にするなら、最初から全部入りのテンプレが要る。

含まれるもの

  • DevContainer(Bun + yolo エイリアス = claude --dangerously-skip-permissions
  • React + TypeScript + Vite + TailwindCSS
  • Supabase クライアント + Google OAuth(PKCE フロー)
  • React Router + ProtectedRoute で認証必須ルート
  • Biome(lint / format)
  • Vitest + Playwright(ユニット + E2E)
  • Cloudflare Pages デプロイ設定
  • .kiro/specs/ に requirements / design / tasks、CLAUDE.md も同梱
git clone https://github.com/ryus1234/quick-idea-starter.git
# VS Code → F1 → Reopen in Container

ハマったところ

一番手こずったのは OAuth コールバックの扱い。最初、ハッシュフラグメントから access_token を拾う実装にしていたんだけど、うまくいかない。調べたら、Supabase はデフォルトで PKCE フローなので、トークンじゃなくてクエリパラメータの code が来る。/auth/callbackexchangeCodeForSession に渡す形に直して、ようやく通った。

認証まわりは「動いた後」も E2E のテスト項目(ログイン → コールバック → ログアウト → UI 切替)を詳細に書いておいた。ここが壊れると全部止まるので。

学び

雛形に「認証 + テスト + DevContainer + AI 用のコンテキスト(CLAUDE.md / .kiro specs)」まで入れておくと、新しいアイデアを試すときの初速がまるで違う。AI コーディング前提だと、人間用 README より、エージェントが読む仕様とコンテナ定義の方が効く、というのを実感した。

おわり

「環境構築をテンプレに固める」というのは、結局この後の自分の開発スタイルの軸になった。アイデアごとに作り直すんじゃなくて、雛形を育てて使い回す。48時間ルールの本体は、たぶんこの考え方の方。