Discover the Commerce PWA Kit & Commerce Managed Runtime

Learning Objectives 

After completing this unit, you’ll be able to:

  • Explain how headless commerce gives merchants the agility to keep pace with their shoppers.
  • Describe how Commerce PWA Kit and Commerce Managed Runtime integrate with Salesforce B2C Commerce APIs.
  • List three benefits of Commerce Managed Runtime.
  • Give three reasons why merchants need Commerce PWA Kit and Commerce Managed Runtime for their B2C Commerce headless application.

Why Headless?

Headless commerce gives merchants the agility to keep pace with their shoppers. It lets them create custom experiences and deliver commerce to any device or application. But what is it exactly? Headless commerce is when the front-end experience layer (the head) is decoupled from the back-end commerce engine, with APIs bridging the gap. This allows front-end and back-end development teams to focus on their respective applications without stepping on each other’s toes.

Mobify, acquired by Salesforce in 2020, provides the Commerce PWA Kit and Commerce Managed Runtime as part of the B2C Commerce solution. Here are the benefits that they offer. 

  • Quick time to value: Instead of starting from scratch, use the PWA Kit and Managed Runtime for a faster go live. Create modern web storefronts via progressive web apps (PWAs) with merchant friendly themes.
  • Enhanced flexibility and productivity: Customize the Commerce PWA Kit’s pre-built React templates and offload runtime management to focus on innovation. Build with efficiency tools such as NodeJS SDK and resources on the Commerce Cloud Developer Center.
  • Assured trust and scale: Deliver trust and scale with the Commerce Managed Runtime in a public cloud with a historical 99.99% uptime and proven global customer success.

B2C Commerce provides a flexible platform of tools to achieve your ecommerce goals. The Commerce PWA Kit and Commerce Managed Runtime sit on top of B2C Commerce APIs to enable a headless approach that unlocks front-end speed, flexibility, and scale.

Developers build headless apps with PWA Kit and Managed Runtime using ref apps via the App Exchange.

The PWA Kit and Managed Runtime provide the same stability and reliability that you’ve come to know and trust from B2C Commerce—but on the front-end.

PWA Kit

A progressive web application (PWA) is a type of application software delivered through the web, built using common web technologies such as HTML, CSS, and JavaScript. It works on any platform that uses a standards-compliant browser, for desktop and mobile.

The Commerce PWA Kit is a PWA and the foundation for building headless web experiences on the B2C Commerce platform. It includes prebuilt React templates that speed time to value and offer full control of the customer experience. 

PWA, a modern web technology, provides lightning-fast performance and app-like engagement across mobile, tablet, and desktop. You can see from this table how PWA compares with responsive design and native applications and the use cases for each.


Responsive

PWA

Native

What is it?

A website that dynamically scales across different screen sizes

A responsive website that provides native app-like performance and features

An application available on a specific program (iOS, Android) that can access device-side capabilities

When does it make sense?

When a traditional web storefront meets your needs

When you want a faster, more engaging app-like experience

When you want to drive higher engagement with your most loyal customer base

Managed Runtime

A front-end app that’s separated from the backend can’t rely on the ecommerce platform for storefront operations. That’s where a managed runtime can help. It’s a platform on top of the operating system and architecture running beneath it. The Commerce Managed Runtime provides the infrastructure to host, deploy, secure, scale, and monitor the PWA Kit and front-end applications in a decoupled environment.

  • Slash time to market: Use a prebuilt high-scale, fully decoupled, serverless, public cloud native platform to run an enterprise storefront in a headless environment.
  • Enhance trust and scalability: Offload operational burden and stress with a reliable solution that ensures enterprise scalability with a historical 99.99% uptime.
  • Add flexibility: Own the customer experience with the freedom to innovate and evolve that experience independent of backend systems.

The API Connection

B2C Commerce APIs are fast, with enhanced developer efficiency for building and integrating commerce experiences for hundreds of storefront applications. Developers can layer the Commerce PWA Kit and Managed Runtime on top of B2C Commerce and other back-end systems using these APIs. While B2C Commerce provides the critical commerce services (like pricing, promotions, search, and Einstein), the PWA Kit and Managed Runtime use B2C Commerce APIs to access these services, render the web experience, and provide the operations infrastructure.

The Managed Runtime adds layers of caching to reduce API calls to B2C Commerce, while automated monitoring tracks performance across the front and back ends, finding and tracing bottlenecks.

Under Armour

The Commerce PWA Kit and Managed Runtime help merchants like Under Armour take their sites to the next level with a modern PWA experience and flexible headless approach. 

In 2020, Under Armour standardized on the Storefront Reference Architecture (SFRA) across 40+ unique global storefronts, including North America. With 65% of the traffic driven by mobile, Under Armour wanted to optimize its mobile experience and improve flexibility. Using the Commerce PWA Kit, Under Armour launched a PWA experience in 26 international markets to optimize specific mobile pages and provide regions with headless flexibility. Under Armour used the Commerce Managed Runtime to speed time to market. After 65 days with its new PWA in market, one region saw a 76% increase in conversion rate.

Summary

In this module, you learned how headless commerce helps merchants keep pace with their shoppers. You discovered how Commerce PWA Kit and Commerce Managed Runtime help on the front end for fast and flexible mobile-first development. 

Resources 

Keep learning for
free!
Sign up for an account to continue.
What’s in it for you?
  • 1 in 4 land a new job
  • 50% receive a promotion or raise
  • 80% learn new technologies that boost their resume
  • 66% say it increases productivity
Source: Trailblazer Community Impact Survey 2019