Composable Storefront (Spartacus) – The Future of SAP Commerce

composable storefront preview image

Composable Storefront (Spartacus) – The Future of SAP Commerce

spartacus-storefront-background-blog

Written by Abdul Wahab

Director of Technology – SAP at Royal Cyber

February 3, 2023

SAP Commerce Cloud has been rapidly evolving and greater expectations are set with the new Spartacus Storefront. In a traditional eCommerce system, the frontend, where customers directly interact with your business, is tightly coupled with the backend that deals with database, code, and integrations. This means that any changes required to the storefront need changes in backend as well. There are many limitations on what can be changed or updated without significant risks or what would affect future updates.

With the emergence of Headless commerce, we now have a more powerful and versatile architecture. Developers can develop a new frontend from scratch or use the existing frontend depending on their needs. With users interacting with content in new ways, traditional CMS might not be enough for companies.

SAP Commerce Cloud has a dedicated headless storefront catering to B2C and B2B businesses.

What is Composable Storefront?

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

Starting with version 5.0, “SAP Commerce Cloud, composable storefront” is the name for the official release of project “Spartacus” libraries published by SAP. The officially supported composable storefront is available to SAP Commerce Cloud customers with its documentation on the SAP Help Portal.

Spartacus Business Values

spartacus-business-values--blog

Composable Storefront – Library as a Service

  • Spartacus schematics allow you to install Spartacus libraries in your project with simple CLI commands
  • Different schematics are available and can be installed based on the project needs (add-pwa /add-ssr)
  • Spartacus comes with integrated core and features libraries (can be added as Lazy loading modules for better performance)

Understanding the Migration Procedure – Accelerator to Spartacus

  • This migration is more of a technical shift from legacy to modern web technology
  • No tools are available for the migration; consider it a completely new development
  • No portion of the Accelerator storefront is reusable
  • The version of Spartacus storefront libraries depends on the version of SAP Commerce Cloud. Therefore, you may need to upgrade to the SAP Commerce Cloud version. Refer to – https://sap.github.io/spartacus-docs/feature-release-versions/
  • Spartacus is API driven, so you must introduce the OOC API layer from SAP Commerce Cloud and expose the OCC Rest API
  • SAP will announce deprecation and removal plans at a later date. SAP’s goal is to move all customers to Spartacus, or at least JavaScript-based storefronts
  • SAP also recommends a piece-by-piece or MVP migration approach
  • Accelerator and Spartacus can run on a domain that reduces challenges on partial migration, seamlessly switching between the two
  • Seamless sync-up of session
  • Migration efforts depend upon customization level

What’s New in Composable Storefront?

  • Framework update: Angular 14
  • Cart library refactored to @spartacus/cart
  • New command and query design pattern introduced in Spartacus 5.0 to dereplicate ngrx store pattern to retrieve data
  • Screen reader and other accessibility support
  • PDF and Video Component Support – new CMS component were added
  • You can now add products from a Saved Cart to an Active Cart and Clear Cart
  • UX enhancement on scroll to top and show password features
  • Configurable products integration upgraded attributes
  • SAP Customer Data Cloud pages now use composable storefront login and registration

Things to Remember

  • A composable storefront does not support B2C and B2B storefronts in a single storefront application. If you install B2B features, the B2C storefront will load, but it will not work properly
  • If you select a feature that is for B2B storefronts, the schematics automatically add any required B2B configurations if they are missing
  • Composable storefront can only be used with SAP Commerce Cloud 2105 or newer; the latest release is recommended

Why Would You Use SAP Composable Storefront?

With Commerce Cloud’s out-of-the-box accelerator, you get JSP-based templates provided as part of the Accelerator storefronts. So then, why would you move or start your project with a Spartacus based storefront?

Key Benefits

  • Decoupled Architecture – Spartacus storefronts are decoupled from SAP Commerce Cloud instances, allowing you to completely separate frontend and backend development. Composable storefront apps run on their server node and make OCC REST API calls to SAP Commerce Cloud backend servers. The benefit is that you can update the Spartacus app separately when you update the platform. Also, you can scale and cache different servers independently from each other.
  • Upgradable – Since Spartacus is published as libraries, upgrades are under the user’s control. The architecture of Spartacus ensures compatibility. It is configurable and extendable, which means you can add your functionalities or hide the existing ones based on your needs.
  • Faster Implementation – Spartacus is fast to develop and it is a PWA, a Progressive Web App. It supports SEO even though it is a single-page application.
  • Extendable – You can customize and extend the composable storefront with various SAP solutions like CPQ, CP1, and Kyma.
  • Accessibility Compliance – Composable storefront features comply with the following success criteria of Web Content Accessibility Guidelines (WCAG) 2.1 information published on non-SAP sites.
  • Migration – Partly or step-by-step migration from Accelerator to composable storefront is possible.
sap-composable-storefront-blog

Roadmap on Post-5.0

User Experience and Feature Improvements

Note that certain features require specific SAP Commerce Cloud backend releases, including future releases. For example, B2B Registration requires SAP Commerce Cloud 2105. Requirements will be documented when the feature is released.

Architecture-Related Improvements

Our Capabilities

  • Experienced domain experts with in-depth understanding of B2B/B2C eCommerce trends across 12+ industries
  • Increased efficiency and consistency by using reusable components
  • Experts in eCommerce architectural patterns and UX/UI design
  • 180+ SAP Commerce Experts and 40+ composable storefront experts
  • Offer in-house Spartacus training
  • Working with companies like Fletcher builder, Meon, Purchasing Power, and Albabtain

To conclude, Spartacus allows you to quickly create a fast, engaging PWA storefront for SAP Commerce Cloud, resulting in a delightful customer experience that increases conversion and revenue.

Future-Proof your Business

With growing customer expectations, content delivery is going to be of utmost importance. By moving to composable storefront, you can make sure that your business is moving in the right direction. Spartacus is the future, and the expectation is that within a few years, we will all stop using JSP-based monolithic accelerators and use Spartacus Headless Storefront. Our dedicated team of SAP Commerce Cloud experts at Royal Cyber can help you with future-proofing your business. For more details, you can email us at [email protected]. Click to know more about our SAP Commerce services.

Discover the Potential of Our SAP Commerce Services

Recent Blogs

  • Revolutionizing Customer Support with Salesforce Einstein GPT for Service Cloud
    Harness the power of AI with Salesforce Einstein GPT for Service Cloud. Unlock innovative ways …Read More »
  • Salesforce Hyperforce: A Deep Dive into the Future of Cloud Deployment
    Discover Salesforce Hyperforce, the future of cloud deployment. Explore its scalability, security, and global reach, …Read More »
  • LLMs in Retail: Which Operations Can You Transform With AI?
    Artificial Intelligence (AI) has been making significant waves across various industries, revolutionizing business operations.Read More »