Cursos Empresas Blog Live Conf Eventos Precios

Proyecto 2: Tu producto en línea, capturando datos reales

Publica la página de un producto o servicio (real o inventado por ti) que no solo se vea bien, sino que funcione: cuando alguien se interesa y deja sus datos, esa información se guarda de verdad en una base de datos. Aquí está la diferencia entre "hice una web con IA" y "construí un sistema". Debe incluir:

Una propuesta de valor clara: qué es el producto, para quién es y por qué debería importarle.
Un formulario de contacto o registro cuyos datos se guarden en una base de datos real (Supabase, por ejemplo), no un botón decorativo.
Diseño responsive: que se vea bien en celular y en computador.
Tú decides el producto, el estilo visual y qué datos pedir. Bonus si investigas tu mercado con IA antes de definir la propuesta.

Cursos recomendados:

¿Cómo compartir mi proyecto?

Publica tu proyecto en la sección de comentarios de esta clase.
Incluye una breve descripción: qué producto es, para quién y cómo funciona la captura de datos.
Agrega un link público a tu página para que Platzi y la comunidad puedan verla y dejar sus datos de prueba.
Comparte tu proyecto en redes sociales, con amigos y familia. ¡Cualquier persona puede votar, no necesita suscripción!

Proyecto 2 - Julio 11

The Vibecoders League 2.0

Clase 3 de 11

Clase 3 / 11

Comentarios (74)74 comentarios

Roberto Zuñiga

Hace 4 meses

Altura ☕ — Tu producto en línea capturando datos reales

Creé la landing de Altura, una marca (ficticia) de café de especialidad colombiano que vende un lote limitado de una sola cosecha en pre-orden. La propuesta de valor gira en torno a tres cosas que la investigación de mercado mostró que convierten: frescura (se tuesta solo cuando ordenas, roast-to-order), trazabilidad (finca El Mirador, Pitalito–Huila, 1.850 msnm, variedad Caturra, proceso lavado, puntaje SCA 86.5) y escasez (solo 300 bolsas del lote).

Lo importante: no es una web decorativa, es un sistema. El formulario de pre-orden (nombre, correo, ciudad, cantidad, molido) guarda los datos de verdad en una base de datos real (Supabase). La validación ocurre en el servidor, tiene un honeypot anti-spam, y la seguridad usa Row Level Security con política solo-INSERT — o sea, el sitio puede registrar reservas pero nunca exponer los datos de otros clientes.

Diseño responsive (se ve bien en celular y computador), estilo editorial cálido. Stack: Astro + Cloudflare Workers + Supabase. Como bonus, investigué el mercado de café de especialidad DTC con IA antes de definir la propuesta.

👉 Pruébalo aquí (déjame una pre-orden y queda registrada de verdad):

Carlos Montufar

Hace 4 meses

Roberto, Altura comunica muy bien tres razones para comprar: frescura, trazabilidad y escasez. La información de la finca, variedad, proceso y puntaje hace que el café se sienta auténtico, mientras que la política RLS de solo inserción demuestra que también cuidaste la seguridad. Como mejora de conversión, mostraría desde el inicio el precio y una fecha estimada de entrega de la preventa.

Te invito a visitar Quincena Bajo Control y contarnos qué tan clara y confiable te parece nuestra propuesta: https://platzi.com/comentario/5676340/

Si te gusta el proyecto, no olvides dejarnos tu me gusta. ¡Éxitos con ese primer lote!

Carlos Hernández

Hace 4 meses

🥑 Proyecto 2: Frutería Santa Elena — producto en línea con datos reales

Link público:

Contraseña trabajador o dueño: fruteriaSantaElena01*

Siguiendo con el proyecto del Reto 1, convertí la frutería con asistente en una tienda funcional donde la persona no solo mira productos: puede armar un pedido, dejar sus datos y guardar la solicitud en una base de datos real.

## 🛍️ Producto publicado

El producto es una tienda de fruta fresca para hogares, cocinas pequeñas y personas que quieren comprar con orientación clara. La propuesta de valor es:

comprar fruta según el momento de consumo, con precios, unidades, disponibilidad y reglas visibles.

La tienda muestra tres productos principales:

🍊 Papaya Maradol
🍋 Limón Tahití
🥑 Aguacate Hass

Cada ficha tiene unidad de venta, precio vigente y disponibilidad desde Supabase.

🧾 Captura de datos real

El flujo no tiene botones decorativos. Cuando una persona arma su carrito puede:

🛒 cotizar el pedido

📍 elegir retiro o domicilio

👤 dejar nombre

📱 dejar teléfono

🏠 dejar dirección si pide domicilio

✅ confirmar y crear un pedido pendiente

Ese pedido se guarda en Supabase con líneas, contacto, total, modalidad y estado.

## 📦 Pedido grande / cotización

Además agregué un flujo para compras grandes. Si alguien quiere abastecer su negocio o pedir muchas unidades, puede enviar una solicitud sin que el sistema prometa precio, stock ni entrega automáticamente.

El equipo interno revisa la solicitud, contacta al cliente y solo después puede convertirla en pedido pendiente.

🔐 Operación interna

El proyecto incluye un panel privado con roles:

👷 **Trabajador:** gestiona pedidos, cotizaciones e inventario sin ver costos ni margen.

👩‍💼 **Dueña:** ve métricas, presupuesto de IA y puede aprobar cambios sensibles o convertir cotizaciones.

🛠️ Tecnologías usadas

⚡ Next.js 16
🗄️ Supabase Cloud
🐘 PostgreSQL
🔐 Supabase Auth + RLS
🧠 OpenAI Responses API
🔎 pgvector
▲ Vercel
🎭 Playwright
🧪 Vitest

✅ Cómo cumple el reto

Este proyecto cumple el Reto 2 porque:

✅ tiene una propuesta de valor clara
✅ está publicado públicamente
✅ funciona en celular y computador
✅ tiene formularios reales, no decorativos
✅ guarda pedidos y solicitudes en Supabase
✅ separa cliente público, trabajador y dueña
✅ recalcula precios y zonas desde servidor
✅ no descuenta inventario hasta aprobación humana
✅ incluye evidencia visual, pruebas y despliegue real en Vercel

Lo presento como continuación natural del Reto 1: primero construí el asistente que conoce el negocio; después lo conecté con una tienda real que captura datos y permite operar pedidos desde una base de datos.

Carlos Montufar

Hace 4 meses

Carlos, esta evolución de la frutería va mucho más allá de una landing: combina catálogo, carrito, pedidos reales, cotizaciones grandes y un panel con permisos diferenciados para trabajador y dueña. Me gustó especialmente que el servidor recalcule precios y zonas, y que el inventario no se descuente hasta una aprobación humana. Una recomendación importante de seguridad: retiraría la contraseña del comentario público y compartiría un acceso de demostración limitado o temporal.

Te invito a visitar nuestro proyecto Quincena Bajo Control y dejarnos tus comentarios sobre la claridad, la confianza y la experiencia de la página: https://platzi.com/comentario/5676340/

Si te gusta la propuesta, también agradeceríamos mucho tu me gusta. ¡Excelente evolución desde el Reto 1!

Carlos Hernández

Hace 4 meses

Gracias Carlos Montufar por tu comentario, en este caso se dejo la contraseña para que pudieran entrar y visualizar el portal del trabajador y dueño. Agradezco tus recomendaciones!

Proyecto 2 - Julio 11

Progreso del curso

Introducción y proyectos