Lovable Deployment Guide: Static Hosting or Your Own Server with DeployHQ
Lovable is an AI-powered platform for building full-stack web applications — describe an app in natural language and Lovable scaffolds a complete project with a Vite + React frontend and a Supabase backend for auth, database, and storage. Lovable's default hosting is Lovable Cloud, served at <project>.lovable.app. This guide covers the alternative: deploying Lovable apps with DeployHQ, where you choose between free Static Hosting on Cloudflare's edge and full-server deployment to your own infrastructure — and Supabase keeps doing the backend work either way.
Why Deploy Beyond Lovable Cloud?
Lovable Cloud is fine for sharing a demo. For shipping a real project, owning the deploy makes more sense:
- Custom domain control. Custom domains on Lovable Cloud are a paid plan feature. Deploying with DeployHQ gives you full DNS control over any domain you own.
- Avoid vendor lock-in. A
*.lovable.appURL accumulates SEO equity, OAuth callback URLs, and user bookmarks. Picking a portable host up front keeps your options open if you outgrow Lovable later. - Predictable pricing. Lovable Cloud's hosting is bundled into Lovable's plan structure; DeployHQ's pricing is flat across the static and managed-VPS tiers.
- Hosting choice. Deploy to your own VPS, dedicated server, or shared host over SFTP/SSH/Rsync — or run on Cloudflare's global edge — all from the same DeployHQ project.
Two Deploy Paths — Pick the Right One
Lovable scaffolds a Vite + React frontend and wires it up to a Supabase backend that handles auth, database, storage, and Edge Functions. The deploy target depends on what extras you've added on top:
| Your Lovable project | Deploy target | Why |
|---|---|---|
| Stock Lovable frontend talking to Supabase — auth via Supabase Auth, data via Supabase Postgres, business logic via Supabase Edge Functions | DeployHQ Static Hosting | Vite output ships to Cloudflare's edge for free during beta; Supabase keeps running on Supabase |
| Custom Node servers you've added beyond what Supabase Edge Functions cover — long-running workers, WebSocket servers, anything that needs a Node runtime at request time | DeployHQ Managed VPS or your own server | The custom server needs a Node runtime; Static Hosting doesn't provide one |
Both paths use the same DeployHQ project and the same Git workflow — only the deploy target differs. Static Hosting replaces the <project>.lovable.app URL, not the Supabase backend behind it. Auth still flows through Supabase. Data still lives in Supabase. Edge Functions still run on Supabase.
Step 1: Build Your App with Lovable
Navigate to lovable.dev and sign in or create an account. Lovable's chat-based interface lets you describe the app you want — "Create a to-do list web app with user authentication and a database to store tasks." The AI generates the full project, which you can then refine via follow-up prompts or by editing the code directly.
Lovable scaffolds Vite + React + TypeScript with shadcn/ui components by default. Auth is wired up to Supabase Auth, the database is a Supabase Postgres instance, and any server-side business logic lives in Supabase Edge Functions written in Deno. That whole back-end stack continues to run on Supabase regardless of where you deploy the frontend — DeployHQ just changes where the React bundle is served from.
Step 2: Sync Your Project to GitHub
Lovable has built-in two-way GitHub sync. Every change you make in the Lovable editor commits to a GitHub repo you control, and you can push from your own editor back into the same repo.
In Lovable, click the GitHub icon in the project menu (top right), authorize Lovable's GitHub integration, and either create a new repository or connect an existing one. Lovable pushes the current state of the project — src/, package.json, vite.config.ts, tailwind.config.ts, index.html, and the supabase/ directory with any migrations and Edge Function code — to the main branch.
Once the repository is live on GitHub, both deploy paths (Static Hosting and Managed VPS) connect DeployHQ to that same repository.
Path A — DeployHQ Static Hosting (recommended for stock Lovable projects)
If your Lovable project hasn't grown a custom Node server beyond Supabase Edge Functions, Static Hosting is the cleanest fit. It runs on Cloudflare's global edge, framework-detects the Vite + React build, and is free during beta.
The end-to-end walkthrough — connecting the GitHub repo, configuring the build pipeline with the right Supabase env vars, updating Supabase Auth redirect URLs for the new domain, the OAuth-provider allowlist gotcha, and the RLS-policy-mismatch debugging tip — lives in How to Deploy a Lovable Frontend to DeployHQ Static Hosting. The whole loop takes under 20 minutes.
In summary: you connect DeployHQ to the GitHub repo, point it at Static Hosting, set the output directory to dist/, enable SPA mode (Lovable uses React Router), set VITE_SUPABASE_URL and VITE_SUPABASE_ANON_KEY in DeployHQ's environment-variable UI, run npm ci && npm run build in the build pipeline, and push. Then add the new domain to Supabase Auth's redirect URL allowlist so auth flows round-trip correctly.
For the broader positioning around AI-built apps and Static Hosting, the free static hosting for AI-built apps post covers the choice between v0, Bolt, Lovable, and Firebase Studio as starting points and where each one fits.
Path B — Your Own Server (Managed VPS, SFTP, SSH, Rsync)
If your Lovable project has grown a custom Node server beyond Supabase Edge Functions — long-running background workers, a custom WebSocket layer, or a Node service that doesn't fit the serverless model — Static Hosting can't run that code. DeployHQ Managed VPS — or a server you already run — keeps both the Vite frontend and your custom server running end to end. Supabase continues to handle auth, database, storage, and Edge Functions.
The pipeline:
- Create a DeployHQ project and connect it to your GitHub, GitLab, or Bitbucket repository.
- Add a server under Servers & Groups → New Server. Pick Managed VPS, SFTP, SSH, Rsync, or S3 depending on where you're hosting, and enter the connection details.
- Configure the build pipeline under the project's Configuration tab. For a standard Lovable project, set the build command to
npm ci && npm run build. Build artifacts cache between deploys so cold-start times stay reasonable. - Set environment variables in DeployHQ's environment-variable UI —
VITE_SUPABASE_URL,VITE_SUPABASE_ANON_KEY, and any otherVITE_*variables your project uses (Stripe publishable key, public API endpoints). Supabase service-role keys and other secrets stay on the server side or inside Supabase Edge Function secrets, never in the client bundle. - Set the deploy path to where the server expects your files (
/var/www/your-app,/public_html, or wherever your hosting provider drops compiled output). - Deploy from the Deployments tab — pick the branch (typically
main), select the configured server, and click Deploy.
For a custom Node server that needs to run continuously, set up a process manager (pm2, systemd, or your provider's equivalent) and a post-deploy SSH command to restart it after each deploy.
After the first deploy, add the new domain to Supabase Auth → URL Configuration so OAuth and magic-link sign-ins work from the new URL. This is the same step covered in the Static Hosting blog post — it applies regardless of where the frontend is served.
Sign up free for DeployHQ to start a project — the free tier covers the first connected repo, and the included Static Hosting site lets you try Path A end to end before deciding which suits the project.
Step 5: Set Up Automatic Deployments
One of DeployHQ's most useful features is automatic deployments triggered by a Git webhook. Once configured, every push to your repository kicks off a deployment — no manual intervention required.
In DeployHQ's project settings, navigate to Automatic Deployments and copy the webhook URL. In your GitHub repository's Settings → Webhooks, add a new webhook, paste the URL, set the content type to application/json, and choose the push event. From that point on, pushing to your configured branch triggers a deployment.
This is particularly useful with Lovable's two-way sync: a tweak in the Lovable editor pushes to GitHub, GitHub fires the webhook, DeployHQ runs the build, and the new version lands on your domain within minutes.
The same webhook works whether you're deploying via Path A (Static Hosting) or Path B (Managed VPS or your own server) — DeployHQ runs whichever pipeline you configured.
Step 6: Monitor Your Live Application
DeployHQ provides a detailed log of every deployment so you can monitor status in real time. The logs show files transferred, errors encountered, and the success or failure of each step. If something breaks, the one-click rollback button on the dashboard reverts to the previous deployment in seconds while you and Lovable work out what went wrong.
Building With Other AI Tools?
If you're evaluating the broader AI-app-builder landscape, the DeployHQ deployment guides cover the major options:
- Bolt — framework-agnostic (Vite, Astro, SvelteKit, Next.js, Remix)
- v0 — Vercel's AI-powered platform, primarily Next.js
- Firebase Studio — Google's AI-powered cloud IDE
- Replit — full development environment with deploys
For AI-assisted coding editors that work alongside your local stack, see the Cursor, Windsurf, and Cline setup guides.
Questions or feedback on deploying Lovable projects with DeployHQ? Email support@deployhq.com or follow @deployhq on X for product updates.