Headless commerce lets you decouple the storefront from the backend — so you can swap the storefront for a new technology or design without rewriting the engine underneath. Adobe Commerce supports three approaches.
Three primary approaches
- Monolithic with theme — Adobe Commerce backend plus an out-of-the-box, third-party, or custom theme. Frontend and backend coupled.
- PWA (Progressive Web App) — Google’s PWA pattern, somewhat headless. Adobe previously promoted PWA Studio (Venia theme) as the recommended approach. Frontend and backend decoupled.
- True headless — Adobe App Builder, API Mesh, or third-party orchestration using REST APIs and GraphQL. Frontend and backend fully decoupled.
API Mesh for Adobe Developer App Builder
API Mesh is a decoupled API platform that enables developers to integrate private and third-party APIs with Adobe products using Adobe I/O. It consolidates multiple data sources into a unified GraphQL endpoint, letting you specify the exact data you need in the response.
Microservices built using App Builder can be called from a front-end (typically a React app, often developed within App Builder itself). By centralizing sources through a singular gateway and delivering tailored responses, API Mesh improves the user experience when interfacing with your backend services.
When to go truly headless
True headless makes sense when:
- You have multiple storefronts (mobile app, web, in-store kiosk) sharing one backend.
- You want maximum design flexibility and modern front-end performance.
- You have the engineering capacity to maintain a separate front-end codebase.
- You need to integrate Commerce with non-Adobe systems via a unified API layer.
Reference
Adapted from the Adobe Commerce Primer, slides 22–24. Last reviewed May 2026.