Hosted Environment Variables
Review your saved provider settings and fill any gaps before deploying to Production or Preview.
Was this page helpful?
See the hosted deployment status before using this deployment guide.
Use this page alongside Vercel Deployment to check the hosted values you've saved. Keep existing values for that target and fill only missing required settings before deploying.
You can set up Preview when you need it. Use Stripe test mode or Polar sandbox for the first hosted billing checks. Automated Stripe guest proof uses capture email; the manual Polar journey uses real application email.
Still working locally? Start with Environment Variables.
On Vercel, open your app's project and go to Settings → Environment Variables. Select Production for your first deployment on the stable app domain. Production is the hosting target; you'll still use test payments while you set it up.
When you add Preview later, use the same variable names. Change the values to match that preview's domain and providers:
| Values | Preview | Production |
|---|---|---|
| App origin | Your preview app's HTTPS origin | Your stable production domain |
| Supabase URL, keys, and database | A separate test project or branch | Your production project |
| Stripe mode, keys, and catalog IDs | test, with matching test values | test during setup; live with live values at launch |
| Polar environment, credentials and offers | sandbox, with matching sandbox values | sandbox during setup; production with production values at launch |
| App email | Match the selected check | test_capture for Stripe guest automation; real for manual Polar checks and launch |
Configure the selected billing provider's row. A Polar-only app does not need Stripe keys or catalog IDs; keep them when Stripe still handles retained billing or outstanding deliveries.
You can scope Vercel Preview values to a branch. Choose a stable preview origin and configure its Auth redirects and billing webhook for that origin too.
For Docker or VPS, use the Docker environment steps:
save NEXT_PUBLIC_* values in .env.build before building the image and
server-only values in .env.runtime for the running container. Rebuild
whenever the public values change.
Use this block to check the names and sections in your saved settings. If you're configuring a new target, copy it into your hosting provider's settings and replace its placeholders using the linked setup guides below.
This example includes the default Stripe provider. For Polar, omit the Stripe sections and save the server-only settings from hosted Polar setup (Next.js reference) and Polar environment reference. See the hosted deployment status. Use the Resend settings for real email at launch.
# App origin
NEXT_PUBLIC_APP_URL=https://yourdomain.com
# Supabase Auth and database
NEXT_PUBLIC_SUPABASE_URL=https://xxx.supabase.co
NEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY=...
SUPABASE_SECRET_KEY=...
DATABASE_URL=postgresql://postgres.xxx:[password]@aws-0-us-east-1.pooler.supabase.com:6543/postgres?sslmode=require
# Stripe only: settings shared by lifetime and subscription billing
NEXT_PUBLIC_STRIPE_MODE=test
NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=pk_test_...
STRIPE_SECRET_KEY=sk_test_...
STRIPE_WEBHOOK_SECRET=whsec_...
# Lifetime billing IDs: Individual and Team (one-time payments)
# Optional: configure only the lifetime offers you sell.
# Individual
NEXT_PUBLIC_STRIPE_INDIVIDUAL_PRODUCT_ID=prod_replace_me
NEXT_PUBLIC_STRIPE_INDIVIDUAL_PRICE_ID=price_replace_me
# Team
NEXT_PUBLIC_STRIPE_TEAM_PRODUCT_ID=prod_replace_me
NEXT_PUBLIC_STRIPE_TEAM_PRICE_ID=price_replace_me
# Subscription billing IDs: Starter, Pro, and Business (monthly/yearly)
# Optional: configure only the subscription offers and cadences you sell.
# Starter
NEXT_PUBLIC_STRIPE_STARTER_PRODUCT_ID=prod_replace_me
NEXT_PUBLIC_STRIPE_STARTER_PRICE_ID_MONTHLY=price_replace_me
NEXT_PUBLIC_STRIPE_STARTER_PRICE_ID_YEARLY=price_replace_me
# Pro
NEXT_PUBLIC_STRIPE_PRO_PRODUCT_ID=prod_replace_me
NEXT_PUBLIC_STRIPE_PRO_PRICE_ID_MONTHLY=price_replace_me
NEXT_PUBLIC_STRIPE_PRO_PRICE_ID_YEARLY=price_replace_me
# Business
NEXT_PUBLIC_STRIPE_BUSINESS_PRODUCT_ID=prod_replace_me
NEXT_PUBLIC_STRIPE_BUSINESS_PRICE_ID_MONTHLY=price_replace_me
NEXT_PUBLIC_STRIPE_BUSINESS_PRICE_ID_YEARLY=price_replace_me
# Email delivery for automated Stripe guest checks
EMAIL_DELIVERY_MODE=test_capture
TEST_EMAIL_CAPTURE_TOKEN=...
# Real email for hosted Polar checks or launch: set EMAIL_DELIVERY_MODE=real
# RESEND_API_KEY=re_...
# RESEND_FROM_EMAIL=onboarding@yourdomain.comThe Vercel guide already explains how to save your hosted values. Return to the relevant section if something is missing:
The shipped src/config/pricing.config.ts defines lifetime and subscription
tiers as presentation. Configure a Stripe Price ID for each tier and billing
period you offer; Product IDs are optional in both test and live mode. An
unmapped offer remains unavailable. Malformed supplied IDs are rejected
when the offer is resolved, and availability and checkout fail closed.
Polar also needs mappings only for the offers you sell.
Review the entries already saved for your selected environment. If you've added or corrected a value, save that change to the same target. Mark database URLs, secret keys, webhook secrets, and the capture token as sensitive. Keep their values out of commits, logs, and support messages.
Before you deploy, check that:
You're ready to deploy with these saved values. Saving settings does not update an existing deployment or prove that the providers connect; follow the deployment guide's checks on the resulting app.
After changing any NEXT_PUBLIC_* value, rebuild and redeploy. Vite
includes the statically referenced import.meta.env.NEXT_PUBLIC_* values
in browser JavaScript during the build, so
changes to the origin, public keys, Stripe mode, or IDs need a new build.
Keep server credentials unprefixed.
Vite environment variables and modes.
Use this reference to check a specific entry's default or requirements.
Before upgrading an existing live app to environment-selected catalogs, set
NEXT_PUBLIC_STRIPE_MODE=live and the sold offers' live Price inputs,
then rebuild. A live key alone does not switch the default test catalog.
Rename NEXT_PUBLIC_SUPABASE_ANON_KEY to
NEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY and SUPABASE_SERVICE_ROLE_KEY to
SUPABASE_SECRET_KEY everywhere you configure the app. The current runtime
does not read the old names. Supabase can keep both key generations active while
you migrate each environment; follow the Supabase API-key migration guide
before deactivating legacy keys.
Select Stripe mode explicitly for every environment. Vercel Preview builds also
use NODE_ENV=production; that does not switch Stripe to live mode. The
normal vite build uses production mode and does not load .env.preview.
Save Preview values in the hosting provider's Preview settings.
Vite modes.
Vite loads mode-specific files, .env.local, and .env for development and
builds; an existing process variable has priority. The built Node server does
not load those files automatically. Your host must supply server credentials,
or you can pass an ignored runtime file with Node's --env-file option.
Keep build-time public values aligned with the runtime's Supabase project,
Stripe account, and canonical origin. vite.config.ts exposes only the
NEXT_PUBLIC_ prefix; adding a server secret to that prefix would publish it.
Use the configured NEXT_PUBLIC_APP_URL origin when opening the app. Hono
mutations and Start's server-function Origin/Referer checks use that public
origin, including when a trusted HTTPS proxy forwards HTTP to Node. Changing
the public host or scheme requires updating the setting and rebuilding.