Haz tu primera app con IA en minutos: tutorial con Cursor y Runway

Mira, colega. Si estás leyendo esto es porque ya te has dado cuenta de que la IA no es el futuro, es el puto presente. Y no, no hace falta ser un ingeniero de Google para montar una app con IA. Te voy a enseñar el atajo que usamos los que no tenemos tiempo para leer documentación de 500 páginas.

La combinación ganadora es simple: Cursor para que el código se escriba solo y Runway para que el video se genere con una calidad que parece de estudio. Juntos, montas una app que parece sacada de una startup con financiación, pero en realidad eres tú en el sofá con el portátil.

El plan: qué vamos a construir

Vamos a hacer una app que genera video promocional automático a partir de un texto. El usuario escribe "coche eléctrico volador" y la app le devuelve un video de 5 segundos con esa escena generada por IA. Ni más ni menos.

Paso 1: Configura Cursor para que trabaje por ti

Primero, abre Cursor y crea un proyecto nuevo. La clave está en el prompt inicial. No seas tímido, sé específico.

Crea una app web en React con Vite que tenga un input de texto y un botón. Al pulsar el botón, debe llamar a una API local en /api/generar_video con el texto introducido. Muestra el resultado en un reproductor de video. Diseño limpio, estilo futurista con gradientes.

Cursor te generará la estructura, los componentes y hasta los estilos. No es magia, es que ya lo ha hecho mil veces. Tú solo revisa que no haya errores tontos.

Paso 2: La parte de Runway (la que mola)

Ahora vamos con la generación de video. Runway tiene una API que puedes llamar desde tu backend. Lo primero, consigue tu API key en la consola de Runway (son 5 minutos, no me hagas explicarte los menús).

Paso 3: El prompt que hace magia

Este es el prompt que usarás para que Runway entienda qué video quieres. Cópialo, pégalo en tu función de backend:

Genera un video de 5 segundos con la siguiente descripción: [TEXTO_DEL_USUARIO]. Estilo cinematográfico, iluminación profesional, movimiento de cámara suave, resolución 1080p.

Y el prompt para tu backend en Node/Express:

Crea una función en Express que reciba un POST en /api/generar_video. Dentro, debe llamar a la API de Runway con la descripción recibida. Si hay error, devuelve 500. Si funciona, devuelve la URL del video generado.

Paso 4: Conecta todo y prueba

Ahora viene el momento de la verdad. Ejecuta tu frontend con npm run dev, levanta tu backend y prueba. Escribe "un perro astronauta paseando por Marte" y mira cómo se genera el video en menos de un minuto.

¿Funciona? Enhorabuena, tío. Acabas de montar una app con IA en menos tiempo del que tardas en decidir qué pedir en Glovo.

Errores comunes que te van a pasar (y cómo evitarlos)

• Rate limit de Runway: no hagas 20 llamadas seguidas. Añade un pequeño delay o cola.

• CORS en el backend: si te da error de CORS, instala el middleware cors en Express.

• El video tarda en generarse: no hagas un fetch síncrono, usa async/await y muestra un loading.

El truco final

Si quieres que tu app parezca profesional de verdad, añade este prompt a Cursor:

Añade un estado de carga animado mientras se genera el video. Cuando el video esté listo, haz fade-in. Añade también un historial de los últimos 5 videos generados usando localStorage.

Y ya está. En serio, no necesitas nada más.

Mira, la IA no va a quitar tu trabajo, pero el colega que sabe usarla sí. Así que deja de leer y ponte a construir. El próximo que esté enseñando su app hecha con IA en LinkedIn podrías ser tú.

Y tú, ¿qué herramienta usas para tus proyectos con IA? ¿Cursor, otro editor, o sigues a lo bruto?