Zopping
Get a token

Build a storefront or app

Build a buyer-facing storefront or mobile app on the Storefront API — the public, customer-facing endpoints served by the frontend gateway at the store's own domain. Use any tech you like, or take the theme/SDK shortcut.

How a storefront works

  1. A visitor hits the store's domain (e.g. tamimi.zopping.com).
  2. The frontend gateway resolves domain → organization → store and injects that context automatically — your calls don't pass organizationId.
  3. Your app fetches a layout for the page and renders the sections it returns, then calls catalog/cart/checkout/account endpoints as the shopper navigates.

Base URL: https://<store-domain>/api/.... Every response uses the standard envelope ({ code, status, data }).

Public vs. customer session

  • Public (no auth): storefront config, layouts, navigation, catalog browse, announcements — everything needed to render and browse.
  • Customer session: account, addresses, wishlist, the customer's own orders, and checkout-to-order. The shopper logs in via POST /api/login (or POST /api/otp → customer-verification) and you receive an accessToken to send as Authorization: Bearer <accessToken>.
  • Guest checkout is supported on /api/cart and /api/checkout.

(Contrast with the backend gateway, which is staff/partner-authenticated — see Authentication.)

Two ways to build

1. Any tech, against the raw API. It's plain REST/JSON — React, Vue, Svelte, Next.js, native iOS/Android, anything:

curl https://<store-domain>/api/organization
curl https://<store-domain>/api/layout/home
curl "https://<store-domain>/api/product?q=rice"

The framework-agnostic @zopping/ecom client wraps these (auth, cart store, typed responses) if you want a head start without committing to a UI:

import { createClient } from '@zopping/ecom'
const client = createClient({ domain: 'store.zopping.com' })
const layout = await client.getLayout('home')

2. The theme shortcut. If you don't want to build serving and plumbing, scaffold a theme on the storefront-system — JSON tokens render a full store using @zopping/ecom-ui; add CSS or React component overrides as needed:

npx @zopping/create-theme my-theme

A theme is published as a static bundle; the gateway resolves domain → org → theme and serves it. It's an option — the underlying APIs are the same ones above.

Next