StorefrontsGetting started

Getting started

Deploy a live, tenant-bound storefront in about five minutes.

What you need

  • A tenant ref — your store’s id, issued when your store was provisioned (e.g. nova-peptide). Ask your Flightdeck operator if you don’t have it.
  • A storefront token — the x-storefront-token credential, issued by your Flightdeck operator when your store is provisioned (there is no self-serve screen for it today). It authorizes placing orders and is deliberately narrow (checkout only), but it is currently platform-wide, not per-tenant — your tenant comes from the URL path the SDK pins, and per-tenant scoping is planned. Server-side only; treat it like a password.
  • The API origin — e.g. https://api.ruo.pro.
  • A Vercel account (free tier is fine).

Option A — deploy the starter (fastest)

  1. Clone the storefront starter (or use the Deploy to Vercel button in its README — see Deploying).

  2. Set the four required environment variables:

    FLIGHTDECK_API_URL="https://api.ruo.pro"
FLIGHTDECK_TENANT="your-store-tenant-ref"
FLIGHTDECK_STOREFRONT_TOKEN="…"           # operator-issued; server-side secret
SESSION_SECRET="$(openssl rand -hex 32)"  # signs shopper sessions

  3. Deploy. Your store renders immediately on the *.vercel.app URL — no custom domain required to see it live. This works because setting FLIGHTDECK_TENANT pins the deployment to your store and resolves it by tenant, independent of the request host (see Configuration).

  4. When you’re ready, add your custom domain in Vercel and verify it in your merchant console. Nothing about the app changes. See Custom domains.

That’s a working store: catalog, product pages, cart, checkout, accounts.

Option B — call the API yourself (any framework)

Install the SDK and talk to the API from your own server code:

import { createStorefrontClient } from "@dscodotco/sdk";
 
const store = createStorefrontClient({
  apiUrl: process.env.FLIGHTDECK_API_URL!,
  tenant: process.env.FLIGHTDECK_TENANT!,
  storefrontToken: process.env.FLIGHTDECK_STOREFRONT_TOKEN!, // server-side ONLY
});
 
const { products } = await store.products.list();

The client is tenant-pinned — you never repeat the tenant, and you can’t address another one. Full surface in the SDK reference.

Never construct the client in browser code. The storefront token would ship in the bundle. Put it in a Route Handler, a server component, or an edge function. See Build your own frontend.

Local development

Run the starter locally with the four env vars in .env.local:

cp .env.example .env.local   # fill in the four required vars
npm install
npm run dev                  # http://localhost:3000

Leave FLIGHTDECK_API_URL unset to serve bundled demo fixtures with no running platform — useful for UI work. In production that fixture fallback is refused (fail-closed): a live deploy never silently serves a demo catalog.

Next steps

OverviewConfiguration