Choose a host — Ordio Documentation

Recommended options

Host	Best for	Included support
Netlify	The simplest guided deployment	`netlify.toml` and the default deploy command
Firebase Hosting	Keeping hosting and backend under one Google account	`firebase.json` and `--host=firebase`
Cloudflare Pages	Existing Cloudflare users	Standard Vite build; Pages handles SPA routing
Vercel	Existing Vercel users	`vercel.json` with build and rewrite settings
Another static host	Experienced users or existing infrastructure	Upload `dist` and configure the SPA rewrite manually

Netlify: recommended

Create a free Netlify account, then run these commands from the source folder:

npx netlify-cli@26.1.0 login
npx netlify-cli@26.1.0 sites:create --name your-unique-site-name

The second command creates and links the site. Netlify shows an address such as https://your-unique-site-name.netlify.app. Put that exact address in VITE_APP_URL inside .env.production.

Deploy Firebase and the frontend together:

npm run deploy

Firebase Hosting

Your Firebase project already provides addresses based on the project ID, such as https://YOUR_PROJECT_ID.web.app. Put the current Firebase Hosting address in .env.production, then run:

npm run deploy -- --host=firebase

The supplied firebase.json publishes dist, routes application pages to index.html, and applies the required headers.

Cloudflare Pages

Run the Firebase deployment without selecting a frontend host:

npm run deploy -- --host=none

Then either upload dist in Workers & Pages or connect a private Git repository with these settings:

Build command: npm run build
Build output directory: dist
Node version: 22

Cloudflare Pages treats a Vite project without a top-level 404.html as a single-page application. Add the current pages.dev or custom domain to Firebase Authorized domains.

The included vercel.json sets npm run build, the dist output folder and the required SPA rewrite. Add all production environment values in the Vercel project settings, then deploy from the project root with:

npx vercel --prod

Add the current vercel.app or custom domain to Firebase Authorized domains.

Another static host

Build and deploy Firebase without publishing the frontend:

npm run deploy -- --host=none

Upload the contents of dist to the host. Configure the host to serve /index.html with status 200 whenever a route does not match a real file. HTTPS is required for production authentication and payment flows.

Move from the temporary address to a custom domain

Launching on the host-provided address first is recommended. It lets you verify Ordio before changing DNS records. When the custom domain is connected and HTTPS is active:

Replace VITE_APP_URL in .env.production with the custom HTTPS address.
Replace STOREFRONT_BASE_URL in functions/.env with the same address.
Add the custom hostname in Firebase Console > Authentication > Settings > Authorized domains.
Run the same deployment command used for the first launch. If optional providers were deployed, include the same provider list, for example npm run deploy -- --providers=stripe,whatsapp.
Open the custom domain, refresh /admin, sign in and place another manual test order.

Keep the temporary host address authorized while you test the custom domain. Remove it later only if the hosting platform confirms it is no longer used for previews or redirects.

Required after every hosting choice

Open Firebase Console > Authentication > Settings > Authorized domains and add the hostname only, without https:// or a path. For example, add orders.example.com, not https://orders.example.com/admin.

Then open the storefront, refresh /admin directly, sign in and place a manual test order. If refreshing /admin shows 404, the SPA rewrite is missing.