How to Self-Host a Lovable App: Front End and Backend

What self-hosting a Lovable app really means

A Lovable app has a front end (the pages and logic users see) and a backend (database, users, files and functions). Self-hosting means you run both on infrastructure you choose instead of relying on a managed environment.

There is a spectrum. Most people stop at the middle option, which removes day-to-day dependence while keeping operations simple.

• Option 1: own Supabase project + managed static host. Front end on Vercel, Netlify or Cloudflare Pages, backend on your own Supabase account. Easiest and cheapest to operate.
• Option 2: own Supabase project + your own server. Front end served by nginx or Caddy on a VPS, backend still on Supabase.
• Option 3: everything on your server. Front end and a self-hosted Supabase (open source) running in Docker.

Step 1: Export the code and the backend

1. 1Get the code

   Connect the project to GitHub and download it, as described in how to export your Lovable project.

   

2. 2Move the backend

   Create your own Supabase project and migrate the database, users, files and functions with the complete migration guide or the free tool.

Step 2: Build the front end

Set the three environment variables for your new backend in a .env file, then build. Vite bakes these values into the build, so you must rebuild whenever they change.

echo 'VITE_SUPABASE_URL="https://YOUR_REF.supabase.co"
VITE_SUPABASE_PUBLISHABLE_KEY="your-publishable-key"
VITE_SUPABASE_PROJECT_ID="YOUR_REF"' > .env
npm install
npm run build   # outputs the static site to dist/

Step 3: Host the static files

The dist folder is plain HTML, CSS and JavaScript. Upload it to any static host. Because the app is a single-page app, configure the host to serve index.html for unknown paths, otherwise a refresh on a deep link shows a 404.

• Vercel, Netlify, Cloudflare Pages: connect the repository, set the build command to npm run build and the output folder to dist, and add the three environment variables in the dashboard.
• Your own server: copy dist to the server and serve it with nginx, as below.

server {
  listen 80;
  server_name your-domain.com;
  root /var/www/your-app/dist;
  index index.html;
  location / {
    try_files $uri $uri/ /index.html;
  }
}

Step 4 (optional): Self-host Supabase itself

If you need the backend on your own servers too, Supabase is open source and can be run with Docker. This gives you the most control and the most responsibility: you handle backups, upgrades, security patches, monitoring and scaling. Follow the official self-hosting guide, and move your data with the same schema, CSV and users steps as above.

Most teams find that a managed Supabase project plus their own front-end hosting is the right balance. Self-host the backend only if you have a clear compliance or cost reason and someone to operate it.

Checklist before you switch DNS

• The app loads and you can sign in against the new backend.
• Auth redirect URLs and the Site URL in Supabase point to your real domain.
• Edge functions are deployed and their secrets are set.
• HTTPS is enabled, and deep links work after a refresh.
• You have a backup and a way to roll back.

Frequently asked questions

Related guides