01 Qué es y para quién
La barrera para crear una app con IA no suele ser la idea, sino el entorno: instalar Node.js, Git, dependencias, saber arrancar un servidor y publicar. Este repositorio lo resuelve con un script de instalación por sistema operativo y un proyecto ya configurado con Next.js, HeroUI, Tailwind CSS y Framer Motion.
Dentro del proyecto vive un agente con instrucciones (AGENTS.md) y skills propias que te acompañan paso a paso: te ayuda a concretar la idea, construye la primera pantalla, añade funciones y la publica. Funciona con Codex CLI, el agente de programación de OpenAI, que el script instala por ti.
Para principiantes absolutos
Solo necesitas saber abrir la terminal, copiar y pegar, y describir lo que quieres.
Para talleres internos
Útil para que un equipo de marketing u operaciones pierda el miedo a construir prototipos en una sesión.
Para validar ideas
Una herramienta interna sencilla, una landing o una calculadora que puedas enseñar con un enlace.
02 Instalación en un comando
Abre la terminal (en Mac, Cmd + espacio y escribe «Terminal»; en Windows, PowerShell) y ejecuta el script de tu sistema. Instala lo que falte (Homebrew en Mac, Node.js 20 o superior, Git y Codex CLI), clona el proyecto en tu Escritorio, instala dependencias, arranca el servidor en localhost:3000 y abre Codex.
bash <(curl -fsSL https://raw.githubusercontent.com/Hainrixz/construyeconia/main/scripts/setup-mac.sh)irm https://raw.githubusercontent.com/Hainrixz/construyeconia/main/scripts/setup-windows.ps1 | iexbash <(curl -fsSL https://raw.githubusercontent.com/Hainrixz/construyeconia/main/scripts/setup-ubuntu.sh)Para volver otro día, abre la carpeta construyeconia del Escritorio y haz doble clic en run.command (Mac) o run.bat (Windows).
03 Tu primer build
| Comando en Codex | Qué hace |
|---|---|
| $start | Arranca el flujo guiado: idea, primera versión e iteraciones. |
| $imlost | Te reorienta cuando no sabes qué pedir a continuación. |
| $fixit | Diagnostica y corrige errores habituales del proyecto. |
| $deploy | Compila la app y la publica en Vercel con un enlace público. |
-
1
Resume la idea en una frase
«Estoy construyendo ___ para ___». Cuanto más concreta, mejor primera versión.
-
2
Mira el resultado en el navegador
La app se recarga sola en localhost:3000 con cada cambio.
-
3
Pide un cambio cada vez
Cambios visibles y concretos, no «hazlo mejor».
-
4
Usa textos reales
El agente evita contenido de relleno: dale tus títulos, precios o categorías.
-
5
Repite hasta que quieras enseñarlo
La primera versión nunca es la definitiva.
Estoy construyendo una calculadora de presupuestos para mi negocio de reformas. Quiero elegir el tipo de estancia (baño, cocina, salón), introducir los metros cuadrados y marcar extras (fontanería nueva, electricidad, pintura). Muestra un precio orientativo con IVA desglosado y un botón para copiar el resumen. Precios por m²: baño 450 €, cocina 520 €, salón 180 €. Diseño limpio, fondo claro, pensado para usar en el móvil.Tres cambios, de uno en uno y enseñándome cada uno: 1) el botón principal más grande y en color verde oscuro; 2) que los extras aparezcan como interruptores en lugar de casillas; 3) que el resumen copiado incluya la fecha de hoy. No cambies nada más.04 Publicar y compartir
Cuando la app haga algo útil, ejecuta $deploy. El agente compila el proyecto, corrige si algo falla y lo despliega en Vercel. Recibirás un enlace del tipo proyecto-xxxx.vercel.app que ya funciona para cualquiera, y puede que un enlace para reclamarlo. Si quieres conservarlo a largo plazo, reclámalo con una cuenta gratuita de Vercel; cada vez que vuelvas a ejecutar $deploy se actualizará.
- ✓Prueba el flujo principal en local antes de publicar.
- ✓No metas contraseñas, claves de API ni datos de clientes en el código: el proyecto es una web pública.
- ✓Comparte el enlace con al menos tres personas y anota qué no entienden.
- ✓Si la app va a tratar datos reales, necesitarás base de datos, autenticación y revisión legal antes de usarla con clientes.
05 Siguientes pasos y alternativas
Con la primera app publicada, los saltos naturales son guardar datos de forma persistente, conectar una API externa o añadir varios usuarios. Cada uno añade complejidad y conviene hacerlo con un plan escrito antes de pedir código.
Si prefieres trabajar con Claude Code, puedes abrir la misma carpeta y pedirle que lea AGENTS.md y las skills de .agents/skills/ para seguir el mismo método; el proyecto es Next.js estándar y cualquier agente de programación lo entiende.
Preguntas frecuentes
No. El agente explica lo que hace en lenguaje sencillo y solo necesitas describir lo que quieres. Saber cuatro comandos de terminal (pwd, ls, cd) ayuda a no perderse.
El flujo guiado está preparado para Codex CLI de OpenAI. Puedes usar Claude Code sobre el mismo proyecto pidiéndole que siga AGENTS.md, aunque los comandos con $ son propios de Codex.
El proyecto es gratuito y la publicación en Vercel tiene un plan gratuito para proyectos personales. Codex necesita una cuenta de OpenAI con acceso; revisa las condiciones actuales de tu plan.
Listas de tareas, diarios, generadores de frases, landings personales, contadores y calculadoras. Todo lo que necesite pagos, usuarios o datos sensibles requiere más trabajo y supervisión técnica.
Sobre el autor
Equipo editorial de appyweb
Marketing, SEO y desarrollo con IA
Especialistas de appyweb en SEO, publicidad, desarrollo web y automatización con IA.