web
Cloudflare D1でゲームランキングを実装 - 完全無料のサーバーレスDB入門
Cloudflare D1を使ってゲームのグローバルランキング機能を実装する方法を解説。SQLiteベースのサーバーレスDBで、無料かつ永続的なデータ管理を実現します。
2025-12-219 min readAdabana Saki
-views
CloudflareD1SQLiteNext.jsサーバーレスゲーム開発
Cloudflare D1でゲームランキングを実装
ゲームにランキング機能を追加したい。でも、データベースの運用コストや管理が心配...
そんな悩みを解決するのが Cloudflare D1 です。
この記事では、テトリスゲームにグローバルランキング機能を実装した実例を元に、D1の使い方を解説します。
なぜCloudflare D1？
他のBaaSとの比較
| サービス | 無料枠 | 注意点 |
|---|---|---|
| Supabase | PostgreSQL | 7日間アクセスなしで停止 |
| PlanetScale | MySQL | 無料プランは終了 |
| Firebase | NoSQL | 複雑なクエリが苦手 |
| Cloudflare D1 | SQLite | 制限なし・永続 |
D1を選ぶ理由:
- 完全無料（制限緩い）
- 自動停止なし
- SQLite互換（馴染みやすい）
- Cloudflare Pagesと統合済み
- グローバルレプリケーション
D1の制限（無料枠）
| 項目 | 制限 |
|---|---|
| データベース数 | 無制限 |
| ストレージ | 5GB |
| 読み取り | 500万回/日 |
| 書き込み | 10万回/日 |
個人プロジェクトには十分すぎる容量です。
実装の全体像
Text
実装するもの:
- D1データベースとスキーマ
- APIエンドポイント（Functions）
- フロントエンドのカスタムフック
Step 1: D1データベースの作成
Wrangler CLIのインストール
Bash
データベース作成
Bash
出力:
Text
wrangler.tomlに追加
TOML
Step 2: スキーマ設計
db/schema.sql
SQL
ポイント:
CHECK制約でmodeの値を制限- インデックスで検索を高速化
created_atで登録日時を自動記録
マイグレーション実行
ローカルで確認:
Bash
本番に適用:
Bash
Step 3: APIエンドポイント
functions/api/games/leaderboard.ts
TypeScript
セキュリティポイント:
- ニックネームの長さ制限
- スコアの型チェック
- SQLインジェクション対策（プリペアドステートメント）
Step 4: フロントエンド実装
hooks/useLeaderboard.ts
TypeScript
オフライン対応のポイント:
navigator.onLineで接続状態を監視- ローカルストレージにキャッシュ
- オプティミスティック更新（即座にUIに反映）
- 失敗時もローカルに保存
Step 5: CI/CDでマイグレーション自動化
.github/workflows/d1-migrate.yml
YAML
注意: API TokenにはD1:Edit権限が必要です。
使用例：ゲームコンポーネント
TSX
まとめ
Cloudflare D1を使えば、完全無料でゲームランキングを実装できます。
- 無料で永続的（停止リスクなし）
- SQLite互換で学習コスト低い
- Cloudflare Pagesと統合で簡単
- オフライン対応も実装可能
- CI/CDでマイグレーション自動化
SupabaseやFirebaseの無料枠制限が気になる方は、D1を試してみてください。