Commerce Engine Starters
Available for React, Next.js, TanStack Start, Astro, SvelteKit, and Node.js.
Previewing the Linea storefront.
Get started
Run the command yourself, or hand it to your coding agent. Both routes end at the same project — configured, typed, and talking to the API.
One command clones a production starter on your framework — or writes the Commerce Engine layer into the repo you already have.
What are you starting from?
pnpm create commercengine@latestA new project selected.
Install the skills and your coding agent reads the real spec — every SDK method, schema and pattern — before it writes a line.
Which agent are you using?
npx skills add commercengine/skills --agent claude-codeClaude Code selected.
Either route lands here
A project that already talks to Commerce Engine
Client, session handling and environment written for you — @commercengine/storefront, /checkout, /seo and /ai installed before you open the editor.
Storefront templates
Start with a polished storefront and customise every component, interaction, and customer journey.
01 / 03
3 templates shown.
An elegant jewellery storefront designed for premium brands, editorial product storytelling, and refined shopping experiences.
Next.js selected. The demo and source links now open the Next.js build of Linea.
A modern electronics storefront designed for product-rich catalogues, bold merchandising, and fast product discovery.
Next.js selected. The demo and source links now open the Next.js build of Little Things.
A refined beauty storefront designed for skincare, cosmetics, and ritual-led product storytelling.
Next.js selected. The demo and source links now open the Next.js build of SOJA.
Every starter connects to the same Commerce Engine APIs and commerce capabilities.
Vite · Client-side SPA
App Router · SSG with ISR
SSG with link crawling
SSG with island hydration
Svelte 5 · SSG with static adapter
Storefront SDK · Server-side services and APIs
How it works
No scaffolding, no boilerplate. Every step below is a choice you make once — the commerce layer is already wired up.
Storefront designs
3 designs
Linea
Jewellery & Luxury
Little Things
Electronics & Lifestyle
Available stacks
6 stacks
Wired up from day one
11 capabilities
Step 1 of 3: Choose a template.
Every starter includes the foundation needed to load products, manage carts, and build custom commerce experiences with Commerce Engine APIs.
import {
createStorefront,
Environment,
} from "@commercengine/storefront";
export const storefront = createStorefront({
storeId: process.env.NEXT_PUBLIC_STORE_ID!,
apiKey: process.env.NEXT_PUBLIC_API_KEY!,
environment: Environment.Production,
});
// The starter's product page loads its data like this.
const { data, error } = await storefront
.public()
.catalog.getProductDetail({
product_id: "aureon-groovegrid-x1",
});
if (error) throw new Error(error.message);
console.log(data.product.name);Pick a template, choose your stack, and take a fully customizable storefront to production in hours.