Composable Storefront FAQ

What is composable storefront?

Composable storefront is an open-source JavaScript web application that allows you to quickly create your own branded JavaScript-based storefront for SAP Commerce Cloud. Composable storefront is written using Angular and published as libraries. The recommended approach to using composable storefront is to build your own JavaScript web app and import the libraries. Without modification, the storefront works out of the box, but composable storefront has been designed to be upgradable, customizable, and extensible, to suit all your branding and functionality requirements.

You can view the composable storefront source code in this GitHub repository.

Does composable storefront require SAP Commerce Cloud?

Composable storefront is designed to work with SAP Commerce Cloud, although it is possible to use composable storefront with other systems. For more information, see Connecting to Other Systems.

Having said that, composable storefront relies on SAP Commerce Cloud APIs and CMS content to function out-of-the-box. However, if you’re using SAP Commerce Cloud, you are not required to use composable storefront. You can create your own JavaScript web application or you can use Accelerator templates.

How does composable storefront integrate with SAP Commerce Cloud?

Composable storefront is 100% API-driven; in this case, the SAP Commerce Cloud instance is run in a headless fashion. The composable storefront makes the necessary calls to SAP Commerce Cloud via the RESTful APIs that are part of the Omni Commerce Connect. This decoupling allows you to separate front end and back end development, permitting independent update cycles.

SAP Commerce Cloud building and deployment are infrastructure hosting features that are separate from composable storefront itself. The hosting service can host any front end, not just composable storefront. In terms of the infrastructure, if you build SAP Commerce Cloud and the back end has not changed, it will skip that step and build the JS storefront only, then deploy all of it. Some customers host composable storefront using a service other than SAP hosting. Being able to independently update composable storefront in our own hosting service is in our backlog.

Do I need to have a particular version of SAP Commerce Cloud in order to work with composable storefront?

SAP Commerce Cloud 2105 or newer is required.

Does composable storefront integrate with any other SAP products?

Yes. For more information, see Integrations.

Which browsers does composable storefront support?

Composable storefront actively supports evergreen web browsers. Non-evergreen browsers that support the same standards as evergreen browsers will typically work as well. For older browsers that do not support these standards, you can add the necessary support with custom implementations. For more information, see Web Browser Support.

How does composable storefront compare to the SAP Commerce Cloud Accelerators?

Accelerators were introduced in SAP Commerce v4.4 to provide a ready-to-use starter implementation; they allowed partners to quickly develop an omni-channel experience by changing an example storefront. While extensible, the templates were not easily upgradable, they were JSP-based, and the storefronts were coupled tightly with the platform. Composable storefront is a set of libraries that help you create a decoupled, modern, JavaScript-based storefront that is similarly extensible but vastly more upgradable. Composable storefront is the strategic way forward for maintaining a customizable storefront with SAP Commerce Cloud.

Are there features that are missing in composable storefront that exist in the SAP Commerce Cloud Accelerators?

Composable storefront does not have full feature parity when compared with all the Accelerators available for SAP Commerce Cloud. However, the feature gap is not large, and we are actively working on providing the few features that are missing.

Can I run composable storefront and an Accelerator storefront at the same time?

We do not recommend running composable storefront and an Accelerator storefront at the same time, due to the complexity involved.

Does this mean the Accelerators will be deprecated?

Plans for dereleasing Accelerators have been announced. Our goal is to move all customers to composable storefront, or at least JavaScript-based storefronts.

If I’m currently using an SAP Commerce Cloud Accelerator, how do I migrate to a composable storefront-based storefront?

Composable storefront is a complete paradigm shift from the Accelerators in terms of technologies and architecture (libraries vs. template, headless vs. embedded, Angular vs JSP). As such, there is no direct way to migrate from an Accelerator-based storefront to one that uses the composable storefront libraries. Some considerations to think about: custom functionality requires APIs for composable storefront; styling from Accelerator cannot be copied; any custom CMS components require new custom Angular components. On the other hand, developing a JavaScript-based front end is a much faster process than with Accelerator. We recommend that you contact the Expert Services team (sapcx-expertservices@sap.com), who are responsible for Commerce customization. If any help is needed for your implementation, they will be more than happy to assist you on this.

How long does it take to get a composable storefront-based storefront up and running?

Assuming a vanilla SAP Commerce Cloud B2C back end is up and running and configured to accept OCC API calls, a developer can get create a composable storefront-based storefront within 10 minutes. See Setting Up the Composable Storefront.

Is there a demo of composable storefront available?

Yes! For links to the fully functional B2C Electronics storefront and B2B Powertools storefront, see Composable Storefront Demo Sites.

What enablement options exist for helping me understand how to use composable storefront? Is training available?

Documentation is available from the composable storefront GitHub Pages documentation site. We are starting a collection of helpful how-to videos. Official training via SAP Education is not planned for launch but may be made available in the future.

Can I customize composable storefront?

Composable storefront is a set of libraries that contain core libraries, components and styling. You can choose which versions of the libraries you would like to use in your application, and these can be used to fully configure and customize your storefront. However, customization is not done in the same way as with Accelerator; you never customize composable storefront code directly – rather, you override or replace styling and code. This approach allows ease of upgradability.

What is the release cycle for composable storefront?

Composable storefront releases are independent of the release cycle of SAP Commerce Cloud. Generally, new composable storefront libraries will be released every 2 weeks.

What technologies does composable storefront use?

Composable storefront uses the Angular framework, TypeScript, RxJS, NgRx, SASS, Bootstrap, and other technologies. Please see Setting Up the Composable Storefront for the correct versions required.

Does composable storefront implement Responsive Design?

Yes. Out-of-the-box, composable storefront supports mobile, tablet, desktop, and wide-desktop breakpoints, and you can configure your own.

Is there going to be a version of composable storefront available to develop native iOS and/or Android apps?

There are no plans for native mobile apps. Composable storefront implements Responsive Design (so that the storefront layout looks correct in mobile devices) and is also a Progressive Web App (PWA) (so that the storefront behaves similar to a native app, although this feature is not complete yet). Capabilities are being added that will allow your storefront to act more like a traditional native mobile application, with great performance and reliability, and mobile-native features.

Do I need to host my composable storefront JavaScript storefront? What is required?

You can host, or we can. SAP Commerce Cloud in the Public Cloud includes support for building and deploying JavaScript Storefronts. If you’re hosting an on-premise version of SAP Commerce, then you will need to determine where to best build and deploy your storefront, as well as when/how to best scale it.

What about SEO? I heard that single page storefronts result in lower SEO ranking and make it difficult to share pages on social media. Is this an issue with composable storefront?

Not an issue. No storefront would work without SEO. Composable storefront is indeed a “SPA” (Single-Page Application), which improves performance and flexibility while only loading one page. In order to support SEO, composable storefront also supports Server-Side Rendering (SSR), which builds entire pages on the server side before providing content to the client. SSR provides web crawlers with access to individual pages for search indexing purposes. SSR also allows users to share a link to a page on social media, for example, and composable storefront also allows configuration of social media meta tags. Usage of SSR has the added benefit of greatly speeding up first time-to-view.

Your server must also support SSR functionality. For more information, see Enable Server-Side Rendering.

Does composable storefront scale? How?

Composable storefronts are JavaScript web applications that communicate to the back end through REST APIs. This means that composable storefronts (or any JavaScript-based storefronts) are decoupled from the back end SAP Commerce Cloud instance; so its nodes can be scaled separately. Other scaling considerations such as a Content Delivery Network (CDN) can also be leveraged to help decrease load. Additionally, with PWA cache-first networking capabilities, you will have the option to cache resources locally on the user’s device.

How do I get support when I run into issues with composable storefront?

You can get support for composable storefront in the following ways:

• Get answers from our developers and the composable storefront community by asking a question on Stack Overflow.

• Problem or bug? If you have a SAP Commerce Cloud license, create a customer support ticket.

Will composable storefront work with Intelligent Selling Services for SAP Commerce Cloud?

Yes. For more information, see Intelligent Selling Services for SAP Commerce Cloud Integration.

------