Estoy montando EL CURSO de vibe coding
Hoy te quiero explicar cómo estoy construyendo una plataforma de cursos con arquitectura modular (y por qué deberías adoptar esta estrategia)
¿Ya estás de vacaciones? ¡Espero que sí!
Como comenté en el último número de la newsletter, he hecho un parón por vacaciones para concentrarme en crear el curso de vibe coding. Así que estaría el mes de agosto sin publicar... Pero creo que sería bueno hacer una publicación sobre la plataforma del curso que estoy montando ^^
Puedes apuntarte aquí: vibehacks.es
¿Qué estoy montando?
Estoy montando un curso sobre vibe coding. Bueno, de hecho la idea es hacer varios cursos:
Uno de introducción (los básicos)
Otro troncal con todo lo necesario para construir cualquier cosa
Cursos satélites para trabajar herramientas o funcionalidades en concreto
En un principio creé la landing y mi idea era montar todo el curso en una sola web. Pero luego me di cuenta de algo: mi experiencia creando grandes proyectos me dice que, en cuanto crezcan un poco, se convierten en cosas difíciles de mantener, tanto para mí como para la IA.
Así que tomé una decisión: arquitectura modular.
¿Qué es la arquitectura modular?
Es dividir una aplicación grande en piezas independientes que pueden funcionar por separado pero se comunican entre sí. Como tener 4 apps diferentes que comparten la misma base de datos. Cada una hace su trabajo específico sin interferir con las demás.
Ventajas: más fácil de mantener, menos errores, y si una parte falla, las demás siguen funcionando.
¿Cómo se concreta todo esto?
vibehacks.es tiene 4 patas:
Landing
Verificador
Administración
Campus
Vamos a ver qué rol tiene cada una de ellas:
🎯 Landing
Aquí, a día 7 de agosto, tenemos simplemente una landing donde anuncio que "VibHacks is coming..." y un pequeño formulario para que dejes tu nombre y email. La típica waitlist.
Este formulario está conectado con una Edge Function de Supabase que, a su vez, está conectada con Resend.com, de manera que cuando te apuntas:
Yo guardo tu correo
Resend te manda un email informándote que te has apuntado con éxito a la lista de espera
(Espero que no tengas que esperar demasiado) 😄
Por cierto, si quieres ser de los primeros en enterarte cuando esté listo, apúntate a la waitlist: vibehacks.es
🤖 El Verificador
Esta es otra pata que estoy construyendo. Se trata de una funcionalidad independiente que, sí, podría haberla incluido en la landing, pero pensé en crear un subdominio dentro de vibehacks.es ya que puede funcionar de forma independiente.
Así, el día de mañana, si no la utilizo, no tengo que variar el código principal - simplemente la quitaré del flujo.
¿Cómo funciona?
Se me ocurrió que sería un buen win-win el que tú compartieras una publicación en tus RRSS sobre mi curso y yo te recompensara con un descuento. Pero no quería tener que estar pendiente de TODAS las personas que publicaran, así que pensé que sería interesante automatizar esta revisión.
El proceso es sencillo:
Te sugiero ejemplos de publicaciones (para que no empieces con la hoja en blanco)
Haces la publicación donde SÍ o SÍ tienen que aparecer elementos como la web "vibehacks.es", que estás empezando un curso, mi nombre o hablar sobre vibe coding
Tomas una captura de pantalla de la publicación
Subes la captura al verificador
El verificador evalúa la captura según parámetros que le he proporcionado
Si cumples los criterios, te da un X% de descuento para el curso troncal
(No te preocupes, también habrá un curso gratuito de iniciación para que puedas convencerte)
⚙️ Administración
Muchas veces he cometido el "error" de diseñar dashboards con elementos condicionales - que se muestran u ocultan según si es el administrador o un usuario "normal" quien los está viendo.
Pongo "error" entre comillas ya que no es exactamente un error, se puede hacer, pero si lo divides desde el principio, creo que luego todo va mejor. Al final es separar dependencias. Mi teoría es que va a ser más sencillo. Veremos.
La parte de administración, en el caso de vibehacks.es, es el core. Es de donde beben las otras páginas.
En administración he construido toda la infraestructura necesaria para crear:
Cursos → que tienen módulos → que tienen lecciones
Toda esta información se guarda en Supabase y luego es consumida por el resto de páginas.
🎓 El Campus
[Captura del campus/área de estudiante]
Por último tenemos el campus, que es donde tú verás el curso, donde aprenderás mis hacks sobre vibe coding. Quizá llamarlo campus sea demasiado grandilocuente, pero había que ponerle un nombre, y siempre se le pueden ir añadiendo nuevas funcionalidades.
En el campus, por el momento:
Tendrás tus cursos
Podrás apuntarte a ellos
Leer las lecciones
Ver vídeos
Marcar las lecciones como completadas
Momento en el que espero que recibas un email felicitándote por haber conseguido un nuevo hito y animándote a seguir aprendiendo :)
¿Por qué construirlo así?
Como te decía al principio, cuando construyes algo y prevés que sea grande, es importante tener presente las funcionalidades que va a tener tu aplicación.
¿Tiene sentido meterlo todo junto en un solo proyecto? ¿O estas funcionalidades son autónomas y pueden funcionar sin depender de las demás?
En mi caso, opté por hacer proyectos separados para tener más control y seguridad en un desarrollo grande como este.
En Lovable tengo 4 proyectos independientes:
Landing
Verificador
Administración
Campus
Puedo hacerlo así ya que ninguno depende de otro para funcionar. Bueno, si en el administrador no subo contenido, en el campus no habrá nada que mostrar ^^", pero puedo construir cada parte de manera independiente.
También es interesante por el tema del contexto y memoria dentro de un proyecto. Para mí Claude es el superman del vibe coding, pero aún así puede perder el contexto de lo que estás creando. Así que si se lo pones fácil, es menos probable que cometa errores.
¿Cómo se une todo esto después?
Secreto: ya está unido.
Como te comentaba antes, estas 4 páginas se interrelacionan usando el mismo proyecto de Supabase.
Sí, es posible usar la misma base de datos en cuatro proyectos distintos. Cuando estás en Lovable y seleccionas o creas un proyecto de Supabase para vincularlo con tu proyecto, este no queda bloqueado - sigues pudiendo conectarlo a nuevos proyectos.
Y esto es lo que hice.
(Luego viene la parte del despliegue en Vercel, configurar el dominio, las URLs, etc. Pero quizá te lo puedo comentar en otra publicación, ya que creo que esta ya ha quedado bastante densa ^^")
Quédate con lo importante
El curso sigue su marcha. Ya te puedes apuntar a la lista de espera.
De hecho, me haría MUCHA ilusión que entraras en vibehacks.es y dejaras tu email.
Es posible que te haya abrumado un poco este post, es posible que tengas dudas, así que te animo a dejar un comentario y preguntar todas las dudas que tengas!
Esta es una newsletter horizontal - tiene tanto "poder" de solicitar contenidos la primera persona que se inscribió como la última, así que no te cortes.
Sin nada más que añadir, gracias por estar ahí 😄