Cómo crear una web con Lovable paso a paso (y cambiar algo después)
Le describes la web y te la escribe entera. El problema empieza cuando quieres cambiar algo. Aquí la ruta buena, paso a paso.
Con Lovable escribes lo que quieres y te sale una web funcionando. Eso ya no sorprende a nadie a estas alturas.
Lo que sí sorprende es lo que pasa después. Cuando llevas veinte cambios encima y le pides que mueva un botón, y de repente el formulario deja de funcionar y la página de precios se ha quedado en inglés.
Ese es el problema real de estas herramientas, y tiene solución. Te cuento el proceso completo y, sobre todo, cómo se hacen los cambios sin romper lo que ya iba.
¿Cómo se empieza una web en Lovable?
Entras en Lovable, creas cuenta y te encuentras una caja de texto grande donde describir lo que quieres. Escribes, le das a enviar, y en un par de minutos tienes una web funcionando con vista previa a la derecha.
Hasta ahí es igual para todo el mundo. Lo que separa un resultado decente de un churro es lo que escribes en esa caja.
Y no, no vale con "una web para mi tienda de bicicletas".
Paso 1: la primera descripción, larga y concreta
La primera petición marca la estructura de todo lo demás. Si sale torcida, arrastras el problema durante semanas.
Lo que funciona es escribir algo así:
> Web de una sola página para un taller de bicicletas en Zaragoza. Secciones en este orden: cabecera con logo y menú, sección principal con titular, subtítulo y botón de pedir cita; tres servicios con icono, título y descripción; sección de "cómo trabajamos" con tres pasos numerados; testimonios en tres tarjetas; preguntas frecuentes en acordeón; pie con dirección, teléfono, horario y enlaces legales. Estilo limpio, mucho blanco, un color de acento verde oscuro, tipografía sin adornos. Tiene que verse bien en móvil, es donde va a entrar casi todo el mundo. Textos en español de España.
Fíjate: secciones en orden, qué hay dentro de cada una, estilo, prioridad de móvil e idioma. Con eso, lo que sale a la primera ya es enseñable.
Paso 2: revisa la estructura antes de tocar el diseño
Tentación número uno: ponerse a cambiar colores y tamaños de letra en el minuto dos.
No. Primero mira si están todas las secciones, si el orden es el que querías y si el móvil se ve bien. La estructura primero, la pintura después.
Cambiar la estructura cuando ya has ajustado veinte detalles de diseño significa perder esos veinte ajustes.
Paso 3: los cambios, de uno en uno y en una frase
Aquí está el meollo del post.
La forma correcta de pedir cambios es esta: una cosa, una frase, mirar el resultado.
"En móvil, el titular es demasiado grande. Redúcelo un veinte por ciento." Miras. "Las tarjetas de servicios que tengan más espacio interior." Miras. "El botón de pedir cita también en la barra de arriba, fijo al hacer scroll." Miras.
Y la forma de romperlo todo es esta: "cambia los colores, añade una sección de equipo, arregla el móvil, pon el formulario y quita los testimonios".
Cuando le sueltas cinco cosas, toca cinco sitios a la vez y algo se cae. Como has cambiado cinco cosas, no sabes cuál lo rompió y empiezas a dar palos de ciego.
Paso 4: aprende a volver atrás antes de necesitarlo
Lovable guarda historial de versiones. Antes de pedir un cambio grande, comprueba que sabes exactamente dónde está el botón de volver a una versión anterior.
Suena a consejo de manual, pero es lo que separa una tarde tranquila de una tarde de desastre. Cuando algo se rompe, tu instinto va a ser pedirle que lo arregle, y muchas veces eso empeora las cosas. Volver atrás treinta segundos y pedir el cambio de otra forma es mucho más rápido.
Mi norma: si dos intentos seguidos no arreglan un fallo, vuelvo atrás y ataco desde otro ángulo.
Paso 5: conectar el proyecto a tu propio repositorio
Esta es la decisión que casi nadie toma al principio y que separa un juguete de algo tuyo.
Lovable permite enlazar el proyecto con un repositorio de código propio. Eso significa que el código está también en tu casa, no solo en su plataforma. Puedes bajártelo, publicarlo donde quieras y, si mañana quieres seguir con otra herramienta o con una persona, te lo llevas.
Hazlo desde el primer día. No cuesta nada y te quita la dependencia entera.
Paso 6: publicar y conectar el dominio
Publicar es un botón, y te da una dirección de la plataforma. Para conectar tu dominio propio, se hace desde los ajustes y apuntando los DNS de tu proveedor.
Aquí no hay misterio, pero hay espera: los cambios de DNS tardan un rato en propagarse. Si a los diez minutos no funciona, no toques nada más y espera.
Lo que se te va a atascar
Los créditos se van rapidísimo. Cada petición gasta, y las peticiones para arreglar fallos gastan igual. Una tarde peleándote con un error te funde el saldo del mes. Por eso lo de un cambio cada vez no es solo por calidad, es por dinero.
Rompe cosas que ya funcionaban. Es el problema clásico. Cada vez que toca un archivo grande, puede llevarse por delante algo de otra sección. Revisa las secciones importantes después de cada cambio gordo.
Los textos suenan a plantilla. Los que genera él son correctos y vacíos. Cámbialos por los tuyos. Es lo que más diferencia una web real de una demostración bonita.
El formulario de contacto. Un formulario necesita algo al otro lado que reciba los datos. Es la parte que más se atasca. Si solo quieres recibir mensajes, dile explícitamente que use el sistema más simple posible.
Se acumula porquería por debajo. Después de treinta cambios, el código tiene trozos muertos y repetidos. Eso no lo ves, pero está, y es lo que hace que cada cambio nuevo sea más lento y más frágil. Lo cuento con detalle en la verdad sobre la deuda técnica de las apps hechas con IA.
¿Cuándo se queda corto Lovable?
Cuando el proyecto pasa de una web a un producto de verdad, con usuarios, permisos y datos que importan.
Ahí las peticiones en lenguaje natural dejan de ser suficientes: necesitas control fino, y pedirlo hablando es como dirigir una obra por teléfono. Se puede, pero acabas antes bajando.
En ese punto tienes dos salidas. Bajarte el código a tu ordenador y seguir con Claude Code, que es donde tienes control real. O quedarte en lo que Lovable hace bien, que son webs y prototipos rápidos, y no forzar la máquina.
Si estás decidiendo entre esta y su competencia directa, la comparación honesta está en Lovable frente a Bolt, y el mapa completo del terreno en la guía de crear apps sin programar.
Y ahora qué
Monta una sola página con la descripción larga del paso 1, adaptada a lo tuyo. No la retoques todavía. Enlázala a tu repositorio propio y publícala.
Al día siguiente, con la cabeza fría, haz la lista de las diez cosas que cambiarías. Y luego pídelas de una en una. Ese ritmo aburrido es exactamente lo que hace que la web acabe terminada en vez de acabar rota.
Algunos enlaces de este artículo son de afiliado: si contratas la herramienta, me llevo una comisión sin que a ti te cueste más.
Si no tienes claro hasta dónde puedes llegar tú solo con estas herramientas, tengo un test corto que te sitúa y te dice qué toca aprender ahora.
Sigue leyendo
Softr vs Glide: cuál elegir para tu app sin código
Los dos montan apps sin programar y no compiten en lo mismo. Precios, límites reales y el caso concreto en que gana cada uno.
Cómo convertir un vídeo en post de blog sin reescribir
La transcripción en bruto no es un post. El proceso de cuatro pasos para convertir un vídeo en artículo publicable sin reescribirlo todo.
Cómo limpiar duplicados y datos sucios con IA en tu base de datos
Mil quinientos contactos con el mismo cliente escrito de seis formas distintas. La IA es buenísima en esto y aquí está el proceso entero.
Supabase vs Airtable: qué usar de backend de tu app
Airtable es cómodo hasta que tu app crece. Supabase es incómodo hasta que lo necesitas. Comparo los dos como backend real, con precios y límites.