Stap 1: Exporteer je code naar GitHub
Builder-native preview URLs zijn niet voor productie. Eerste stap is altijd: krijg de code uit de tool. Lovable en Bolt hebben beide een "Export naar GitHub" knop. Cursor en Claude Code werken al met een lokale repository die je gewoon naar GitHub pusht.
Maak een private GitHub repository (niet public, want straks zitten daar je secrets in). Push de code. Dit is je single source of truth vanaf nu.
Stap 2: Verplaats secrets naar environment variables
Open je code en zoek naar dingen die op een API key lijken: strings die beginnen met sk_, pk_, AIza, eyJ. Vrijwel zeker staan er een paar in je code die er niet horen.
Maak een .env bestand voor lokale ontwikkeling en zet alle secrets daar. Verwijs in code naar process.env.OPENAI_API_KEY. Voeg .env toe aan .gitignore zodat hij niet per ongeluk in GitHub komt.
Waarom dit erin moet: als je secrets in de frontend bundle staan kan elke bezoeker ze uit je site plukken via de browser DevTools. Iemand misbruikt ze, jij krijgt de Stripe of OpenAI factuur.
Stap 3: Kies een hosting platform en deploy
Drie realistische opties voor de eerste keer:
- Vercel als je een Next.js of React app hebt zonder zware backend. Free tier, één-klik koppeling met GitHub.
- Railway als je een database, queues of background workers nodig hebt. Vijf dollar per maand voor een echte productie setup.
- Ployed als je niet zelf wil regelen welk platform en wil dat iemand de deploy reviewt. Wij kiezen de juiste infra, doen de deploy, je bouwt door in de canvas editor.
In Vercel of Railway koppel je je GitHub repo, zet je environment variables in hun dashboard, en klik je deploy. Dat is letterlijk het. De eerste keer duurt het tien minuten, daarna gaat elke push automatisch live.
Stap 4: Koppel je eigen domein en zet SSL aan
Een eigen domein is geen luxe, het is essentieel voor vertrouwen. Bezoekers vertrouwen jouwapp.nl meer dan jouwapp.lovable.app.
Koop een domein bij TransIP, Namecheap of Cloudflare. Voeg in je DNS een CNAME record toe dat verwijst naar je hosting platform (Vercel: cname.vercel-dns.com, Railway: het adres dat ze in de Domains tab tonen). Wacht maximaal een uur voor DNS propagatie. SSL wordt automatisch aangezet door Let's Encrypt zodra de DNS klopt.
Stap 5: Zet monitoring en error tracking aan
Je wil het weten als je app stuk gaat, voordat een gebruiker je het mailt. Twee minimale tools:
- Sentry: vangt JavaScript errors en exceptions. Gratis voor solo projecten. Tien minuten installatie.
- BetterUptime of UptimeRobot: pingt elke minuut je site. Mailt of belt je als hij down gaat. Gratis voor één site.
Veelgemaakte fouten in deze fase
- Preview URL als productie URL gebruiken. Het werkt, totdat de tool besluit dat je preview verlopen is.
- Free tier database voor productie data. Supabase Free heeft beperkingen die je raakt zodra je app populair wordt.
- Geen backups van de database. Zet ze aan voor je live gaat. Niet erna.
- Geen rollback pad geoefend. Probeer een keer terug te gaan naar de vorige versie. Zo weet je dat het werkt.
Als dit te veel is om alleen te doen: dat is letterlijk waar Ployed voor bedoeld is. Een engineer regelt het, jij focust op je app. Lees verder over wanneer DevOps uitbesteden zinnig is.