Aan de slag met Lovable

Lovable is een prompt-gebaseerde app builder: je beschrijft wat je wil, en Lovable genereert een volledige web-app met live preview (React + TypeScript + Vite + Tailwind onder de motorkap). Deze gids neemt je stap voor stap mee door je eerste project, van account tot publicatie.

Wil je meteen zelf beginnen? Start gratis met Lovable. Als Lovable-partner in de Brainport-regio helpen we bedrijven in Eindhoven en omgeving ook verder als je liever direct met een developer schakelt — zie hieronder wanneer dat zinvol is.

Account aanmaken en je eerste project starten

Je maakt een account aan op lovable.dev en start een nieuw project vanuit een lege prompt of een template. Beschrijf in je eerste bericht wat je wil bouwen: wat de app doet, voor wie, en welke belangrijkste pagina's of onderdelen je verwacht. Hoe concreter je eerste prompt, hoe minder correctierondes je nodig hebt.

Een goed eerste bericht bevat:

• Het doel van de app of website
• De belangrijkste pagina's/schermen
• Eventuele databronnen (statisch of dynamisch)
• Stijlvoorkeur (bijvoorbeeld: strak en zakelijk, of speels)

Hoe de chat en preview werken

Lovable werkt met een chatvenster aan de ene kant en een live preview aan de andere kant. Je typt een instructie, Lovable past de code aan en de preview ververst automatisch. Je ziet direct wat er verandert, zonder dat je zelf hoeft te bouwen of te deployen.

Onder de preview (of in een aparte tab) vind je console- en netwerklogs. Die zijn essentieel zodra je gaat debuggen: een foutmelding in de console geeft je meestal een directe aanwijzing wat er misging.

Plan-modus: eerst denken, dan bouwen

Voor grotere features is het verstandig om eerst in plan-modus te werken in plaats van direct te laten bouwen. Je beschrijft wat je wil, Lovable stelt een aanpak voor (welke pagina's, componenten en logica erbij komen), en jij kunt dat plan bijsturen vóórdat er code wordt gegenereerd. Dat voorkomt dat je een uitgebreide wijziging moet terugdraaien omdat de aanpak niet klopte.

Gebruik plan-modus vooral bij:

• Nieuwe features die meerdere pagina's raken
• Wijzigingen aan datamodellen of database-structuur
• Alles waarbij je zelf nog twijfelt over de beste aanpak

Werk in kleine stappen

Lovable's eigen documentatie adviseert om grote wijzigingen op te knippen in kleinere stappen. Vraag niet in één prompt om "een complete webshop met checkout, klantaccounts en een dashboard" — splits dat op in losse, behapbare instructies. Voordelen:

• Je kunt elke stap controleren voordat je verdergaat
• Fouten blijven lokaal en zijn makkelijker te herleiden
• Rollback (zie hieronder) is preciezer als je stappen klein houdt

Versies en rollback

Elke wijziging die Lovable doorvoert, wordt vastgelegd als versie. Ging een stap de verkeerde kant op, dan kun je terug naar een eerdere versie zonder dat je handmatig code hoeft te herstellen. Dit is meteen een reden om echt in kleine stappen te werken: hoe kleiner de stap, hoe gerichter je kunt terugrollen zonder ook goede wijzigingen te verliezen.

Lovable Cloud: database, auth en meer

Zodra je app meer nodig heeft dan statische content — gebruikersaccounts, een database, bestandsopslag of serverfuncties — zet je Lovable Cloud aan. Cloud draait op Supabase-basis en regelt:

Onderdeel	Wat het doet
Database	Opslag van je gegevens, met tabellen die je via prompts of de Cloud-tab beheert
Auth	Gebruikersregistratie en login
Storage	Bestanden en media
Serverfuncties	Logica die niet in de browser hoort te draaien
Lovable Email	Transactionele en auth-mails vanaf je eigen domein (vereist Cloud)

Je kunt data exporteren via Cloud tab → Advanced settings → Export data. Loopt je project qua performance tegen grenzen aan naarmate het groeit, dan kun je in Cloud → Overview → Advanced settings een grotere instance kiezen (dit kost meer credits/geld).

Let op: "vibe coding" — snel bouwen op basis van prompts — brengt reële aandachtspunten met zich mee rond security en onderhoudbaarheid. Regel autorisatie (RLS) goed, test kritieke flows, en laat gevoelige onderdelen reviewen voordat je live gaat.

Publiceren en een custom domein koppelen

Met één klik publiceer je je project naar een lovable.app-subdomein. Wil je onder je eigen domein live, dan koppel je een custom domain aan het project. Zo kun je met een klein team snel een werkende versie live zetten zonder losse hosting te regelen.

Git-sync met GitHub (en GitLab)

Lovable ondersteunt git-sync met GitHub en GitLab, en dat werkt op alle plannen, ook Free. Dat betekent dat je project altijd ook als gewone git-repository beschikbaar is: handig als je later een developer wil laten meekijken, code wil reviewen, of buiten Lovable om wil doorontwikkelen.

Code downloaden

Wil je de broncode zelf lokaal draaien of los van Lovable beheren, dan kun je die downloaden — dit is beschikbaar vanaf het Pro-plan (dus niet op Free). Projecten en code blijven overigens altijd eigendom van jou als gebruiker, ongeacht het plan.

Samenwerken in een project

Meerdere teamleden kunnen aan hetzelfde project werken: de een schrijft prompts voor content, de ander voor functionaliteit. Combineer dat met git-sync als je ook buiten Lovable wil samenwerken met een developer, en met plan-modus om af te stemmen vóórdat iemand een grote wijziging doorvoert.

Wanneer je een developer erbij haalt

Lovable is krachtig voor prototypes, MVP's en zelfs volwaardige producten, maar er zijn momenten waarop professionele hulp de investering waard is:

• Je project raakt gevoelige data en je wil zekerheid over autorisatie en security
• Performance loopt tegen grenzen aan bij groei
• Je wil een architectuur die klaar is voor schaal, integraties of complexere logica
• Je hebt behoefte aan een externe review voordat je live gaat

Als Lovable-partner in de Brainport-regio (Eindhoven) helpen wij teams die met Lovable zijn begonnen en willen opschalen, professionaliseren of een externe check willen op hun project. Bekijk ook onze pagina's over webdesign en websites, of neem contact op voor een adviesgesprek.

Checklist voor je eerste project

• Account aangemaakt en eerste prompt geschreven met doel, doelgroep en belangrijkste pagina's
• Plan-modus gebruikt voor de eerste grotere feature
• Gewerkt in kleine stappen, telkens de preview gecontroleerd
• Lovable Cloud aangezet zodra je een database of login nodig had
• Git-sync met GitHub ingesteld
• Gepubliceerd en (indien nodig) custom domein gekoppeld
• Bij twijfel over security of schaal: externe review overwogen

Veelgemaakte fouten van nieuwe gebruikers

• Te veel in één prompt vragen — leidt tot onvoorspelbare resultaten en lastig te herleiden fouten.
• Geen plan-modus gebruiken bij grote features — je bouwt dan iets dat achteraf toch op de schop moet.
• Rollback vergeten — niet weten dat je makkelijk kunt teruggaan naar een eerdere versie, waardoor mensen handmatig gaan "repareren".
• Cloud-instellingen negeren — geen aandacht voor autorisatie/RLS bij gevoelige data.
• Nooit naar de consolelogs kijken — de snelste manier om een fout te begrijpen, is de foutmelding zelf lezen.
• Custom domein overslaan — live gaan op het lovable.app-subdomein terwijl een eigen domein professioneler oogt en beter is voor merkopbouw.

Veelgestelde vragen

Heb ik technische kennis nodig om met Lovable te starten?

Nee, je kunt met natuurlijke taal prompten. Voor complexere projecten (autorisatie, performance, integraties) helpt het wel als er ergens in het proces technische review plaatsvindt.

Kan ik altijd nog naar een developer overstappen?

Ja. Dankzij git-sync met GitHub staat je project altijd ook als gewone codebase klaar, en vanaf Pro kun je de code ook downloaden.

Wat kost Lovable?

Er is een gratis plan met dagelijkse build credits, en betaalde plannen met meer credits en functies zoals code-download. Check lovable.dev/pricing voor actuele tarieven, of lees onze uitleg bij Lovable prijzen.

Moet ik Lovable Cloud altijd aanzetten?

Nee, alleen als je een database, gebruikersaccounts, bestandsopslag of serverfuncties nodig hebt. Een simpele contentwebsite kan zonder Cloud.