A simple guide to Composable Architecture

Is your agency the gatekeeper to too much of your website's codebase? Does maintaining your website infrastructure slow progress? Or, are you locked into a less-than-ideal content management or commerce system? Composable Architecture might not suit everyone, but it could be worth considering if any of the above challenges resonate with you. Here's my (hopefully) easy-to-follow guide.

Understanding the problem

Before we get started, let's talk about why we need composable architecture.

Technology evolves fast, and it's tough for big companies to keep pace, especially when they're juggling huge servers, databases, and software all in one place. This traditional setup can lead to various issues, like:

  • Having all your code tied together means even tiny changes require testing, quality checks, and redeployment for the whole system.
  • Small bugs can mess up everything, and finding and fixing them becomes super tricky.
  • With just one team managing everything, they have a ton of control, but onboarding new folks can be tough.

As developers looked to tackle these problems and embrace more cloud-based services, there's been a big change in how we do web development. We call this change "composable architecture.

What is composable architecture?

Composable architecture is all about making your tech setup flexible and modular. Instead of overhauling everything, you can swap out specific parts as needed. We can break this down into the MACH stack:

  1. Microservices are individual components of business functionality which are independently maintained.
  2. APIs expose data between each piece of your business functionality.
  3. Cloud-based tools take the strain away from your in-house teams by leveraging off-site SaaS platforms.
  4. Headless front-ends decouple all back-end logic and programming languages from the website or web app, resulting in it being framework-agnostic.

The benefits of going Composable

  1. Untethered from any single framework or system: In composable architecture, think of each part like a puzzle piece. As long as they can talk to each other through APIs, you don't need to stress about compatibility. They don't have to fit into the same codebase, which makes things a lot simpler.
  2. Cherry-pick off-the-shelf functionality with custom: With composable architecture, you get to pick and choose from a bunch of cloud-based microservices to cover most of your website's functionality. Then, you can create your own special features for anything unique you need.
  3. Build your dream website, regardless of Commerce or Content Management System: No matter how much you rely on ready-made solutions in your composable architecture, using APIs to gather content lets you craft a website front end that's totally tailored to your needs.

Who Should Choose Composable Architecture?

Composable architecture is a great fit for businesses with complex needs that can't be met by a single off-the-shelf solution. While it requires more time and resources upfront, it offers long-term cost savings. On the other hand, for small startups with simpler needs and tight budgets, starting with an all-in-one solution might be the way to go.

Case Study in Composable Commerce

Meet Advatek: The world's leading manufacturer of trusted LED control hardware. Headquartered in the vibrant city of Melbourne, Australia, their reputation for producing dependable and durable products has made them the go-to choice for professional lighting production companies worldwide. While their main focus is on serving businesses, Advatek also has a dedicated following among hobbyists and homeowners looking to bring their creative projects to life.

Challenges

In 2022, Advatek, reached out to us facing three significant challenges:

  1. Their current ecommerce site, built with Magento™, lacked the flexibility needed for their growing commerce needs. This setup also made it difficult to showcase engaging marketing content for their top-tier B2B products.
  2. Their self-hosted website tied them down to their previous web development agency, causing growth obstacles. Delays in delivery from the agency further compounded the issue.
  3. Serving both B2B and B2C customers required different systems, which Magento couldn't handle on its own.

Requirements

We suggested a composable-based solution since all three challenges stemmed from their heavy reliance on a single system—Magento. Here's how we broke down their needs into specific components that could be managed by different systems in a composable setup:

  1. A Stunning, Custom Website tailored to showcase their flagship B2B products while also facilitating the sale of their B2C items.
  2. Content Management System to handle static content like blog articles, detailed product pages, and landing pages.
  3. Commerce Platform a secure system for managing customers, orders, pricing, taxes, payments, and other transactional tasks.
  4. Order Fulfillment and Inventory Management streamlining warehouse operations with a dedicated solution.
  5. Customer Relationship Management managing B2B quote requests and handling incoming inquiries effectively.

Solution

Here's how we helped Advatek say goodbye to Magento and their old agency, working closely with them to pick out the perfect microservices and frameworks for their needs:

  1. NuxtJS™, an open-source JavaScript framework, for a custom, high-performance website.
  2. Sanity™ , a cloud-based content management system, makes it easy for their marketing team to publish engaging content.
  3. BigCommerce™, a robust cloud commerce solution to manage customers, orders, taxes, and secure transactional checkouts.
  4. NetSuite™ handles their product stock and order fulfillment processes.
  5. Hubspot™ manages their B2B customers, quotes, and contact form submissions efficiently.

The website we built for Advatek is (if I do say so myself) beautiful, and efficiently connects all of their chosen microservices seamlessly. In just a few months, our solution surpassed their old one in every imaginable way. Read more about our work with Advatek.

Advatek Homepage and A4-S product page dark mode
Todd has demonstrated both technical competence as well as a true understanding of, and commitment to, our requirements and objectives.

David Christensen – Marketing Director at Advatek™