Headless Frontend Options for Vendure Compared

Vendure is a code-first, headless commerce framework, so the frontend is an explicit decision. Teams building on Vendure usually weigh three paths: use the official Next.js storefront, build a fully custom frontend on the Shop API, or put a Frontend Management Platform (FMP) like Laioutr on top. Here is the honest comparison.

The starting point: Vendure is code-first and GraphQL-native

Vendure, the open-source TypeScript framework built on Node.js, NestJS and GraphQL, exposes two GraphQL APIs: the Shop API for storefronts and the Admin API for administration. Catalog, pricing, orders, B2B workflows and custom logic live in the Vendure backend, extended through its plugin model. Because the storefront talks to the Shop API, the frontend layer is genuinely yours to choose.

Option 1: The official Next.js storefront

Vendure ships a Next.js storefront you can scaffold with @vendure/create. It is a strong starting point for an engineering team that wants full code ownership and is comfortable in React and GraphQL.

The trade-off: it is a starting point, not a finished product. You still build and maintain the component library, page templates, performance budget and accessibility yourself, and every marketing change is a code change.

Option 2: Fully custom build on the Shop API

A bespoke frontend in React, Vue, Nuxt or any framework consuming the GraphQL Shop API gives maximum control. The cost is a multi-month build, a dedicated frontend team and permanent ownership of hosting, upgrades, Core Web Vitals and accessibility. Sensible when frontend engineering is a strategic core capability.

Option 3: Laioutr FMP on the Vendure Shop API

Laioutr sits as a frontend layer on the existing GraphQL Shop API. The Vendure backend stays untouched, including your plugins and custom logic. You get a visual editor, more than 70 prebuilt commerce components, EU hosting and a Lighthouse 100 target.

This does not replace what makes Vendure good. It complements it: Vendure keeps full backend control, while marketing teams compose pages and campaigns without engineering tickets, and WCAG 3.0 and BFSG come as a platform baseline.

Side-by-side

• Time-to-launch: Next.js storefront = weeks to months of React work; Custom build = several months; Laioutr = weeks
• Year-1 TCO: storefront and custom = engineering-heavy; Laioutr = predictable subscription
• Maintenance: storefront and custom = your team; Laioutr = platform-operated
• Accessibility: storefront and custom = your responsibility; Laioutr = WCAG 3.0 and BFSG in the standard
• Backend optionality: custom = locked to Vendure; Laioutr = backend-agnostic across Vendure, commercetools, Shopify and more

When each option wins

The Next.js storefront or a custom build wins when you have a strong React or GraphQL team and pixel-level control is a strategic priority, which is exactly the audience Vendure is built for. Laioutr wins when you want weeks to go-live, marketing autonomy and built-in EU compliance on top of that backend.

FAQ

Does Laioutr replace the Vendure storefront?

It is an alternative frontend layer on the same Shop API. Keep the Next.js storefront, or use Laioutr for faster time-to-launch and no-code page composition.

Does the Vendure backend change?

No. Laioutr consumes the GraphQL Shop API. Catalog, pricing, plugins and order logic stay in Vendure.

How does pricing compare to building it ourselves?

Total cost of ownership is typically lower because hosting, components and the editor are included, and no separate frontend team is required. See pricing or book a strategy call.

Related reading: Headless Frontend Options for SCAYLE Compared and Headless Frontend Options for SAP Commerce Cloud Compared.