What’s Composable Commerce (And Is It Right for Your Brand?)

September 23, 2021
by
Kaitlyn Ambrose

What’s Composable Commerce (And Is It Right for Your Brand?)

September 23, 2021
by
Kaitlyn Ambrose
Back to the blog
Get the latest straight to your inbox
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Share on:

For years now, ecommerce brands have heard that the only way to create the best possible ecommerce experience is to hand-pick every tech component powering your store. Essentially assembling your perfect headless front and backend solution like choosing entrees from a buffet. 

Of course, you want to use the best tech to power your store (with the flexibility you need to stay competitive). Who doesn’t love options? (or a buffet for that matter!) But—while this approach suits some stores—there’s another way to achieve headless commerce without complexity, massive investment in custom software, or juggling multiple vendors and contracts.

Here we’ll cover what composable commerce is, it's pros and cons, and why it’s not necessarily the only approach in town for brands that need to be agile. 

We’ll also share an alternative for brands hoping to go headless without added complexity. After reading, you’ll have a good sense of what approach might help you most. 

So settle in, and let’s get started.

What is composable commerce?

Composable commerce is a way for businesses to build a completely unique ecommerce experience by combining the best-of-breed technology aligning with their business goals. 

In other words, brands can cherry-pick top-tier technology to create a memorable online shopping experience. 

One way to think about composable commerce—also known as “modular commerce”—is like hand-selecting all the Lego pieces to build your ideal online experience. 

Except—when it comes to the frontend of your store—the Lego pieces are your content management system (CMS), middleware, content delivery network (CDN), server-side rendering frameworks, and more!

Building a custom frontend from scratch involves hand-picking + paying for all of the components making the site work. 

Many enterprise merchants with big developer teams like the approach of composable commerce because it allows for complete control.

This is one of the biggest benefits to composable—but there are other advantages too, like:

  • Memorable shopping experiences at any touchpoint, helping your brand stand out 
  • The power to choose your software/swap out pieces you prefer at given times, and
  • Long-term agility because you can swap out given pieces as best practices change.

However, there are cons to consider depending on the size of your business, like:

  • Ongoing management of multiple vendors and contracts for each component
  • Many complex decisions to make over modular pieces of your frontend (which your ecommerce team may not need oversight over)
  • Requiring a large development team to do ongoing maintenance and compliance, and
  • This method can get very costly

While composable commerce makes it possible to tailor-make each component of your store, for most ecommerce brands, it can actually make more sense to look to an alternative instead. Especially when it comes to your frontend presentation layer.

For scaling ecommerce brands, composable commerce isn’t the only option anymore

Now, instead of custom assembling a frontend from scratch for your headless commerce solution, brands can use a unified frontend platform. 

Think of it this way: If composable commerce is like choosing every single piece you want for your ideal custom Lego set from your imagination, a packaged frontend solution is kind of like choosing a specific Lego set with the standard (and best) pieces you need to build something incredible.

A composable build is like choosing custom Lego pieces you want to build your creation, whereas a bundled solution is like choosing a specific Lego set that includes all the pieces in the box you need to bring something cool to life. 

With a packaged frontend solution, your brand enjoys all the benefits of going headless, like:

  • Keeping your existing backend totally intact (your payments, checkout, and inventory management from Shopify, Shopify Plus, or BigCommerce can all stay the same) 
  • Gaining creative flexibility on the presentation layer of your store without code, reliance on developers, or tradeoffs to site performance.
  • Unparalleled page-to-page load times that lead to more conversions.

The difference is that—with a packaged all-in-one frontend platform (like Shogun Frontend), you can focus on the revenue-driving actions of your business, like the customer-facing experience and content of your website. This, instead of piecing together custom software from scratch (which really isn’t the focus of your direct-to-consumer business). 

Plus, with an end-to-end platform like Shogun Frontend, your team gets other benefits like more control with less code too, and a native CMS purpose-built for ecommerce managers.

#cta-mini-fe#Curious to see how a packaged frontend solution works?Get a demo from our team

So how do you know if a packaged frontend solution will have everything you need? Let’s look at what’s included in the Lego set. 

The anatomy of Shogun Frontend 🧬

When you custom code a frontend from scratch, it’s made of the following parts:

  • A custom coded storefront layer
  • Your server-side rendering (SSR) framework
  • The content delivery network (CDN)
  • Your content management system (CMS)
  • Middleware connecting everything together
  • Third-party integrations you code

When you go the packaged, frontend-as-a-service route, all these modular components get bundled and taken care of for you. 

For example, Shogun Frontend is already built with best-in-breed technology. Here’s what comprises our platform and why we’re confident these are the very best components for the frontend for your headless ecommerce site.

How we power our stores

Shogun Frontend uses the JavaScript framework, React.js, and the server-side rendering framework, Next.js to bring stores’ frontends to life. 

We’re confident React.js is a framework that will continue to pave the way for exceptional ecommerce, which is why we’ve chosen it to power our software for customers. And we’re excited to see our friends at Shopify agree: During Shopify Unite 2021, it was announced that Shopify plans to use React.js to build their Hydrogen framework for developers. 

Additionally, Next.js makes React-based web application functionalities, like server-side rendering and generating static websites, possible. 

We chose Next.js to power Shogun Frontend because:

  • It’s the most popular React framework with the largest ecosystem
  • It’s battle-tested against bugs
  • The majority of our engineers are familiar with it
  • It offers many features while remaining flexible
  • It produces extremely fast storefronts

Choosing React.js and Next.js was a no-brainer for us not only because they are industry-leading software, but they enable Shogun customers to bring their store vision to life without constraints.

Content delivery network (CDN)

A big part of creating exceptional ecommerce experiences is making sure all your customers—no matter where they’re located or what device they’re using—get the same, quality experience. And a reliable content delivery network (CDN) makes this possible.

For this, Shogun Frontend uses Fastly, a secure, edge cloud platform that helps you reach more users without lag or server disruption. It’s used far and wide by leading ecommerce providers (looking at you, Shopify).

Content management system (CMS)

We know ecommerce, so when building Shogun Frontend, we knew a robust CMS was going to be a high priority for our merchants. After all, your CMS is the lifeblood of your store; it’s how you create content, manage site updates, launch new products, and so much more. 

So we decided to create our own. 

Our CMS is purpose-built for ecommerce managers and teams, allowing you to simplify things like automating aspects of your collections, publishing site-wide updates, and managing your content without tedious one-to-one tasks.

Combined with our powerful Experience Manager, our native CMS is really helping Shogun Frontend customers take back control of their ecommerce sites, without needing to code.

Middleware

Middleware is the software that sits between the frontend and backend of your site bridging the gap between applications. It makes headless commerce possible. Some refer to it as the “glue”. 

We wrote our own middleware so Shogun Frontend integrates seamlessly with platforms like Shopify, BigCommerce, and more. 

For context, below are all the pieces Shogun Frontend is made of (or what our software packages up as a unified platform).

An inside look at the anatomy of Shogun Frontend. 

As an ecomm pro, you need to be agile. You want to focus your efforts on revenue-driving activities and the invisible parts of your business that make you successful. Worrying over whether or not you have the best-in-breed technology powering your store should not be on your to-do list. Or, in our opinion, something you need to assemble yourself.

With a frontend-as-a-service solution that contains all the best-in-breed parts, you can focus on growing your brand confidently knowing you are running on the top-tier software that will scale with you, and you’ll have far fewer complex decisions to make.

You’ll get the flexibility you want with headless, without the massive upfront investment or risk.

Brands that benefit most from a packaged approach

So, even though some businesses will still benefit from composable commerce, what kind of ecommerce stores might be right for a unified headless frontend platform? 

One thing is for sure: Headless isn’t just for big-name brands anymore. Packaging it up like this has made it increasingly accessible.

Take luxury lifestyle goods brand, Nomad, for example. Their team wanted to create ecommerce experiences with rich features like real-time personalization, background videos, and their Product Finder catalog search. They wanted to go headless so they could scale even faster as their ecommerce business grew.

Nomad’s headless ecommerce site built with Shogun Frontend is packed with small details that enhance the customer experience.

Nomad was a great fit for a unified frontend platform because their main focus is bringing their creative ideas to life fast, while maintaining incredible site performance.

They want a site that looks and feels like their brand but don’t necessarily see the frontend software as something they need to build from scratch.

#cta-mini-fe#Want to learn more about how Nomad went headless with Shogun Frontend?See the case study


Another example of a brand that’s fit for a bundled frontend platform is the nutrition marketplace, The Feed. The Feed wanted to build a headless site that’s not only fast, but flexible for developing new store interactions when inspiration strikes.

The Feed’s website is sleek, easy to navigate, and super fast. 

The Feed’s CTO, Ben Kennedy, said it best: 

“Despite the cautionary tales you hear about headless, my experience has been: It’s even easier and faster for us to develop new features now. No more themekit and Liquid code. It’s all React components, lazy-loaded, and fast.” 

Your brand might be a good fit for a packaged frontend solution if:

  • Your store is scaling fast, you want the benefits of headless, and you want to enable your ecommerce team
  • You want to incorporate more personalization into your customer experience
  • You want to experiment with UX and design while maintaining unparalleled site speed and performance
  • You have the ecommerce team that can support a headless build (note: this doesn’t mean you need a specific number of people, more so baseline familiarity with react.js and ecommerce technology)

All ecommerce teams have unique goals, but if you identify with any of the above statements, a provider like Shogun Frontend is worth looking into.

You can still compose your ideal add ons

Choosing a frontend platform doesn’t mean giving up picking the technology powering your store. With a packaged provider like Shogun Frontend, there’s a degree of composability still possible with our growing ecosystem of powerful integrations. 

For example, if you use Klayvio for email marketing or Recharge to manage your subscriptions or recurring payments, these can be connected to your Shogun Frontend store. See the full list of best-in-class integrations.

The bottom line: A packaged solution simplifies your build process while also enabling you a degree of composability as you do discovery on your build and grow your brand.

Craft an exceptional ecommerce experience

If you’re an ecommerce brand that’s rapidly growing, want greater creative and UX freedom with your site while maintaining exceptional site performance, and your team understands how your website plays a role in the growth of your business, a packaged solution might be just the ticket for you.

#cta-visual-fe#<cta-title>See the impact headless commerce can have on your brand.<cta-title>Schedule a demo with our Frontend team today.


Kaitlyn Ambrose

Kaitlyn works on all things content at Shogun. ⚡