Template SaaS con Webhooks

Template SaaS basado en webhooks para productos que necesitan sincronizar el estado de billing de Commet dentro de su propia base de datos. Usa los webhooks de Commet como fuente de verdad para acceso del cliente, estado de suscripcion, pagos, uso e historial local de eventos.

Stack: Next.js 16, Better Auth, Drizzle ORM, PostgreSQL, Commet SDK

Inicio Rapido

git clone https://github.com/commet-labs/commet.git
cd commet/examples/webhooks
pnpm install
pnpm dev

Que Incluye

• Dos planes publicos con precios mensuales y anuales
• Tres funcionalidades medidas: Llamadas API, Almacenamiento, Envios de Email
• Flujo de checkout y activacion de suscripcion
• Endpoint firmado para recibir eventos de Commet
• Registro idempotente de eventos antes de correr handlers criticos
• Sincronizacion de estado desde customer.state_changed
• Actualizaciones de uso desde usage.recorded
• Feed local para inspeccionar webhooks recibidos
• Dashboard con plan, estado, renovacion y acceso por funcionalidades

Archivos Clave

• app/api/webhooks/commet/route.ts — Endpoint firmado con log de eventos e idempotencia
• lib/billing/sync.ts — Sincronizacion del snapshot de estado del cliente
• lib/billing/usage.ts — Persistencia de eventos de uso
• lib/webhooks/events.ts — Registro local de eventos webhook
• app/(dashboard)/dashboard/events/page.tsx — Feed de webhooks
• app/(dashboard)/dashboard/page.tsx — Vista general del estado de billing
• app/pricing/page.tsx — Precios dinamicos desde planes de Commet

Setup en Produccion

• Agregar COMMET_API_KEY de tu organizacion sandbox o live de Commet
• Agregar COMMET_WEBHOOK_SECRET desde el endpoint de webhook en Commet
• Configurar NEXT_PUBLIC_APP_URL con la URL deployada
• Registrar /api/webhooks/commet como endpoint de webhook en Commet
• Suscribir el endpoint a eventos de customer, subscription, payment, invoice, checkout y usage

Mas Informacion

• Webhooks
• Modelos de Consumo
• Registrar Uso
• Portal de Cliente