Architecture Of A Composable eCommerce Store Using Elastic Path
At McKenna Consultants, we’ve recently been building a multi-lingual, multi-currency, global eCommerce store for the business-to-business sale of engineering components. The new web store replaces a legacy, bespoke web store that has been built up over a decade, but is a little long in the tooth now! The business requirements for the composable eCommerce store are complex, including highly-configurable complex products, sophisticated search and integration with ERP systems.
We looked at various monolithic solutions, but all of them required making a compromise somewhere. Sometimes a vendor didn’t have a very good CMS capability or a flexible enough search system, for example. All of this pointed us in the direction of composable eCommerce.
What Is Composable eCommerce?
Composable eCommerce is an extension of the concept of microservices, where a set of loosely-coupled services from different vendors can be combined to create highly cohesive eCommerce solutions. For example, we could take cloud-based systems and combine them into a single, fantastic eCommerce web store. These systems might include:
- Elastic Path eCommerce
- Fredhopper Search
- Auth0 for identity management
- Tacton CPQ
- An ERP system for pricing and order placement
- GoSquared Forms
- Google Analytics
- InRiver PIM
What Does Elastic Path Do?
The role of Elastic Path Commerce Cloud in all of this is to provide a cloud-based API and state management system for the core eCommerce functions such as creating baskets, checkout and payment integration to name a few. Elastic Path doesn’t provide the customer-facing user interface; it only provides the microservices required for eCommerce.
The Front End
The Front End for the web store is a simple React front end built using Gatsby. Gatsby is a fantastic React framework that ensures a very high performance web store by executing code at build time to build pages. For example, in a traditional web store, there would be a single product page (e.g. product.aspx) that would retrieve product information at runtime from various APIs and databases and build all the information. This is a flexible but slow approach. In the modern world where SEO is increasingly based on page speed, this approach is no longer good enough.
The Gatsby approach is to generate a page (from the PIM) for every product at build time, so that when the user views the page at runtime, there is little or no database or API access. This makes the web store run significantly faster as well as making it more resilient and more secure.
Back End For The Front End
The front end talks to the BFF and the BFF talks to the other services. This does add a little bit of latency, but it provides the required security level. The Front End and BFF are typically hosted on exactly the same subdomain so that cookies work properly and there are no domain-related issues.
Graceful Fallback During Maintenance or Downtime
Not all of the microservices used by the eCommerce store are as reliable as one may like. ERP systems do not always cope well under load and sometimes have to go down for maintenance. As we have a BFF, we can deal with service quality problems there.
Each operation (such as retrieve price) may have a short timeout period after which the BFF will stop contacting the third-party service and instead return an “unknown” response to the Front End. The Front End can then return a suitably friendly message asking the user to be patient. As all of this activity takes place asynchronously, the web store remains fast and responsive, even though one or more of its microservices may be having quality of service problems.
A highly desirable side-effect of the composable eCommerce approach is that we ended up with no customer database to run the web store. The lack of a database has significantly reduced the support burden of the solution.
- All state is provided by the third-party services
- Elastic Path provides baskets, accounts etc
- The ERP system stores orders
- Users are managed by Auth0
This has been a whistle-stop tour of what a composable eCommerce solution might look like and how it can benefit an organisation, but there is a lot more to building a web store than we have covered here. If you would like more information about software integration or digital development, please contact us or fill in the form below.