個人開発で月 10 万円を目指す Cloudflare スタック構成

# cloudflare-saas-stripe-starter

個人開発で月 10 万円を目指すときのベースとなる、**Cloudflare Workers + D1 + Stripe** の最小 SaaS スターター。
[記事本文](https://r43lab.com/blog/cloudflare-saas-100k-stack) と対になる実動リポジトリです。

## Quick start

```bash
bun install

# D1 作成 → ID を wrangler.jsonc に貼る
npx wrangler d1 create saas

# マイグレーション
npx drizzle-kit generate
npx wrangler d1 migrations apply saas --local
npx wrangler d1 migrations apply saas --remote

# Secrets 登録
wrangler secret put STRIPE_SECRET_KEY       # sk_live_... or sk_test_...
wrangler secret put STRIPE_WEBHOOK_SECRET   # whsec_...

# ローカル dev (Stripe CLI で webhook をフォワード)
bunx wrangler dev
# 別ターミナル:
# stripe listen --forward-to localhost:8787/webhook/stripe
```

## 含まれるもの

- `/webhook/stripe` — Stripe Webhook を受けて D1 の `subscriptions` を upsert する最小ハンドラ
- `/api/me/subscription` — 自分のサブスク状態を返す保護 API の雛形
- `subscriptions` テーブル — id / customerId / status / currentPeriodEnd
- `migrations/0000_subscriptions.sql` — drizzle-kit 生成済みマイグレーション

**認証機能は本スターターに含まれていません**。Better Auth + D1 の最小テンプレと組み合わせる想定で、認証済み customer_id とサブスクを紐づけるシンプルな構造です。

## 依存バージョンについて

`package.json` は **記事執筆時点 (2026-04) のスナップショット** です。Stripe SDK と Cloudflare 周辺はよく更新されるので、clone 後は一度最新化を推奨。

```bash
bun outdated
bun update
```

## Stack

Hono v4 · Drizzle ORM · Stripe SDK v22 · Wrangler v4 · Cloudflare Workers + D1

import { defineConfig } from "drizzle-kit";

export default defineConfig({
  schema: "./src/schema.ts",
  out: "./migrations",
  dialect: "sqlite",
});

-- drizzle-kit generate で自動生成される想定のマイグレーション。
-- スキーマ変更時は drizzle-kit で再生成して追記する。
CREATE TABLE `subscriptions` (
	`id` text PRIMARY KEY NOT NULL,
	`customer_id` text NOT NULL,
	`status` text NOT NULL,
	`current_period_end` integer NOT NULL,
	`updated_at` integer NOT NULL
);
CREATE INDEX `subscriptions_customer_id_idx` ON `subscriptions` (`customer_id`);

{
  "name": "cloudflare-saas-stripe-starter",
  "private": true,
  "type": "module",
  "scripts": {
    "dev": "wrangler dev",
    "deploy": "wrangler deploy",
    "db:gen": "drizzle-kit generate",
    "db:local": "wrangler d1 migrations apply saas --local",
    "db:remote": "wrangler d1 migrations apply saas --remote",
    "tail": "wrangler tail --format=pretty"
  },
  "dependencies": {
    "drizzle-orm": "^0.45.2",
    "hono": "^4.12.14",
    "stripe": "^22.0.2"
  },
  "devDependencies": {
    "@cloudflare/workers-types": "^4.20260420.1",
    "drizzle-kit": "^0.31.10",
    "typescript": "^6.0.3",
    "wrangler": "^4.84.0"
  }
}

import { Hono } from "hono";
import { HTTPException } from "hono/http-exception";
import Stripe from "stripe";
import { drizzle } from "drizzle-orm/d1";
import { eq } from "drizzle-orm";
import { subscriptions } from "./schema";

type Bindings = {
  DB: D1Database;
  STRIPE_SECRET_KEY: string;
  STRIPE_WEBHOOK_SECRET: string;
};

const app = new Hono<{ Bindings: Bindings }>();

app.get("/", (c) => c.text("cloudflare-saas-stripe-starter ok\n"));

// ── Stripe Webhook ────────────────────────────────────────
// raw body を text で取ること・構築は constructEventAsync を使うことの 2 つが肝。
app.post("/webhook/stripe", async (c) => {
  const sig = c.req.header("stripe-signature");
  if (!sig) return c.text("no signature", 400);

  const body = await c.req.text();
  const stripe = new Stripe(c.env.STRIPE_SECRET_KEY);

  let event: Stripe.Event;
  try {
    event = await stripe.webhooks.constructEventAsync(
      body,
      sig,
      c.env.STRIPE_WEBHOOK_SECRET
    );
  } catch {
    return c.text("invalid signature", 400);
  }

  const db = drizzle(c.env.DB);

  switch (event.type) {
    case "customer.subscription.created":
    case "customer.subscription.updated": {
      const sub = event.data.object;
      // Stripe API 2025-03-31 以降、current_period_end は Subscription 本体から
      // Subscription Item (sub.items.data[i]) に移った。単一プランなら index 0。
      const periodEnd = sub.items.data[0]?.current_period_end;
      const periodEndDate = periodEnd ? new Date(periodEnd * 1000) : new Date();

      await db
        .insert(subscriptions)
        .values({
          id: sub.id,
          customerId: sub.customer as string,
          status: sub.status,
          currentPeriodEnd: periodEndDate,
          updatedAt: new Date(),
        })
        .onConflictDoUpdate({
          target: subscriptions.id,
          set: {
            status: sub.status,
            currentPeriodEnd: periodEndDate,
            updatedAt: new Date(),
          },
        });
      break;
    }
    case "customer.subscription.deleted": {
      const sub = event.data.object;
      await db
        .update(subscriptions)
        .set({ status: "canceled", updatedAt: new Date() })
        .where(eq(subscriptions.id, sub.id));
      break;
    }
    // 他のイベントは必要になったら追加する:
    //   invoice.payment_failed  → Slack / メールで通知
    //   invoice.payment_succeeded → 領収書メール
  }

  return c.text("ok");
});

// ── サブスク状態を返す保護 API の雛形 ─────────────────────
// 実運用では認証ミドルウェアで customerId を c.set して使う。
app.get("/api/subscriptions/:customerId", async (c) => {
  const customerId = c.req.param("customerId");
  const db = drizzle(c.env.DB);

  const rows = await db
    .select()
    .from(subscriptions)
    .where(eq(subscriptions.customerId, customerId))
    .all();

  if (rows.length === 0) throw new HTTPException(404, { message: "no subscription" });
  return c.json(rows[0]);
});

app.onError((err, c) => {
  if (err instanceof HTTPException) return err.getResponse();
  console.error(err);
  return c.json({ code: "internal", message: "unexpected error" }, 500);
});

export default app;

import { sqliteTable, text, integer } from "drizzle-orm/sqlite-core";

// Stripe Subscription を最小表現で受ける。
// Better Auth の user テーブルと customer_id で繋ぐ想定。
export const subscriptions = sqliteTable("subscriptions", {
  // Stripe の Subscription ID (sub_xxx) をそのまま主キーに
  id: text("id").primaryKey(),

  // Stripe の Customer ID (cus_xxx)。自サービスの user.id とは別管理。
  customerId: text("customer_id").notNull(),

  // "active" | "trialing" | "past_due" | "canceled" | "unpaid" | "incomplete" | "incomplete_expired" | "paused"
  status: text("status").notNull(),

  // 現サブスクリプション期間の終了(= 次回の請求 / 停止予定)
  currentPeriodEnd: integer("current_period_end", { mode: "timestamp" }).notNull(),

  // 最終更新。webhook でこのフィールドを毎回更新する。
  updatedAt: integer("updated_at", { mode: "timestamp" }).notNull(),
});

export type Subscription = typeof subscriptions.$inferSelect;

{
  "compilerOptions": {
    "target": "ES2022",
    "module": "ESNext",
    "moduleResolution": "Bundler",
    "lib": ["ES2022", "WebWorker"],
    "types": ["@cloudflare/workers-types"],
    "strict": true,
    "noEmit": true,
    "skipLibCheck": true,
    "resolveJsonModule": true,
    "isolatedModules": true,
    "verbatimModuleSyntax": true
  },
  "include": ["src/**/*"]
}

{
  "$schema": "node_modules/wrangler/config-schema.json",
  "name": "cloudflare-saas-stripe-starter",
  "main": "src/index.ts",
  "compatibility_date": "2026-04-01",

  "d1_databases": [
    {
      "binding": "DB",
      "database_name": "saas",
      "database_id": "<paste id from `wrangler d1 create saas`>",
      "migrations_dir": "migrations"
    }
  ],

  // STRIPE_SECRET_KEY / STRIPE_WEBHOOK_SECRET は必ず Secret で登録する。
  //   wrangler secret put STRIPE_SECRET_KEY
  //   wrangler secret put STRIPE_WEBHOOK_SECRET
  // vars に書くとコード公開と同義になるので絶対 NG。

  "observability": {
    "enabled": true
  }
}