Building a composable tech stack for B2C commerce: A comprehensive guide

Much has been said about composable commerce and best-of-breed solutions, but how can you actually build a modern tech stack? What are the elements of a tech stack in a composable environment? This guide provides the what, why and how to build a modern commerce tech stack for your business.

For a long time, delivering online shopping experiences was the job of a single vendor providing all things commerce under one roof, from search and personalization to checkout and subscriptions. The problem with this approach is that all of these functions are standardized and cannot be customized easily, so brands end up with identical customer experiences instead of unique, differentiated ones. 

Furthermore, customer experiences aren’t set in stone; over time, they must be adapted and updated. With an inflexible all-in-one platform, making changes isn’t easy. If your business isn’t able to keep up with customer expectations, this invariably impacts your ability to innovate, differentiate and grow. 

Composable commerce turns this model on its head. Now, it’s possible — and ideal — to create a tech stack with best-of-breed solutions that fit a company’s business requirements. That means your business can select and integrate expert components, such as search, product catalog, personalization and more, to craft powerful experiences. With composable’s unparalleled flexibility, you can add, swap or even drop components according to your budget, compatibility, functionality, etc. 

The result: You can provide cohesive customer experiences while becoming adaptable to new requirements, market shifts and customer needs. 

• Christie Cookie Co., an American gourmet cookie brand, delivers a premium shopping experience with customers engaging with the company as they wish, including customizing orders to their specifications. The result: 47% increase in average order value YoY. 

• Interflora UK, a leading flower delivery network, improved its website performance, SEO results, increased sales and reduced annual hosting costs by 20% with composable commerce. 

• SPORT 24, a Denmark-based sports retail chain, adopted a best-of-breed technology stack to leverage flexibility to create one-of-a-kind promotions and scalability to handle traffic spikes during seasonal events. Preliminary A/B tests revealed an increased order conversion by 14% and average order value by 13%.

• Ulta Beauty, an American beauty products retailer, created fun, functional and personalized shopping experiences that can be used regardless if the shopper is at home, on the go or in a store. The company provides personalized recommendations with Glam Lab, a virtual makeup try-on service powered by augmented reality (AR) and AI. 

With composable commerce, you can use chosen components to create customized customer journeys and orchestrate them in the way that works best for your business. It’s all about flexibility, agility and, most importantly, the freedom to design and implement commerce experiences without being limited by inflexible solutions.

But there’s more to it than the ability of assembling and reassembling components. For a system to be truly composable, it must combine three core traits: 

Cloud-native SaaS

Imagine that your Black Friday shopping is a breeze: You can load pages without delay and there’s no crash in sight, even though the retailer is probably experiencing the highest traffic in the whole year. Achieving this feat is possible through cloud-native SaaS, which helps businesses autoscale capacity to handle traffic peaks by tapping into the power of cloud computing providers (Google Cloud, AWS, Microsoft Azure). It means companies can achieve infinite scalability without managing infrastructure capacity themselves. 

Component-based

With independent and interchangeable components that can be easily integrated, swapped or removed from your system, you get limitless flexibility to try out new channels, experiment with ideas and tackle opportunities faster than ever. 

Technology-agnostic

Engineers and developers aren’t forced to have certifications in proprietary tech or code in specific programming languages. Freedom of engineering means you can solve business problems with the right technology for each case, instead of being handcuffed to flashy all-in-one proprietary solutions. 

By combining these traits, a composable system can provide three main benefits:

• Infinite scale: Brands are always ready for big moments. They can boost performance without limits, constantly responding to a new influx of traffic and customers without hassle. 

• Unlimited flexibility and agility: Change a component, not the platform. When something doesn’t work, you can easily replace it or drop it. There’s no vendor lock-in for your team to worry about. 

• Lower cost: When you invest in financial and technological flexibility, you achieve higher cost efficiency and eliminate technical debt. 

Now that you know what a composable tech stack is and why it’s vital to future-proof your business, let’s delve deeper into its specifics. First of all, a composable commerce tech stack  based on commercetools will have three layers:

• The presentation layer (customer-facing): The presentation layer, also known as the frontend, combines applications and languages used to develop and design your website or digital storefront. commercetools Frontend powers consumer-facing touchpoints and is extensible per customer needs. Alternatively, a custom-built or third-party frontend product can be used.

• The application layer (server-facing): The application layer, also known as the backend, provides the component-based applications to address eCommerce needs. commercetools applications for B2C and B2B businesses address specific eCommerce requirements; those are extensible per customer needs. Additionally, custom-built or third-party applications can be used. A wide range of integrations allows commercetools to connect with third-party offerings (applications, workflows, etc.)

• The platform: The commerce platform provides the cloud-native foundation and infrastructure for the presentation and application layers. 

In the following sections, you’ll learn more about the presentation and application layers based on the commercetools Platform.

The presentation layer is the eCommerce frontend, which refers to the visual and interactive components of a digital storefront (website, mobile app and social media) that customers directly interact with, including the copy and visuals, navigation menus, buttons and even pop-ups. All the UI (user interface) and UX (user experience) elements are laid out for the users to engage with. A well-designed and visually appealing frontend can help build brand trust and increase the likelihood of conversion and loyalty.   

There are different tools primed to build, manage, optimize and A/B test frontends, so let’s delve deeper into that:

• Build a (custom) frontend

• Manage: CMS/DXP systems

• Optimize: Personalization

• Test: A/B testing

Building a custom frontend  

Due to the limited flexibility of legacy commerce platforms, many companies choose to build custom frontends with web frameworks, creating unique, differentiated UI/UX for their users. However, a new software category has emerged — Frontend-as-a-Service (FEaaS) — with the mission to cut down the long and complex process of building a frontend solution from scratch. With such a service, you can leverage prepackaged software tools that make building unique frontend experiences easier and faster. 

Managing your frontend 

There are two main tools to consider to manage your frontend: A content management system (CMS) and/or a digital experience platform (DXP). 

A CMS is a software application or platform designed to simplify the creation, organization and publishing of digital content. It offers a user-friendly interface and a range of tools that empower individuals or teams to manage, author, edit and publish diverse types of content — including text, images, videos and documents — without requiring advanced coding skills. The CMS streamlines the content workflow to make creating and maintaining a dynamic online presence easier. Headless CMS solutions are emerging as the modern answer to the traditional CMSs that ruled content management in the last decades. 

DXPs offer comprehensive solutions for managing digital assets across various channels, such as websites, mobile apps, customer portals, IoT devices and social media platforms. Leveraging AI and machine learning, DXPs enable personalized content delivery on web pages, emails and other channels, tailoring experiences for individual users rather than categorizing them into behavioral groups. By utilizing DXPs, businesses can provide highly personalized experiences while maintaining consistent messaging and branding across all channels, resulting in a cohesive and engaging customer journey.

Optimizing your frontend

Optimize your frontend with personalization and recommendation engines. 

Personalization engines enable brands to provide individualized experiences where they feel addressed in a one-to-one fashion. Personalization platforms utilize AI and machine learning algorithms to continuously monitor real-time onsite behavior and customer data, enabling tailored experiences for each website visitor. These platforms allow retailers to personalize various aspects, including onsite search, product recommendations, ad retargeting, push notifications and even dynamic pricing when applicable.

Recommendation engines utilize predefined rules to filter and organize the product offerings in your online store. These rules leverage data about your products, such as the number of views, sales and reviews, to present the most popular and relevant items. The presentation of these results can range from the straightforward arrangement of products on category pages to more strategic placements aimed at influencing buyers throughout their entire customer journey.

Testing your frontend 

Experimentation is a central part of any growth story! A/B testing plays a significant role in helping businesses become more disciplined and focused on how they experiment to learn what works and what doesn’t for your business growth. 

The application layer is the commerce backend (or the commerce engine), which refers to the behind-the-scenes components of eCommerce, handling the business logic and data management processes. It encompasses the server-side operations, database management and administrative functionalities that power the online store.

The backend is responsible for tasks across discovery (search, PIM), checkout (cart and order), payments and systems of record. In a modern, composable commerce environment, the backend is decoupled from the frontend and communication is API-only. 

commercetools Composable Commerce for B2C provides a wide range of components for brands and retailers, from carts and orders to promotions, pricing and even search. The best-of-breed nature of commercetools, however, gives you the choice to select and integrate the components that make more sense for your business. For example, you may choose to use commercetools for a set of components, such as carts and orders, and manage your product catalog with another provider or even with an application built in-house. 

Let’s explore the key components of your commerce tech stack across the following categories: 

• Discovery: Use components for search, personalization/recommendations, PIM (product information management) and MarTech applications. 

• Checkout: Carts and orders, promotion and pricing engines are key components you should explore. 

• Payment: Integrate PSP (payment service providers) or payment gateways, BNPL (buy now, pay later) and subscriptions. 

• Systems of record: Ensure that all components can seamlessly integrate/communicate with your OMS/inventory system, ERP, CDP and fulfillment systems. 

Discovery

The discovery process is supported by various tools and functionalities on the commerce backend, including:

• Search is a critical feature of online shopping, with the search function being the most common way for consumers to find products on a retail site. Yet, only one in 10 consumers find what they’re searching for, and 82% of consumers avoid websites where they’ve experienced search difficulties in the past. To prevent such worrisome figures, you can integrate modern search solutions that intelligently interpret and yield relevant results to complex search queries. For instance, you can also add AI and NLP (natural language processing) to boost your search performance. Check here how to integrate an external search into commercetools. 

• A PIM system is a single place to collect, manage and enrich your product information, create a product catalog and distribute it to your sales and eCommerce channels. In addition, PIM helps you to localize and contextualize product information to different regions, languages and markets. Also, this system activates your product records everywhere, acting as a single source of truth for your product data. A PIM should be easily integrated into a composable tech stack by communicating via APIs with the other components of your architecture. 

• MarTech refers to software marketers use to build and optimize their marketing efforts, which may include CRM, social media management, email marketing, SEO analysis and many other tools. Regardless of what tools you decide to use in your marketing, it can be easily integrated and managed in a composable tech stack.

Checkout

The checkout process is at the heart of the customer journey! With the right technology, you can future-proof your checkout and make it more performant, customize it per channel and optimize conversions. 

• Cart and order components enable an omnichannel checkout process, whereby customers can come to the checkout page from vastly different touchpoints, such as email, scanning a QR code, clicking on an ad and more. The convergence of these touchpoints and third-party applications, like product catalog, order, price, cart, payment service provider and other components, all come together at checkout, making it a crucial point in the digital commerce journey. 

• Promotion engines deliver personalized promotional offerings to shoppers based on their unique characteristics, allowing you to set up complex promotion rules based on multiple criteria. That way, you can ensure that a personalized promotion is available at the right step of the user journey and in the right channel.

• Pricing engines ensure each product is displayed with accurate pricing based on currency, country, channels, taxation rules, applied promotions, etc.

Payment

There are many payment tools you can integrate to differentiate the payment experience, from payment service providers (PSPs) and payment gateways to BNPL and subscriptions: 

• PSPs and payment gateways are networks through which your customers transfer funds to you. Payment gateways are similar to the point-of-sale terminals used at most brick-and-mortar stores. When using a payment gateway, such as Adyen, Worldpay and Stripe, customers and businesses need to work together to make a transaction.

• Buy Now Pay Later (BNPL) is a loan offered to a customer at the point of sale so they can purchase merchandise on credit but without a credit card. Popular options include Afterpay, Sezzle, PayPal and Klarna.

• Subscription payments, also called recurring payments, are automatic payments on a schedule, e.g., monthly or annual, and can be enabled by providers, such as Bold and Checkout.com. The customer can withdraw permission or cancel the subscription.

Systems of record

While not necessarily a part of the commerce stack, systems of record like OMS, ERP, CDP and others are required to ensure the post-checkout experience. Essentially, a system of record holds essential business data, such as customer information, financial transactions, inventory data or employee records. It is a reliable source of truth that other systems or applications rely upon for accessing or updating relevant information. When these solutions are poorly integrated into the rest of the ecosystem, they create lots of inefficiencies and may negatively impact customer experiences through delayed deliveries, unclear return policies, order errors, etc.

The beauty of composable is that you can build your tech stack to be truly unique and customized to your business needs. But how can this be achieved in a fast and simple way? 

Accelerating time to value is critical for companies embracing composable commerce. There are three ways your business can achieve this goal:

• Think incremental for your rollout: More organizations are adopting an incremental approach instead of risky “big bang” migration methods for composable implementations. With Agile methodologies, they address project complexity and scale by breaking down large tasks and projects into bite-sized, more manageable pieces. This also means creating MVPs (minimum viable products) to test the waters before proceeding with the rollout. 

• Utilize accelerators and implementation partners: You don’t have to go composable all by yourself. Tap into the expertise of accelerators and implementation partners for faster time to value. 

• Leverage pre-composed solutions: The fastest way to adopt composable is by using pre-composed solutions, such as commercetools Foundry for B2C Retail, which provide a pre-configured set of components, features, best practices and launchpads, making your composable implementation simpler and faster. 

It’s clear that composable commerce is not just a trend but a strategic imperative for businesses seeking to thrive in an era of constant change. As Paul Hornby, Digital Customer Experience Director at The Very Group, said: “The best technology route to deliver business strategy for us was composable.”

Discover the ins and outs of composable commerce with our guide How to Compose Your Commerce in 2024.