Com fer la teva primera app amb Lovable sense saber programar

Per fer una app amb Lovable no cal saber programar, però sí saber què vols. El camí que funciona és aquest: abans d'obrir Lovable, decideix què fa la primera versió i, sobretot, què no fa. Després escriu un primer prompt que demani només la interfície, amb dades d'exemple i un estil concret. Afegeix coses d'una en una, provant-les cada vegada. Connecta una base de dades quan l'app hagi de recordar alguna cosa. I quan funcioni, prem Publish: tindràs una adreça lovable.app gratuïta per compartir. No cal instal·lar res; tot passa al navegador.

L'exemple és el que fem servir a la Capbussada: la fleca dels meus pares, que planifiquen reserves i producció a ull i voldrien veure-ho clar, dia a dia.

Abans d'obrir Lovable: decideix què no faràs

L'error més habitual és obrir l'eina i escriure «fes-me una app per a la fleca». Lovable en farà una, però serà genèrica i s'assemblarà poc al que tenies al cap. La IA és com un becari que ho ha llegit tot i no diu mai «no ho sé»: si no li dones direcció, se la inventa.

Per això, abans, parla amb Claude perquè t'ajudi a pensar el projecte. No li demanis codi, demana-li preguntes:

Els meus pares tenen una fleca i volen una app senzilla per
organitzar-se. Ara ho porten tot a ull. No sé programar i la
faré amb Lovable. Fes-me preguntes per decidir què ha de fer
la primera versió i què deixem per més endavant.

Per a la fleca, la conversa acaba amb quatre mòduls: Reserves, Producció, Vendes i Registre diari. La primera versió en fa un. Planificar és, sobretot, decidir què no fas al primer intent. La guia d'inici de Lovable també acaba el seu prompt d'exemple amb «sense login ni base de dades encara»: com menys coses, menys se'n poden trencar.

El primer prompt: què és, per a qui, què no, i com es veu

Pots escriure a Lovable en català; la guia d'inici diu que accepta qualsevol idioma. Un bon primer prompt diu què és l'app, qui la farà servir, què ha de fer ara, què no ha de fer encara i quin aspecte ha de tenir:

Fes una app per a una fleca de barri: la pantalla de Reserves.
La faran servir els meus pares des del mòbil, darrere el taulell.
Ha de mostrar les reserves d'avui i de demà, i un formulari
per afegir-ne una: nom, telèfon, producte, quantitat, dia.
Fes servir aquests exemples: "Marta Puig, 2 barres de quilo,
dissabte", "Joan Vila, 1 coca de recapte, diumenge".
Estil: net i càlid, com Notion però amb colors de forn.
Encara no vull usuaris, ni base de dades, ni pagaments.

Dues coses d'aquest prompt fan més feina del que sembla. Les dades d'exemple concretes: si demanes «posa-hi reserves de mostra», la IA s'inventa textos de qualsevol llargada i el disseny en surt desquadrat. I l'estil: com en arquitectura, és més fàcil anomenar un estil que descriure'l. Adjectius («net», «seriós», «juganer»), referències («com Notion», «estil Apple») o una captura d'un web que t'agradi, que pots adjuntar al prompt. És de les coses que més milloren el resultat.

Si vols veure què farà abans que ho faci, tria Plan al selector de mode. El mode Plan no toca el codi: et fa preguntes i t'escriu un pla que pots corregir abans d'aprovar-lo. Cada missatge en aquest mode costa un crèdit.

Una cosa cada vegada

El cor de Lovable és el bucle: tens una versió que funciona, la proves, demanes una cosa nova, la veus aparèixer, la tornes a provar. No cal encertar-ho al primer prompt; l'app es construeix conversant.

• Prova-la de debò. Afegeix una reserva, obre-la en vista de mòbil (hi ha un botó a sobre de la previsualització) i mira si els teus pares la farien servir.
• Assenyala en comptes de descriure. Per a canvis petits, selecciona l'element a la previsualització i digues què vols canviar.
• Guarda el pla on Lovable el llegeixi. El coneixement del projecte és un camp de fins a 10.000 caràcters que Lovable té en compte a cada missatge. Hi pots posar els quatre mòduls, l'estil i el que queda fora.
• Fes servir les skills. Si escrius / al xat, surten instruccions reutilitzables; n'hi ha d'integrades per a redissenys, SEO i accessibilitat.

Quan Reserves funcioni, marca aquella versió a l'historial: és el teu punt de retorn.

Quan l'app ha de recordar coses

Una app té quatre parts: la interfície (el que veus), la lògica (el que fa), les dades (el que recorda) i on viu (on està allotjada). Fins ara només tenies interfície i lògica. La pregunta que et diu si necessites la tercera part és senzilla: quan tanco la pàgina, s'ha de recordar el que hi havia? Per a la fleca, és clar que sí. Sense base de dades, una reserva nova desapareix quan refresques.

Quan li demanes una cosa que necessita dades o usuaris, Lovable activa el seu backend integrat, que funciona sobre Supabase. No cal que obris cap compte a part. Si prefereixes tenir el teu propi Supabase, també pots, però decideix-ho al principi: no hi ha cap botó per passar d'un a l'altre.

Aquí toca fer-se la pregunta que fem sempre: on van aquestes dades? Els noms i telèfons dels clients de la fleca surten del teu ordinador i van a un servidor. Lovable et deixa triar la regió; tria Europa. I quan l'app tingui usuaris, recorda que qui pot veure cada fila ho decideix la base de dades amb unes regles anomenades RLS, no la pantalla: el que veu el navegador és públic.

Els pagaments amb Stripe no són per a aquesta primera versió: els integrats demanen el pla Pro.

Quan es trenca: com sortir del bucle

Es trencarà. Demanes que arregli una cosa, l'arregla, en trenca una altra, i tornes a demanar. La guia oficial de depuració proposa quatre passos, i funcionen:

1. Try to fix, una o dues vegades. Tens deu correccions gratuïtes, i cada una torna a estar disponible 24 hores després de gastar-la.
2. Descriu l'error, no la frustració. «No funciona res, arregla-ho» no ajuda. Digues què, on, què esperaves i què ha passat, i enganxa-hi una captura.
3. Passa a Plan i pregunta per què. Demana-li la causa abans d'un altre intent, i que et faci la llista del que ja heu provat. Si el pla és massa tècnic, demana-li que te l'expliqui com si no en sabessis.
4. Torna enrere. Si les correccions han embolicat el codi, restaura la versió que tenies marcada i torna-ho a demanar en passos més petits.

Publicar-la

Prem Publish, a dalt a la dreta. Lovable et proposa una adreça acabada en lovable.app, que pots canviar, i en uns segons l'app és en línia. Publicar en aquesta adreça és gratuït en tots els plans. En obrir el diàleg, Lovable fa una revisió bàsica de seguretat; si troba problemes, no t'impedeix publicar, però mira-te'ls abans.

La sorpresa més habitual: la web publicada és una foto. Els canvis que facis després es veuen a la previsualització però no arriben a l'app fins que tornes a prémer Publish. I qualsevol persona amb l'enllaç hi pot entrar.

On es trenca

• Els crèdits gratuïts s'acaben ràpid. Al setembre de 2026, el pla gratuït dona 5 crèdits al dia fins a 30 al mes. Canviar un color en costa uns 0,5, afegir usuaris uns 1,2. El Pro comença a 25 $ al mes per 100 crèdits (plans, consultat el 22 de setembre de 2026). Domini propi i treure la insígnia de Lovable, només pagant.
• L'allotjament és gratuït; les dades, no del tot. La web publicada no gasta crèdits, però la base de dades i les funcions d'IA sí. Ara mateix hi ha una subvenció mensual que Lovable qualifica de temporal. Si et quedes sense crèdits, la web continua en línia però el backend es pausa.
• Tornar enrere no desfà les dades. Restaurar una versió recupera el codi, no el que s'ha escrit a la base de dades. Tampoc et retorna els crèdits.
• El que escrius a Lovable surt de casa teva. Entre el febrer i l'abril de 2026, el codi i els xats dels projectes públics eren visibles per a altres usuaris que en tinguessin l'enllaç, segons explica la mateixa Lovable. No hi enganxis dades reals de clients ni claus.
• Fa webs, no apps de botiga. S'obre al mòbil, però no anirà a l'App Store.

I ara què

Obre una conversa amb Claude i escriu la teva idea com hem fet amb la fleca, fins que sàpigues quin és l'únic mòdul de la primera versió. Després obre Lovable, escriu el primer prompt en català i no afegeixis res fins que aquell mòdul funcioni al teu mòbil. Quan hagis publicat, torna a la llista de mòduls i tria el següent.