Crea una app con IA desde cero usando Cursor: guía práctica paso a paso

Mira, colega, si aún estás copiando y pegando en ChatGPT para luego ir a VSCode, estás perdiendo el tiempo. Cursor es un fork de VSCode con IA integrada que entiende todo tu proyecto. No es magia, pero se le acerca. Vamos al lío.

Paso 1: Prepara el terreno

Descarga Cursor desde cursor.com e inicia sesión. Abre una carpeta vacía y crea el proyecto con el agente. No empieces pidiendo "una app de tareas". Dale contexto real.

Crea una app de lista de tareas con Next.js 14, TypeScript y Tailwind. Quiero: 
- Añadir, completar y borrar tareas 
- Persistencia en localStorage 
- UI limpia y minimalista 
Empieza por la estructura de archivos y explícame cada decisión.

Cursor te genera la estructura. Léela. Si no entiendes algo, selecciónalo y pulsa Cmd+K para preguntar.

Paso 2: Itera con contexto, no a ciegas

El error típico es pedir cosas sin referenciar archivos. Usa @ para mencionar archivos concretos. Selecciona el componente y escribe:

Refactoriza este componente para que use un custom hook useTasks. 
Mueve la lógica de localStorage ahí y tipa todo correctamente.

Esto es lo que diferencia a Cursor de un chat normal: trabaja sobre tu código real.

Paso 3: Usa Composer para cambios grandes

Cmd+I (Composer) crea archivos y edita varios a la vez. Perfecto para features completas:

Añade autenticación con Clerk a esta app. 
Necesito: botón de login en el header, protección de la ruta principal, 
y que las tareas se guarden por usuario. Muéstrame el diff antes de aplicar.

Revisa el diff. Nunca aceptes a ciegas. Cursor se equivoca, y mucho, cuando no le das contexto.

Paso 4: Depura con el error en mano

Cuando algo falle, copia el error completo y pégalo en el chat con Cmd+L:

Tengo este error al hacer build:
[pega el error aquí]
El archivo afectado es @app/page.tsx. Explícame la causa antes de proponer el fix.

Que te explique antes de arreglar. Así aprendes y evitas que rompa otra cosa.

Paso 5: Revisa, prueba y cierra

Pide tests y revisa el código generado:

Genera tests con Vitest para useTasks: añadir, completar y borrar. 
Cubre también el caso de localStorage vacío.

Trucos que marcan la diferencia

• .cursorrules: crea un archivo en la raíz con tus convenciones (estilo, librerías, estructura). Cursor lo lee siempre.
• Modelos: usa Claude Sonnet para refactors grandes y GPT-4o para cosas rápidas.
• No le des todo el proyecto: sé quirúrgico. Más contexto no siempre es mejor.

En una tarde tienes una app funcional. En serio. La clave está en prompts concretos y revisar cada diff como si lo hubiera escrito un junior muy rápido.

Y tú, ¿qué usas para construir apps con IA? ¿Cursor, Copilot o sigues a mano?