Documentación

Tutoriales por semana

Semana 2 · MVP con auth y core feature

Google login y el CRUD central del producto, sobre tablas pre-modeladas.

Next.jsSupabaseAuthCursor

La Semana 1 te dio una página; esta semana te da un producto: usuarios que entran con Google, un dashboard solo para ellos, y tu primera feature guardando datos de verdad en la base.

Qué vas a tener al final

  • ✅ Las tablas de tu base de datos verificadas y funcionando (las subiste en el Quick start).
  • ✅ Login con Google funcionando.
  • ✅ /dashboard protegido — solo usuarios logueados entran.
  • ✅ Tu core feature: el CRUD genérico (core_items) adaptado a tu dominio (ej. "leads", "recetas", "proyectos"). CRUD = crear, leer, editar y borrar registros.

Lo que debes tener antes

Paso 1 · Verifica tus tablas en Supabase

Las tablas ya las subiste en el Paso 6 del Quick start (Semana 1). Antes de construir encima, confirma que están:

Checkpoint

✅ En el dashboard de Supabase → Table Editor ves las tablas: profiles, waitlist, core_items, ai_conversations, ai_messages, tool_calls, events. ✅ Escribe un email en el formulario de tu landing (en localhost:3000) y refresca la tabla waitlist — el email aparece como fila.

¿No están las tablas? Ve al Paso 6 · Sube el schema a Supabase — son 3 comandos en la terminal de Cursor, y ahí dice dónde está tu project-ref y qué contraseña te va a pedir. Regresa aquí cuando el Table Editor muestre las tablas.

Paso 2 · Activa el login con Google

Todo el recorrido vive en la guía dedicada — son clicks en Google Cloud y en Supabase, más un prompt al final. Ahí vas a:

  1. Copiar tu Callback URL desde Supabase (Authentication → Providers → Google).
  2. Crear las credenciales en Google Cloud (consent screen + OAuth client, todo con clicks).
  3. Pegar el Client ID y el Secret en Supabase y habilitar el provider.
  4. Prender features.googleAuth en tu app con un prompt para Cursor.

→ Sigue Login con Google (paso a paso) (~20 min con calma — es la parte con más pantallas nuevas de la semana; la guía incluye los errores típicos como redirect_uri_mismatch).

Regresa aquí cuando puedas entrar con Google en localhost:3000/login.

Checkpoint

En localhost:3000/login haces click en Entrar con Google, eliges tu cuenta y vuelves a la app con la sesión iniciada. Al entrar, /dashboard te deja pasar; en una ventana de incógnito (sin login), te redirige a /login.

Paso 3 · Convierte core_items en TU feature

El boilerplate trae un CRUD genérico llamado core_items — una pantalla donde el usuario crea, ve, edita y borra "cosas". Esta semana esas "cosas" se convierten en la entidad central de tu producto. Rellena las llaves y pégalo en Cursor:

Prompt para Cursor — tu core feature
Adapta la feature core_items de este proyecto VibeFast a mi producto.Mi producto: {describe tu producto en 1 frase}.
Mi entidad principal es: {ej. "leads", "recetas", "proyectos"} — en singular, {ej. "lead"}.
Cada una tiene estos campos: {lista 3-5 campos con su tipo, ej: nombre (texto), presupuesto (número), estatus (nuevo/contactado/cerrado)}.Requisitos:
Renombra todo lo visible en la UI (títulos, botones, formularios, columnas) a mi entidad.
Ajusta el formulario de crear/editar y la lista para mostrar mis campos.
Si necesitas cambiar la base de datos, crea una migración nueva en supabase/migrations/ y dime exactamente qué comando debo correr.
Mantén el login y la protección de rutas como están.
Al final dime qué archivos cambiaste y en qué URL pruebo mi feature.

Si Cursor te pidió correr un comando

Probablemente es supabase db push (para aplicar la migración nueva). Córrelo en la terminal y verifica en el Table Editor que el cambio se vea. Si algo truena, pégale el error exacto a Cursor.

Paso 4 · Pruébalo como si fueras tu cliente

Recorre el flujo completo, de afuera hacia adentro, como lo haría tu ICP:

Checkpoint

✅ Entras con Google desde /login. ✅ En el dashboard creas 2–3 registros de tu entidad con datos reales. ✅ Editas uno y borras otro — la lista se actualiza. ✅ En Supabase → Table Editor, las filas están ahí con tus campos.

Paso 5 · Deploya la nueva versión

Haz commit y push de tus cambios (pídele a Cursor: "haz commit y push de todo lo de esta semana con un mensaje descriptivo") — Vercel redeploya solo. Dos ajustes para que el login funcione en tu URL pública:

  1. En Supabase → Authentication → URL Configuration: pon tu URL de Vercel en Site URL, y en Redirect URLs agrega esa misma URL con /auth/callback al final (ej. https://tu-producto.vercel.app/auth/callback) — detalle en Supabase en producción.
  2. Verifica que en Vercel estén todas tus variables de entorno (las 3 de Supabase + NEXT_PUBLIC_APP_URL con tu URL real).
Checkpoint

En tu URL pública (no localhost): entras con Google y creas un registro desde el celular.

Entregable de la semana

Tu MVP funcionando en producción: la URL pública + un video corto (1–2 min) mostrando login con Google → crear un registro → verlo en la lista. Mándalo al docente con 1 frase: qué es tu entidad central y por qué.

Si te sobra tiempo

  • Dashboard a tu medida: pídele a Cursor que agregue a /dashboard un resumen arriba (ej. "cuántos leads tienes, cuántos nuevos esta semana").
  • Tracking: activa PostHog (Features → Analytics) y pídele a Cursor que registre 2–3 eventos clave (signup, crear registro, click en CTA).
  • Primeros usuarios reales: mándale tu URL a 2–3 personas de tu ICP y pídeles que se registren. Lo que se traben es oro para la Semana 6 (customer development).
AnteriorSemana 1 · Tu landing en vivoSiguiente Semana 3 · Tu primera función con IA