Proyecto 8 - Julio 17
Contenido del curso
Proyecto 8: Clona tu app favorita
Hoy entras al territorio de los agentes de código: herramientas como Claude Code, Cursor o Codex, donde tú diriges y el agente programa.
El reto: recrea la funcionalidad esencial de una app que uses todos los días. Tu propio Wordle, un acortador de links, un divisor de cuentas entre amigos, un pomodoro, una lista de tareas con lo que siempre quisiste que tuviera. No necesitas saber programar. Necesitas saber pedir, revisar y corregir. Debe incluir:
Cursos recomendados:
¿Cómo compartir mi proyecto?
Kevin Gualteros
Wilfredo Morales
Geordy Elian Reyes Mendoza
Roberto Zuñiga
Vanesa Andrea Paco Alvarez
Geordy Elian Reyes Mendoza
Max Rodriguez Flores
Charles Castillo Rosas
Diego Martinez
Miguel Angel Moreno C.
Marco Aurelio
Roberto Pantaleón Merino
Geordy Elian Reyes Mendoza
Roberto Pantaleón Merino
Marco Aurelio
Marco Aurelio
Miguel Angel Moreno C.
Geordy Elian Reyes Mendoza
Raul Oidor
Geordy Elian Reyes Mendoza
Raul Oidor
CESAR MAURICIO RUIZ TULANDE
Edwin Zarate
Juan Palomera
TERESA DEJESUS RAMOS PACHACA
Jose Morales Caqui
Dayana Silvestre
María de los Ángeles Torres Monterrey
Sebastián Hernández Cáceres
Jose Isaias Santiago Villatoro
LingoHorizon - Beyond every lesson, another horizon.
Inspirado en apps de aprendizaje de idiomas como Busuu, Duolingo y English-Spanish, creé LingoHorizon: un coach de idiomas (español ↔ inglés) con vocabulario, práctica real y progreso.
🔗 App:
Cómo lo construí:
• Prototipo y publicación con Lovable (versión gratuita)
• Planificacion del proyecto y estructura con Codex
• Backend, lógica de aprendizaje, ejercicios y funciones con Cursor
La app incluye:
• Listas de vocabulario (crear, editar, importar CSV)
• 13 tipos de ejercicios jugables + rutina diaria
• Repaso espaciado (SRS), racha y pantalla de progreso
• Coach con IA: listas inteligentes, misiones, prep de viaje y vocabulario de películas
• Versión web + APK Android
Mi mejora propia: no solo “ganar XP”. El coach genera listas y misiones según lo que necesitas (viaje, serie, objetivo), y además detecta pares que confundes para repasarlo después. El progreso vive en tu dispositivo.
🎂 Proyecto 8 — Agenda Ponquesito: un Calendly para reservar tortas
Para este reto cloné la mecánica principal de Calendly, pero adaptada a Familia Ponquesito, un emprendimiento de repostería en Barquisimeto.
En lugar de reservar reuniones por hora, la aplicación permite reservar capacidad real de producción según la complejidad de cada torta:
🍰 Torta sencilla: 1 punto 🎨 Torta personalizada: 2 puntos 🏰 Diseño complejo o de varios pisos: 3 puntos
La persona describe la torta que necesita, consulta fechas realmente disponibles, selecciona una fecha y completa su solicitud. El sistema evita sobreventas incluso cuando dos clientes intentan tomar el último cupo al mismo tiempo.
También incluye:
✅ Calendario con disponibilidad real ✅ Anticipación mínima de 3 días ✅ Clasificación automática del pedido ✅ Código único de reserva ✅ Confirmación por correo ✅ Notificación interna al negocio ✅ Enlace privado para consultar la solicitud ✅ Reprogramación y cancelación ✅ Liberación automática de capacidad ✅ Integración con el sistema de leads de Familia Ponquesito ✅ Seguridad, idempotencia y prevención de reservas duplicadas
Mi toque personal sobre Calendly fue cambiar el concepto de “espacios disponibles” por capacidad ponderada de producción, porque una torta sencilla y una torta compleja no requieren el mismo esfuerzo.
El proyecto fue construido dirigiendo agentes de código con Claude Code y Codex, revisando cada etapa, corrigiendo decisiones y verificando el resultado con pruebas automatizadas y pruebas reales contra Supabase.
🌐 Prueba Agenda Ponquesito:
💻 Repositorio:
Familia Ponquesito — Hecho con amor, para compartir. 💛
¡Bien evolucionado el proyecto! El salto de "capacidad de producción real" en vez de "slots de tiempo" es la clave correcta — clonar Calendly tal cual hubiera sido un error, porque una torta de 3 pisos no consume lo mismo que una sencilla.
Que hayas validado la prevención de sobreventa con dos clientes tomando el mismo cupo a la vez, con idempotencia y liberación automática de capacidad, dice mucho: eso normalmente se salta en un prototipo de reto y vos lo probaste contra Supabase real.
Mi único pero: el formulario del paso 1 pide bastante antes de siquiera mostrar una fecha (personas, sabor, pisos, personalización, referencia, descripción, tema). Le reduciría los campos a lo mínimo indispensable para calcular la capacidad (pisos + personalización, que es lo que define los puntos), y dejaría el resto (sabor, tema, imagen de referencia) para el contacto posterior una vez ya aseguró su fecha — así bajás la fricción de entrada sin perder información, solo la movés a un momento donde el cliente ya está comprometido.
¡Muy sólida la ejecución igual, se ve un producto completo!
Platzidle — mi clon de Wordle, pero de tech
Para "Clona tu app favorita" recreé Wordle… con un giro: la palabra secreta siempre es un término del mundo de la programación (PYTHON, DOCKER, KUBERNETES, TOKEN…) y, al terminar cada partida, el juego te explica el término y te recomienda un curso real de Platzi para aprenderlo. 🎓
Lo que le metí de mío:
- 🟩 Wordle funcional de verdad (se juega, no es maqueta): 6 intentos, colores, teclado en pantalla.
- 📏 Largo de palabra variable (el tablero se adapta a cada término).
- 🔁 Reto diario + modo práctica ilimitada.
- 💡 Pista de categoría y una tarjeta final que te lleva al curso de Platzi.
Lo más interesante fue el proceso: lo construí dirigiendo un agente de código (Claude Code) — yo decidía qué, revisaba y corregía; el agente programaba. Flujo completo: idea → diseño → plan
→ implementación con tests. Incluso una revisión final atrapó un bug real de estadísticas antes de publicar.
Stack: Astro + Cloudflare Workers, TypeScript, 26 tests. Sin backend, sin trampas.
👉 Juégalo:
StoryFlow AI ✨ mi clon de Adobe Storyboardmaker
Los directores, videógrafos y agencias aún pierden horas documentando escenas en Adobe express, Illustrator o Canva.
Los storyboards generados con IA se ven increíbles, pero no sirven para producciones profesionales.
Por eso desarrollé un prototipo que transforma referencias visuales en un storyboard técnico con documentación automatizada.
👩💻 Testealo acá:
¿Cómo funciona?
Pruébalo y dime qué te parece.
Nunca había usado una herramienta así, pero sin duda me parece muy útil — hasta me dieron ganas de armar un video solo para probarla. Bien lograda y súper intuitiva de usar.
Lo que más rescato es el enfoque técnico: no es "generar una imagen bonita de storyboard con IA" (que ya existe en montones de herramientas), sino documentar tipo de plano, composición y ángulo a partir de referencias reales — eso es lo que de verdad ahorra tiempo en preproducción a un director o videógrafo. Y que exporte a JSON además de PDF es un plus, porque permite integrarlo a otras herramientas del flujo de producción en vez de quedar como un documento cerrado.
¡Buen trabajo, se nota que resuelve un problema real de la industria audiovisual!
Proyecto 8: Clona tu app favorita
Para esta entrega no cloné una app cualquiera: tomé lo que hace de Wordle algo adictivo —un reto nuevo cada día, un solo intento y las ganas de volver mañana— y lo llevé al mundo de los videojuegos. Así nació gameology.co, un juego diario donde no adivinás palabras, sino que ordenás juegos. Clonar no es copiar la interfaz; es entender qué hace funcionar a la app original y recrear ese motor con tu propia vuelta.
¿Cómo funciona el reto?
Pueden probar los retos del día ingresando al siguiente enlace:
🚀 Para el reto de hoy desarrollé ChronoDex, un Pomodoro gamificado.
La dinámica es simple:
⏱️ Inicias una sesión de concentración de 25 minutos. 🚫 Si abandonas la aplicación o cambias de pestaña, el tiempo comienza a retroceder. 🎴 Si logras completar la sesión sin rendirte, recibes una carta coleccionable al azar. 🦖 Cada carta nueva se añade a tu colección de especies.
Demo:
Quise experimentar con una forma diferente de motivar las sesiones de concentración mediante la gamificación.
Si tienen unos minutos para probarlo, me encantaría conocer su opinión sobre la experiencia. ¡Toda retroalimentación es bienvenida! 🙌
SplitShare: App para distribuir gastos
Dividir cuentas cuando sales con amigos o viajas siempre es un dolor de cabeza, y las apps grandes a veces complican todo obligando a todos a crearse una cuenta. La lógica matemática del balance (minimizar deudas) es algo que a los agentes de código se les da increíblemente bien resolver.
Vídeo demo:
Para este proyecto clone <u>Discord</u> y le puse unas funciones extra
link:
Clone discord para clonarlo use codex y google ai studio en la web puedes hablar con tus amigos y hacer una llamada con ellos para hablar, la idea me surgió por que abecés cuando estoy en llamada con mis amigos jugando algo y tengo que investigar algo de un juego me toca abrir google y hacer la investigación mano, pero ahora con esta web al estar en una llamada con un amigo le integre ia para que puedas resolver dudas sobre lo que estas hablando con tus amigos
no me deja agregarte :( pero está 10000 IQ
¿Qué app cloné?
Recreé la funcionalidad esencial de comunicación de Slack (canales, chat en tiempo real y división de espacios de trabajo), combinada con un panel de agenda diaria inspirado en Notion Calendar. El resultado es una aplicación web colaborativa desplegada en Render que unifica la comunicación y la gestión del tiempo en una sola pantalla.
¿Qué agentes usé?
Dirigí la construcción utilizando una estrategia de doble motor: Claude Code como agente principal para levantar la arquitectura técnica, refactorizar la lógica del servidor (Node.js, WebSockets y MongoDB Atlas), y Gemini para la ideación estratégica del producto y la resolución de problemas de infraestructura en la nube.
¿Qué le mejoré?
Le implementé una mecánica de "cero fricción administrativa". A diferencia de los chats corporativos tradicionales donde los acuerdos se pierden en el historial, integré un motor de extracción de intenciones. Si un compañero escribe en el canal "nos vemos mañana a las 10am para revisar los presupuestos", el sistema detecta automáticamente la fecha y hora, y renderiza al instante la cita en el calendario lateral de todos los usuarios conectados. Elimina por completo el trabajo manual de coordinar y agendar reuniones.
Muy buena idea unir chat y agenda en una sola pantalla, y el motor de extracción de intenciones es el verdadero diferenciador — eso resuelve un dolor real de cualquier equipo remoto, donde los acuerdos de reunión quedan enterrados en el scroll del canal y alguien tiene que ir a crear el evento a mano después. Automatizarlo en el momento en que se escribe es "cero fricción" de verdad, no solo de palabra.
Que hayas combinado WebSockets + MongoDB Atlas para el chat en tiempo real y una segunda IA (Gemini) para la parte de infraestructura y estrategia muestra buen criterio de "la herramienta correcta para cada problema", en vez de forzarlo todo con un solo agente.
Una pregunta: ¿qué pasa si el mensaje es ambiguo ("nos vemos la otra semana para lo de siempre")? Sería interesante saber cómo maneja el sistema esos casos donde no hay fecha/hora explícita, para no crear eventos fantasma en el calendario de todos.
Gracias Geordy, respondiendo a tu duda, en un principio le especifique a la IA que tomara la fecha de hoy y calculara de que fecha hablaban, por ejemplo si decian mañana o el viernes, lo calcula a partir de la fecha de hoy, si habia contemplado algunos mensajes ambiguos que podria surgir, pero ahora que me comentas de ese mensaje, lo que haria seria tomar en cuenta las semanas tambien, definir en que semana se encuentra al momento del mesaje y registrarlo a la semana siguiente, pero seria mas como notificiones que solo aparezca ahi en la seccion de proximos eventos, no se registrarian como tal en el calendario. Voy a continuar mejorandolo para manejar los mensajes ambiguos, te invito a que entres al link y pruebes las funciones que tiene hasta ahorita, Gracias
Cuando salió la primera versión de Minecraft te podías registrar en la página, pues también podrás registrarte para Woroft en la siguiente página, espero que les guste la Alfa cuando algún día la puedan probar 💚
el reciclaje es bueno, por eso se hace con las botellas de plástico
como fue que dijiste duo reciclaje en un proyecto que recicle xd bueno me gusto que hayas clonado y reciclado jsjs lo de la primera vercion de la pagina de minecraft
bro te invito a ver mi automatización de esta clase y decirme que opinas y si te gusta dame un like :0
🍄 Cloné Forest de mis apps favoritas que mas utilizo… pero acá cultivás hongos de verdad y aprendés sobre ellos.
Planté una espora, me concentré 25 minutos y terminé cosechando una Amanita muscaria — y descubriendo que vive en simbiosis con los pinos. Eso es Micelio.
Es un timer de enfoque: te concentrás y crece un hongo. Si abandonás antes de tiempo, se marchita y no cuenta. Cada sesión completada suma un hongo a tu micelio, una red que se expande con tu constancia.
🤖 Agente: Claude Code — dirigí todo el desarrollo paso a paso, sin escribir el código a mano.
✨ Mi toque personal:
Probalo sin cuenta (¡y podés votar!): 🔗 App: 💻 Repo:
Hola, Bloque — Pomodoro con memoria
Todos usamos un Pomodoro en algún momento y todos lo olvidamos en dos días, porque no queda registro de nada: cierras la pestaña y esos 25 minutos desaparecen.
Bloque resuelve eso: es un temporizador de enfoque real —arranca, pausa, reinicia, ciclos de enfoque/descanso configurables— pero cada bloque completado queda en una bitácora del día: qué tarea trabajaste y a qué hora. Sin login, sin backend, sin nube: todo vive en tu navegador.
El twist: no es solo un reloj, es un log de tu enfoque. Al final del día ves exactamente en qué invertiste tus bloques, y una racha (🔥) que te empuja a no romper el hábito.
Cómo se construyó: dirigido con Claude
Me gusta la idea, ataca un problema que casi nadie resuelve bien: todos los Pomodoros del mercado son buenos cronómetros, pero pésimos para dejar registro. Que la bitácora diaria y la racha 🔥 sean el verdadero producto (y el timer solo el vehículo para generarla) es un ángulo inteligente.
Que todo viva en el navegador sin login ni backend es una decisión de producto válida para empezar rápido y sin fricción, aunque ahí también veo el límite: si cierras el navegador por accidente o cambiás de dispositivo, ¿se pierde la bitácora? Sería bueno aclarar eso, porque es justo el mismo dolor que buscás resolver (perder el registro).
Muy bien lograda la ejecución con Claude Code en un solo archivo, y se nota el cuidado en pasar de "que funcione" a un look propio y con carácter.
Gracias
Virtual dj
He clonado el mezclador de virtual dj, usando claude code y google ia studio
Pruébalo aquí:
🎥 Puedes ver el proyecto completo aquí:
⛪💻 Para este reto de Vibe Coders de Platzi creé una aplicación con Claude Code para administrar iglesias mediante un modelo de suscripción.
La plataforma permite registrar personas, crear usuarios administradores y llevar el historial completo de cada miembro dentro de la iglesia, incluyendo sus actividades, procesos y acompañamientos.
Una solución real creada con Vibe Coding para organizar mejor la información y facilitar el seguimiento de la comunidad.
#VibeCoders #Platzi #ClaudeCode #VibeCoding #DesarrolloWeb
Proyecto 8: Clona tu app favorita — Foco
Cloné una aplicación de temporizador Pomodoro y la llamé Foco. La construí dirigiendo a Codex como agente de programación.
La aplicación incluye:
🔗 Probar la aplicación
🎥 Ver el video explicativo
y lo que me faltaba
¿Te cuesta entrar en estado de Flow al estudiar o trabajar? 🧠⚡
Todos conocemos la técnica Pomodoro, pero sabemos que 25 minutos de silencio a veces no son suficientes para ganarle a las distracciones.
Para este reto, decidí tomar mi app de productividad favorita (Pomofocus) y llevarla al siguiente nivel. 🚀Una versión donde se combina la clásica técnica de intervalos con:
Pásate a probarla, deja tu voto y cuéntame en los comentarios qué nuevas ideas se pueden agregar.
👉 Prueba la app gratis
🔗
👉 Repositorio en github
💻
Agente : my buen amigo Cursor
Saludos :)
wow! increíble antes tenia que abrir 2 ventanas. felicidades!
📝 PUBLICACIÓN COMPLETA PARA EL PROYECTO 8: ✨ Mi Proyecto 8: Clona tu app favorita
Publica tu proyecto en la sección de comentarios de esta clase.
Incluye una breve descripción: 📱 ¿Qué app clonaste? Recreé una aplicación de lista de tareas, una herramienta que uso todos los días para organizar mis actividades y proyectos. 🤖 ¿Qué agente usaste? La construí dirigiendo Claude Code: yo solo le di instrucciones claras de lo que necesitaba, él escribió todo el código, yo probé su funcionamiento y le pedí ajustes hasta que quedó perfecta, sin necesidad de saber programar. 💡 ¿Qué le mejoraste? A diferencia de las listas de tareas comunes, esta versión ya trae categorías predefinidas especialmente para organizar eventos en Panamá: Salón, Comida, Música, Decoración, Invitados, Trámites y Presupuesto, para que planificar sea mucho más rápido y ordenado.
🔗 Enlace público para probar la aplicación / ver la demo: [AQUÍ PEGAS TU ENLACE PÚBLICO, O ENLACE AL REPOSITORIO + VIDEO]
Comparto este proyecto en redes sociales, con amigos y familia para que puedan verlo y votar por mí sin necesidad de suscripción.
Incluye una breve descripción: 📱 ¿Qué app clonaste? Recreé una aplicación de lista de tareas, una herramienta que uso todos los días para organizar mis actividades y proyectos. 🤖 ¿Qué agente usaste? La construí dirigiendo Claude Code: yo solo le di instrucciones claras de lo que necesitaba, él escribió todo el código, yo probé su funcionamiento y le pedí ajustes hasta que quedó perfecta, sin necesidad de saber programar. 💡 ¿Qué le mejoraste? A diferencia de las listas de tareas comunes, esta versión ya trae categorías predefinidas especialmente para organizar eventos en Panamá: Salón, Comida, Música, Decoración, Invitados, Trámites y Presupuesto, para que planificar sea mucho más rápido y ordenado.
¿Qué app cloné? La mecánica esencial de un DAW (estación de audio digital, estilo Cubase): grabar, secuenciar y mezclar música. Todo funciona de verdad y corre 100% en el navegador, sin instalar nada.
¿Qué agente usé? Claude Code. Yo dirigí (qué construir, el alcance, las decisiones y la corrección de bugs) y el agente programó. Fui pidiendo, revisando y corrigiendo fase por fase — el proceso fue tan parte del reto como el resultado.
¿Qué le mejoré / mi toque personal?
🔗 Pruébala (¡cualquiera puede votar, sin suscripción!): ▶️ Video demo: 🌐 App: 💻 Código:
Recomendado en Chrome o Edge de escritorio. ¡Toca, graba un beat y expórtalo! 🎶
ajaj