Semana 1: Elegir Stack, Romper, Aprender Rápido

Diario técnico de desarrollo web que documenta la construcción de una app desde la ideación hasta un MVP. Aprende sobre stack, monorepos, Next.js, Supabase y Vercel, IA y servicios cloud AWS/Azure con ejemplos reales para developers.

31 ago 2025 • 5 min de lectura • Equipo Q2BSTUDIO

Inteligencia-Artificial-

Quiero documentar mi recorrido creando una aplicación web, de principio a fin. Contaré el stack que utilizo, por qué y dónde lo aplico, los problemas que me encuentro, cómo los resolví o cómo lo intenté, y un breve resumen semanal del estado de la app. Este contenido está pensado para personas desarrolladoras que quieran aprender del proceso, seguir el avance y aportar feedback.

Este diario técnico también refleja la forma de trabajar de Q2BSTUDIO, empresa de desarrollo de software y aplicaciones a medida, especialistas en inteligencia artificial, ciberseguridad, servicios cloud aws y azure, servicios inteligencia de negocio y power bi, además de agentes IA y automatización. Si buscas impulsar un producto digital con software a medida o ia para empresas, aquí comparto lo que voy aprendiendo y aplico en proyectos reales.

Las últimas semanas

Cuando empecé a construir algo con sentido, no tenía todas las respuestas. Solo sabía que quería crear un proyecto que aportara valor a la gente, algo más allá de otro experimento desechable. A partir de ahí comenzó un camino con sesiones de ideas, debates sobre el stack, dolores de cabeza con monorepos y pequeñas victorias que me acercaron a convertir la idea en realidad.

Lo que sigue es un resumen honesto de lo que hice, por qué tomé cada decisión, los problemas que aparecieron y lo que voy a lanzar a continuación. Sigo aprendiendo, así que si ves algo que podría mejorar, dímelo.

Ideación

Empecé con una lista larga de posibles productos: utilidades, apps de productividad, pequeños SaaS. Me quedé con una idea que necesita interacción en grupo, mecánicas de decisión simples y un resultado claro y compartible. Mantengo a propósito algunos detalles del producto en reserva hasta mostrar progreso tangible.

Objetivos que guiaron las decisiones:

• Onboarding con fricción mínima. La persona usuaria debe iniciar sesión muy rápido.

• La interacción en grupo debe ser evidente y sencilla.

• Los resultados deben ser claros y con impacto.

Estos objetivos moldearon el stack técnico.

El stack que elegí

Cuando el concepto se sintió real, llegó la gran pregunta: qué stack utilizar. Mi primera propuesta fue:

• Backend: Golang con Gin

• Frontend: React con TypeScript

• Base de datos: MongoDB

• CI CD: GitHub Actions

• Cloud: AWS

Sobre el papel sonaba bien, pero era demasiado pesado para un MVP.

Con feedback y algo de investigación, simplifiqué el stack:

• Frontend: Next.js con React 19

• UI: ShadCN con Tailwind CSS v4

• Estado y datos: React Query con Supabase

• Backend: sin servicio aparte al inicio, apoyándome en Supabase para auth, base de datos y APIs

• Infraestructura: Monorepo de ShadCN para la estructura y pnpm como gestor de paquetes

• Despliegue: Vercel para el frontend y Supabase para servicios de backend

Este stack reducido me permitió moverme más rápido, aprender menos cosas a la vez y centrarme en el valor del producto.

Los problemas

Llegó la curva de aprendizaje del monorepo. Al principio me sonó a palabra de moda. Por qué no crear una sola app y listo. Pero los beneficios se volvieron claros al imaginar el crecimiento: UI compartida, tooling consistente y escalabilidad sencilla.

Estructura base:

• apps web para el frontend con Next.js

• packages ui para los componentes compartidos con ShadCN y Tailwind

• futuro apps api si el backend separado llega a ser necesario

Obstáculos que aparecieron:

• Pasar manejadores de eventos entre apps web y packages ui provocó errores de componentes Server y Client en React.

• La transición entre Tailwind v3 y v4 confundió. Descubrí que v4 es muy reciente y aún no tan probado, pero la documentación de ShadCN se apoya en v4, así que lo adopté.

• Incluso comprobar la versión de Tailwind se convirtió en un pequeño dolor.

Otro bloque vino del entorno de desarrollo:

• Mi sistema corría con Node 18, pero ShadCN exigía Node 20.

• Actualicé a Node 20 LTS a nivel de sistema.

• Migré de npm a pnpm, porque npm tuvo fricciones con la plantilla de ShadCN.

Sentí que invertía demasiado tiempo en la herramienta en lugar de la funcionalidad, pero cuando el entorno se estabilizó, todo fluyó mejor.

Lecciones aprendidas

1. Empieza por el producto, no por la tecnología. La claridad llegó cuando definí bien el concepto de la app.

2. Los monorepos son potentes, pero opinados. Obligan a la disciplina y a una estructura que debería pagar dividendos después.

3. Recorta alcance cuanto antes. Mi stack inicial parecía un buen movimiento, pero al ver lo manual y costoso del arranque, recortar me devolvió foco y tiempo.

4. Mantente al día, sin ser imprudente. Adopté Tailwind v4 porque ShadCN lo pedía, en otro caso quizá habría esperado.

5. Espera fricción. Entre actualizaciones de Node, particularidades de pnpm o comandos de Tailwind, hubo varios momentos de por qué no funciona.

En qué punto estoy

• Monorepo operativo con Next.js, ShadCN, Tailwind v4 y pnpm.

• Supabase gestiona autenticación, base de datos y lógica de backend por ahora.

• Páginas núcleo definidas: Login, Panel, Interacciones semanales, Votación, Resultados.

• Flujo de usuario claro y una base técnica que lo soporta.

Aún es pronto, pero pasé de idea al aire a proyecto estructurado con tracción. El camino no fue recto, y cada obstáculo me recordó por qué hago esto. Ya no es solo un proyecto de código, es un viaje de aprendizaje, foco y creación de algo que puede importar.

En Q2BSTUDIO acompañamos este tipo de retos con un enfoque integral: desde aplicaciones a medida y software a medida hasta arquitecturas escalables con servicios cloud aws y azure, ciberseguridad y pentesting, además de servicios inteligencia de negocio con power bi y soluciones de inteligencia artificial con agentes IA para acelerar decisiones y automatizar procesos críticos. Si tu producto necesita escalar en la nube, revisa también nuestros servicios cloud aws y azure para desplegar con buenas prácticas desde el día uno.

¿UNA PAUSA?

Juega un momento antes de irte

NUESTROS SERVICIOS

Cómo podemos ayudarte

Inteligencia artificial

Agentes de IA, chatbots y asistentes inteligentes que automatizan tareas y atienden a tus clientes 24/7 para mejorar la eficiencia de tu negocio.

Más info

Desarrollo de software

Aplicaciones web, móviles y de escritorio, intranets, e-commerce, SaaS y plataformas de gestión diseñadas para las necesidades concretas de tu empresa.

Más info

Servicios cloud

Migración, infraestructura, hosting gestionado, alta disponibilidad y seguridad en Microsoft Azure y Amazon Web Services para que tu negocio escale sin límites.

Más info

Ciberseguridad y pentesting

Auditorías de seguridad, test de intrusión (pentesting) y protección de aplicaciones, datos e infraestructura on-premise y cloud, con hacking ético y cumplimiento normativo.

Más info

Business Intelligence

Cuadros de mando y análisis de datos con Power BI: integramos tus fuentes, diseñamos dashboards y KPIs y convertimos tus datos en decisiones.

Más info

Automatización de procesos

Automatizamos tareas repetitivas y conectamos tus aplicaciones con n8n, Power Automate, Make y RPA, eliminando trabajo manual y aumentando la productividad.

Más info

Formación para empresas

Formamos a tus equipos en tecnología con criterio: desarrollo web, bases de datos, Git, buenas prácticas y seguridad, automatización con n8n, inteligencia artificial para empresas y creación de soluciones de IA con Azure AI Foundry.

Más info

Auditoría de código

Auditamos el código que creas tú, tu equipo o una IA: te decimos qué está bien y qué mejorar, lo securizamos y lo dejamos listo para producción, web o app.

Más info

Generación de imágenes con IA

Creamos por ti las imágenes que necesita tu negocio con inteligencia artificial: producto, redes, publicidad, ilustración y avatares. Tú nos dices qué quieres y te lo entregamos listo para usar.

Más info

Generación de vídeos con IA

Creamos por ti vídeos con inteligencia artificial: promocionales, para redes, presentadores virtuales, doblaje y animaciones. Nos cuentas la idea y te lo entregamos montado y listo para publicar.

Más info

Avatares conversacionales con IA

Creamos avatares conversacionales con IA —humanos digitales con cara y voz— que atienden a tus clientes y equipos con el conocimiento de tu empresa, en tu web, monitores interactivos, WhatsApp o Teams.

Más info

Marketing Online e IA

Google Ads, Meta Ads, LinkedIn Ads y posicionamiento en motores de IA (GEO/AEO): captamos clientes y hacemos que tu marca aparezca donde te buscan, también en ChatGPT, Gemini y Perplexity.

Más info

¿Tienes un proyecto en mente?

Cuéntanos tu visión y la convertimos en una solución de software. Sea cual sea el alcance, hacemos realidad tu idea.

Live Chat