「MAGIC WORD」は、ひらがなを集めて“自分だけの言葉”を生み出す、ひらがなクラフトゲームです。
ストアで文字を集め、組み合わせてワードを作成。公開すると、みんなの「いいね」でワードが育ち、ステータスも強くなっていきます。 言葉づくりのセンスと発想が、そのまま成長の力になるのが魅力です。
ゲームの流れ: ひらがなを集める → ワードを作る → 公開する → いいねで育つ → レベルアップ
| 技術 | 役割 |
|---|---|
| Next.js (App Router) | Reactベースのフルスタックフレームワーク |
| React | コンポーネントベースのUI構築 |
| TypeScript | 型安全な開発で品質を担保 |
| TailwindCSS | ユーティリティファーストのスタイリング |
| next-intl | 日本語・英語の多言語対応 |
| React Hook Form + Zod | フォーム管理とバリデーション |
| 技術 | 役割 |
|---|---|
| Supabase | データベース・認証を提供するBaaS |
| PostgreSQL | リレーショナルデータベース。アクセス制御をDB層で実装 |
| Next.js API Routes | サーバーサイドのビジネスロジック |
| Server Actions | フォーム処理などサーバー側で直接実行 |
| 技術 | 役割 |
|---|---|
| Vercel | ホスティング・CI/CD（GitHubと連携し自動デプロイ） |
| Supabase Cloud | マネージドデータベース・認証基盤 |
| OG画像動的生成 | SNSシェア時のプレビュー画像をサーバーサイドで自動生成 |
ユーザー
↓
Vercel（Next.js / App Router）
├── React + TailwindCSS（UI）
├── API Routes（ビジネスロジック）
└── OG画像生成
↓
Supabase
├── PostgreSQL（データ永続化）
└── Auth（Email + Google OAuth）7テーブル構成で、ユーザー・ひらがな・ワード・いいね・通知を管理。 ゲームロジックの整合性はサーバーサイドのトランザクション処理で担保しています。