Why use Porch instead of Lovable’s built-in sharing?
Lovable’s built-in publish URL is public and branded with Lovable. Porch gives you two things that changes:
- Access control — password-protect your app or share with a specific invite list; nobody else can reach it
- Your own URL —
yourapp.getporch.appinstead of a Lovable-branded domain
Step 1: Get your Lovable project code
Lovable integrates with GitHub — it pushes your project code to a GitHub repo as you build. The easiest path is to connect GitHub from Lovable’s project settings if you haven’t already, then clone or download the repository from GitHub.
If your Lovable plan includes a direct export option, you can also download a zip from the project settings and extract it to a folder on your computer.
What you get is a Vite + React + Tailwind project — a package.json, a src/ folder, and a vite.config.ts.
Step 2: Set up environment variables (if using Supabase)
If your Lovable app uses Supabase, the project will have a .env.example or similar file listing the required variables. Create a .env file at the project root with your Supabase values:
The Supabase anon key is safe to include in a front-end build — it’s a public key designed for browser use, and Supabase’s Row Level Security policies control what data it can access.
If your app doesn’t use Supabase, skip this step entirely.
Step 3: Install dependencies and build
Open Terminal (Mac) or Command Prompt (Windows), navigate to your project folder, and run:
This creates a dist/ folder with all the static files ready to upload.
Need Node.js? The build step requires Node.js. Download the LTS version from nodejs.org, install it, then retry the commands above.
Step 4: Upload the dist/ folder to Porch
Sign in to Porch (free, no credit card) and click + New Porch. Drag the dist/ folder onto the upload area. Porch deploys it in about 30 seconds and gives you a live yourapp.getporch.app URL.
Step 5: Configure Supabase CORS (if applicable)
If your app makes Supabase requests, add your Porch URL to Supabase’s allowed origins:
- Go to your Supabase project dashboard → Authentication → URL Configuration
- Add
https://yourapp.getporch.appto the Site URL and Redirect URLs fields - Save and test your Porch link — Supabase calls should now work
If your app doesn’t use Supabase auth features, this step isn’t needed.
Step 6: Set access and share the link
By default, anyone with the link can open your Porch. To restrict access, go to Manage Access from your dashboard:
- Password: set a password — anyone visiting your URL must enter it first.
- Invite-only: add email addresses — each person gets a magic link, no Porch account needed.
Copy the yourapp.getporch.app URL and share it however you like.
Frequently asked questions
Will Supabase features work on Porch?+
Yes, with one configuration step. Add your Porch URL to Supabase’s allowed origins under Authentication → URL Configuration in your Supabase dashboard. The Supabase anon key that Lovable embeds in your project is safe to use in a static build — it’s designed for browser use, and Row Level Security controls what it can access.
Do recipients need a Lovable or Supabase account to view the app?+
No. Once hosted on Porch, visitors just open the Porch URL. They never see Lovable or Supabase branding. If your app has user authentication built in (like a sign-up form backed by Supabase Auth), users would still sign up through your app’s own form — but they don’t need a pre-existing Lovable or Supabase account.
Can I update the app after sharing the Porch link?+
Yes. Edit in Lovable, pull the latest from GitHub (or re-download), rebuild locally, then upload the new dist/ folder to Porch. The URL stays the same — no need to re-share the link.
The build failed — what should I check?+
Make sure npm install completed without errors first. If the build fails with a missing environment variable error, check that your .env file is in the project root and has the correct Supabase values. TypeScript errors from Lovable-generated code are rare but fixable — the error message usually points to the exact file and line.