Shopware Composable Frontends

The toolkit for advanced and rapid storefront development

Explore our cutting-edge SDK for building custom frontends. Evolve the way you work and create unrivaled shopping experiences with the smartest suite of tools.

Talk to our experts
Cloud First

Perform at the pace of your ideas



Liberate your frontend from your backend. Iterate and innovate faster. Define a fully custom frontend stack based on your specific business requirements.



Reinvent the shopping experience without reinventing the wheel. Use battle-tested functionalities to compose parts of your online store where you require them.

Cloud ready

Cloud ready

Make it effortless. Let Shopware handle your hosting with automatic software updates and maintenance while you focus on growing your business.

App supported

App supported

All plugin-/app-system based apps that offer functionality via the API are supported. This API functionality is accessible through the API client, as well as via Vue.js composables.

Ease, scale, and flexibility empowering you to drive innovation

Implement your ideas faster. Shopware Composable Frontends provides a simple set of Javascript APIs and Vue.js components. Build your frontends from scratch and have full ownership over your tech stack without any updates liabilities.

The cookbook will tell you exactly how to integrate Shopware features into your custom storefront, for example a wish list or the blog. With the API client and the composables, you don’t need to figure out how it all works, it just does.

The API client is an independent TypeScript library, not even bound to Vue.js. Use it in any JavaScript / Node.js based project. Use it with React, Svelte or just vanilla JavaScript. Start on a greenfield and just drop ecommerce functionalities where you want them.

Want to reuse our implementation of Shopping Experiences in your custom frontend? Go ahead – Shopware’s CMS is headless. Or would you rather use your own headless CMS? No problem, Composable Frontends has its capabilities bundled in a way that lets you integrate your CMS with ease.

From zero to hero frontends

How you set up your project determines the deployment process. Choose where you want to start – greenfield or with an existing project. With Shopware Composable Frontends, you have three options:

You can start off with a blank template, which is just an empty Nuxt.js application that has the Shopware Composable Frontends dependencies installed. Nuxt.js is a “meta” framework on top of Vue.js that adds features for routing and for file handling.

Alternatively, you can use the demo store template which is a reference implementation. It comes with most Shopware features and it’ll show you a preview of your frontend. Use the demo store template as a blueprint for your project or just as inspiration and a reference point.

The third option is starting with an existing JavaScript Node.js project, pulling in Composable Frontends as a JavaScript dependency, and installing it into your project. For example, the Astro starter template is using Composable Frontends in a project not based on Vue.js and showcases the versatility of the framework.

What knowledge do you need for Shopware Composable Frontends?

If you’re no stranger to Vue.js and know how to build applications in Javascript, you’ll be able to understand our in-depth documentation and get started with Composable Frontends right away. You don’t need specific Shopware knowledge and there's very little you need to learn about the SDK itself. Of course you need to understand which composables to use in order to build your frontend, but our getting started guides have got your back. There are no frameworks, no sugar, and no syntax you need to know of.

If your goal is to build an entire online store with Shopware Composable Frontends, you should have experience with the intricacies of Nuxt.js or your chosen framework. You need to understand how to solve challenges such as routing, data and state, caching, or any other advanced topics.

Dive deep into the tech

Why did we create Composable Frontends? How exactly does it differ to the Shopware PWA? And for which projects should you use it? Find out in this interview with Niklas Dzösch (Shopware Developer Evangelist) and Dominic Klein (Manager Developer Experience).

“Composable Frontends enables developers to leverage Shopware features in composable technology stacks. We understand that the frontend developer ecosystem changes quickly and is driven by constant improvement and innovation. That is why we aren’t forcing you to use any technology, but leave the choice up to you. At the same time we'll provide bite-sized examples that make sure you hit the ground running. Composable Frontends is the future-proof framework for building custom frontends with Shopware.”

Dominic Klein
Dominic Klein

shopware AG, Manager Developer Experience

Mees Hoogendoorn

"We chose Composable Frontends over the Shopware default storefront for a number of reasons. With the flexibility and customization options offered by Composable Frontends, we can create truly unique and tailored solutions. Additionally, the framework allows for a more modular and scalable approach to ecommerce development – composable commerce. Think about connecting a third-party headless CMS or your email marketing platform in a flexible and composable way. I believe this is crucial for businesses that are looking to grow and evolve over time."

Mees Hoogendoorn

Ecommerce Developer,

Niklas Wolf

"Why we love working with Composable Frontends? Because the frontend tech-stack matches our developers' skills far better than the Shopware default storefront. We also like having maximum flexibility with regards to frontend development as every project is a highly individual process. Thanks to the headless architecture, core updates are much easier. We only have to think about API breaks and not about changes in the storefront. Plus we can use Shopware for specific tasks only as other systems are easily integrated without writing code. The headless architecture also brings a strong, clearly defined boundary between the frontend and backend. In addition, we can leverage modern tooling and frontend features. We work much faster when developing performant individual storefronts in the short term and maintaining them in the long term."

Niklas Wolf

Lead Frontend Engineer,
mothership GmbH

Martin Weinmayr

"At dasistweb® we prioritize the adoption of Shopware Composable Frontends, which incorporates key aspects such as Tailwind.css, composable architecture, and frontend decoupling. By leveraging these features, we aim to deliver high-quality results to our customers with faster time-to-market and reduced maintenance efforts in the long run. We remain committed to utilizing the latest technologies and methodologies within Composable Frontends to offer our clients an exceptional service."

Martin Weinmayr

dasistweb GmbH

Insights and know-how

Blog posts

The future of Shopware PWA

With Shopware PWA we want to enable developers to build ecommerce websites with a clear division between client and server, allowing merchants to obtain a higher level of flexibility and scalability in custom ecommerce projects. Find more details here.


Want to join the conversation? Head over to Slack or StackOverflow.

Got questions regarding Shopware Composable Frontends?

Let’s talk