Skip to content
MITSource public at launch

Three storefronts to build from

Complete shops in Next.js, Nuxt and Astro with Alpine: catalogue, search, basket, Stripe checkout and accounts, already wired to the Elara One API.

Get startedBook a demo
localhost:3004
cp .env.example .env.local
npm ci
npm run dev
# ready on http://localhost:3004

Pick your framework

Same shop, three ways to build it

Each starter is a backend-for-frontend: your server talks to the API, and the browser only talks to your server.

  • Nuxt

    Nuxt 3.21 · Vue 3.5

    Nuxt server routes as the backend-for-frontend, with the key and secret held in private runtime config.

    ~/storefront-vue
    cp .env.example .env
npm ci
npm run dev

    Environment

    • NUXT_ENGINE_URL
    • NUXT_TENANT_KEY
    • NUXT_TENANT_SECRET
    • Built on the same stack as our demo store
    • Instant search held to 15 KB gzip, checked after every build
    • Typed with vue-tsc in strict mode, Vitest and Playwright

    Public at launchRuns on localhost:3002

  • Astro + Alpine

    Astro 7 · Alpine.js 3

    Every page rendered on the server by Astro, with Alpine.js for the basket, search and checkout. Light enough for any host.

    ~/storefront-alpine
    cp .env.example .env
npm install
npm run dev

    Environment

    • ELARAONE_ENGINE_URL
    • ELARAONE_TENANT_KEY
    • ELARAONE_TENANT_SECRET
    • Filters, search, sort and pages work before JavaScript loads
    • Instant search adds no more than 8 KB gzip
    • Lead forms and cookie settings post without JavaScript

    Public at launchRuns on localhost:3005

In every starter

A whole shop, not a demo

All three render the same pages from the same API calls, so a customer can browse, search, pay and track an order on day one.

  • Catalogue and collections

    Listings with collection, price and sort filters, and option pickers on every product.

  • Instant search

    Suggestions as you type, facets, synonyms and a full results page.

  • Basket with promotions

    Discount codes, free gifts, “spend £X more” nudges and a tax breakdown.

  • Stripe card checkout

    Stripe’s Payment Element on the store’s own Stripe account, delivery or click and collect.

  • Customer accounts

    Sign in, register, verify email, reset password, order history and an address book.

  • Guest order tracking

    Look up an order by reference and email, with dispatch and tracking links.

  • CMS pages and lead forms

    Every block type rendered, forms with Turnstile spam checks and marketing consent.

  • Web chat

    A chat bubble on every page, answered from your inbox (with the Live chat module).

  • Consent banner

    A first-party consent record, and Google Analytics only after the shopper agrees.

  • Tests you can run

    Vitest unit tests and Playwright end-to-end tests, including against a locked store.

  • PayPal buttonsNot yet

    The API takes PayPal today; the starters do not show PayPal buttons yet.

Built the safe way

Secrets stay on the server

The browser never calls the API directly. Your storefront’s server holds the key and secret, and the shopper only ever sees httpOnly cookies.

  • Refuses to start without the secret

    In production, each starter checks for the server secret before it serves a single page.

  • Fails the build if a secret leaks

    npm run check:bundle scans the built files and fails if the key or secret appears in anything a browser can load.

  • Rate limits per shopper

    The server passes on each shopper’s IP with the secret, so limits apply to the shopper, not to your whole site.

  • Tested against a locked store

    The Playwright suite can first check that the engine refuses calls without the secret, then run the full shop.

Questions

Starter questions

Something else? Read the developer overview or ask us.

Can I see the source?
The starters are MIT-licensed and their source goes public at launch. Until then, book a demo and we will walk your developers through the code.
Do I have to use a starter?
No. Any frontend that can call an HTTPS API from a server works with Elara One. The starters show one careful way to do it, and are easy to borrow from.
Can shoppers pay with PayPal?
The API takes PayPal today, on the store’s own PayPal account. The starters only show Stripe card checkout for now, so PayPal buttons are yours to add.
Where can I host a starter?
Anywhere that runs Node.js: Next.js and Nuxt need Node 20 or later, Astro needs Node 22.12 or later. Each keeps its secrets in server environment variables.
Which one should I pick?
The one your team already knows. They share the same architecture and security model, so you can compare them file for file.

Want a look at the code?

Get started and have your store ready for launch day, or book a demo and we will walk your developers through a starter.

Get startedBook a demo