Skip to Main Content

Oct 4, 2021 | 6 minute read

Headless Commerce + Headless CMS: The Perfect Combination?

written by Greg Lord

Headless commerce CMS feature

Brands embracing digital commerce channels to expand and grow revenue streams online have embraced experience-driven commerce for over a decade, using headless commerce and eCommerce APIs to allow content management systems (CMS) and digital experience platforms (DXP) to power the front end, rather than be restricted to the features and functionality offered from traditional, out-of-the-box with commerce platforms where the front-end and the back-end of the application were designed as a single, monolithic application.

Why use a CMS with your headless commerce platform?

In addition to more robust content capabilities, CMS-powered commerce offers the following benefits to digital commerce teams:

  • Supports rich, interactive experiences that showcase the brand
  • Unifies websites -- brands no longer need to use a sub-domain for the eCommerce store that requires its own systems (with the cost, maintenance and user friction a separate commerce store entails)
  • Enables business users to make content updates independent of IT and schedule cutovers
  • Enables back-end developers to make updates without worrying if it might break something “up front”
  • May extend content to flexible, mobile-first front end frameworks such as React.js, Vue.js, Ember.js et al for Single Page Applications (SPAs) and Progressive Web Apps (PWAs) -- depending on your environment

Since the rise of content-driven commerce, both commerce and content management platforms have continued to evolve. Today’s modern commerce platforms go beyond simply decoupling the front end to enable CMS-driven commerce to embrace multi-touchpoint extensibility and support any touchpoint - and to make life easier for developers. Content management solutions have gone headless for the same reasons.

Decoupled vs Headless CMS

Like legacy ecommerce platforms, content management systems were traditionally developed and deployed as monoliths with all components tightly coupled within a single code base, making development, scalability, and extensibility challenging and complex. And as with digital commerce, such CMS solutions were built primarily for a browser-only world, before the rise of mobile, wearables, IoT, voice commerce, and other modern digital commerce touchpoints.

Decoupled Content Management

Many CMS vendors have taken the first step towards embracing a headless architecture by decoupling the front-end from the back-end content repository, thus separating content creation from delivery. With a decoupled CMS, the “head” (i.e. the front-end user interface that the end-customer interacts with) is provided with the CMS solution, but its use is optional. The CMS’ API can connect to any front end in place of or alongside the application’s head.

This decoupling enables content to be deployed to multiple front end environments, and also allows a website to be redesigned or significantly updated without reimplementing or restarting the CMS.

True Headless Content Management

True headless content management applications don’t provide any head, assuming the organization using the CMS wants to build and deploy content to their own, customized heads with the flexibility to swap-in and swap-out best-of-breed solutions over time and more easily adapt to the ever-changing market preference for the latest and greatest front-end JavaScript frameworks of the moment, which has only gained in popularity as of late with the rise of the JAMstack movement.

But the key differentiator between decoupled and headless content management is flexibility and control. True headless allows custom content and experiences to be served from the same content hub to multiple front ends and devices, tailored to their context. Content assets can be remixed and recomposed based on what makes the most sense for the experience and device form factors.

For example, mobile apps can have their own look and feel, show or hide custom content, reformat content or support their own user journeys. Or, touch screen applications can show selective content, formatted for their location, purpose and screen resolution. Similarly, you can reuse a buy button, form, banner, or any design element across any experience.

It’s not uncommon for an enterprise to run multiple, siloed CMSes to cover all their channels, touchpoints, and business units. This approach is sometimes intention and sometimes merely a factor of large companies with different groups operating with autonomy over technology selection decisions. With headless content management, virtually any experience can be powered from a single CMS without restrictions or sacrificing custom content to satisfy all channels.

Deliver unique customer experiences

Get a custom demo to see how Elastic Path will help you deliver the unique customer experience you've always imagined.

Better Together: How Headless Commerce + Content Management Support the Agile Enterprise

Deliver truly unique and contextual experiences across touchpoints

Enterprises that embrace headless commerce and eCommerce microservices to quickly spin up new and innovative experiences shouldn’t be held back by monolithic content platforms! Headless commerce-plus-content ensures omni-channel experiences are optimized for both form and function.

Support greenfield projects without a legacy rip-and-replace

The best part of an agile technology environment based on both a headless commerce platform and a headless CMS is the ability to launch new projects - even experimental or greenfield projects - without investing in separate, siloed platforms, introducing risk into the legacy environment, or taking months or years to deploy.

Future-proof your environment

API-driven solutions offer the ability to unlock the full potential of Composable Commerce, thereby providing the flexibility to swap-in and swap-out best of breed solutions as the needs of the business change over time, and avoiding being locked in to a rigid, monolithic technology stack. For  headless commerce, today this means leveraging lightning-fast front end frameworks like React.js and its cousins to serve mobile-friendly single page applications (SPAs) and progressive web apps (PWAs). As new technologies and devices come down the pike, they can simply bolt-on to what you’ve built on your back end.

When headless content management isn’t right for you

As with headless commerce, headless content isn’t right for every organization. Headless CMS is best for teams with seasoned developers (or a trusted agency or System Integrator) who have the requisite skills needed to build and maintain front-end frameworks that will be powered by the headless CMS, and the organization must have the appetite to deploy unique experiences across touchpoints, and the need for agility.

However, in today’s mobile-first, multi-touchpoint world, a decoupled CMS at minimum is suitable for most enterprises and ensures modern front ends such as SPAs and PWAs are supported. We hope that this article was helpful in explaining more about the rapidly growing trend of brands using both headless commerce platforms and headless CMS solutions together to accelerate digital innovation, increase agility, and unlock new digital revenue channels.