▲

Deploy Lovable to Vercel

You can use Lovable as your AI editor, Vercel for the frontend, and your own Supabase project for the backend. This setup keeps the AI authoring experience Lovable is good at while escaping Lovable Cloud's auto-pause and bundled hosting markup.

Who does what: Staticbot automates the backend migration to your own Supabase (step 3 below). You wire Vercel yourself in 2 minutes (steps 4–5). The Lovable editor stays unchanged.

When this setup makes sense

You like Lovable as an AI editor and want to keep using it.
Your Lovable app is starting to get real traffic, and Lovable Cloud is auto-pausing it or pushing you onto pricier plans.
You want a managed deploy experience (Vercel) without learning the AWS console.
You want to own the data — Supabase project under your name, exportable any time.

Why split frontend and backend?

Lovable Cloud bundles three things: the AI agent that writes your code, frontend hosting, and a backend (Supabase + storage + edge functions). The AI is the value. The hosting is the markup — and the bundled backend is what gets auto-paused when your project sits idle for a week.

Splitting them means each layer is paid for, and replaceable, on its own terms:

Lovable (editor)

Keep using it to write code. Lovable writes to your GitHub repo, same as before.

Vercel (frontend)

Vercel auto-deploys from GitHub. No auto-pause, preview deployments on every PR.

Your Supabase (backend)

DB, auth, storage, edge functions — under your own Supabase organization, with full data ownership.

The 5-step setup

1Export Lovable to GitHub

In Lovable, connect a GitHub repo (or use the "Push to GitHub" option in the project menu). This makes your frontend code portable.

Already done? Skip to step 2.

2Provision your Supabase project

Create a new Supabase project under your own organization at supabase.com, or self-host on your AWS account via Staticbot's self-hosted Supabase template.

3Migrate the backend (the part that takes time, if you do it manually)

Moving the database schema, data, edge functions, storage buckets, auth users, and OAuth identities from Lovable Cloud to your Supabase project is the substantive step. Staticbot automates it end-to-end in a single guided run.

Run the automated Lovable → Supabase migration

Or follow the manual 8-step CLI guide on the same page if you'd rather do it by hand.

4Connect Vercel to the GitHub repo

In the Vercel dashboard, import the GitHub repository Lovable pushes to. Vercel auto-detects Vite + React. In the project settings, add the new Supabase environment variables so the frontend points at your backend instead of Lovable Cloud:

VITE_SUPABASE_URL=https://<your-project>.supabase.co
VITE_SUPABASE_ANON_KEY=<your anon key>

Both values come from your Supabase project settings → API. Don't paste the service_role key — that one belongs server-side only.

5Keep editing in Lovable

Lovable continues to write changes to the same GitHub repo. Vercel picks up every push and redeploys the frontend automatically. The AI editing experience is unchanged; only the hosting and backend are now yours.

What this costs vs Lovable Cloud

Setup	Monthly base	What's included
Lovable Cloud (all bundled)	$25+ (Pro)	AI credits + bundled Supabase backend + frontend hosting. Auto-pauses idle projects.
Lovable + Vercel (DIY) + your Supabase (via Staticbot)	$25 (Lovable AI) + $0–20 (Vercel, you set up) + $0–25 (Supabase) + $19 one-time (Staticbot migration)	Each layer paid for on its own terms. No auto-pause. Data and code under your own accounts. Drop Lovable any time without losing the app.

Under low traffic (Vercel Hobby + Supabase Free) you can be paying only Lovable's AI subscription for a working production stack. The economics get more interesting as traffic grows — see the full hosting cost comparison.

Gotchas

Env vars must be `VITE_*` prefixed

Vite only exposes variables prefixed with VITE_ to the browser bundle. Lovable's default code uses this convention; if you renamed them, update Vercel accordingly.

OAuth callback URLs need updating

If you use Google/GitHub sign-in, update the OAuth provider's authorized redirect URIs to point at your new Supabase project's auth callback URL.

Vercel bandwidth scales differently from CloudFront

Vercel Pro's $0.15/GB overage on bandwidth becomes visible past a few TB/month. If you expect heavy traffic, CloudFront + S3 ($0.085/GB after 1 TB free) is cheaper — Staticbot can deploy to either.

Don't want to deal with the backend migration?

The frontend → Vercel part is mechanical (steps 4 and 5 above). The backend → Supabase part is where the work is: schema, data, edge functions, storage, auth identities, secrets, cron jobs. Staticbot automates that end-to-end in ~15 minutes for $19, one-time.

Start the automated migration