We've been rowing at the cutting edge of ecommerce technology for a while. Headless ecommerce is a rapidly growing area in our world that can offer some awesome performance benefits.
Our friends over at BigCommerce have a great summary of headless ecommerce, "Headless commerce architecture is the decoupling of the front-end presentation layer of a website from the back-end ecommerce functionality. Developers can utilize their front-end technology of choice to deliver high-quality content experiences, and plug in an ecommerce solution on the backend that manages all commerce functionality." Here are a few examples we've worked on recently.
- Replatform Nordic Ware because of Magento 1’s end of life.
- Improve the user interface and flow for content management.
- Modernize and be prepared for future possibilities for marketing content.
- BigCommerce API
By using the BigCommerce 4 Wordpress plugin we achieved a product, order, and customer migration from Magento 1 into BigCommerce. The Wordpress theme was developed to mimic the prior site, with enhancements made for IA and accessibility. All the possibilities within Wordpress are now available for Nordic Ware to enrich their content with easy and automatic display of relational content. Bakers everywhere rejoice. This project opened the doors to evaluating the content manager’s experience as part of future projects.
This site is behind a login, but you'll have to take our word that it IS headless. Either that or become an NCG partner to see what it's really like.
- Replace the Excel spreadsheet NCG was using before to create a better experience for all the stakeholders.
- Build an interface for category managers to interact with vendors in order to broker and create contracts (ad space).
- Use headless technologies when it’s optimal for advanced performance and lower development costs.
Speed! By hybridizing the site to use traditional templates and VueJS components, they’re optimizing performance that comes in handy working with large sets of complex data. This demonstrates that “headless” doesn’t need to be an entire site (aka the head), it can be done in various areas of a site. Maybe we should call this an ‘armless’ deployment. You decide.
Irish Titan dot com (That’s us!)
We're in development on our new site with a headless build and we couldn't be more excited! Here's what the next Irish Titan site will look like.
- Brand refresh as an opportunity to be awesome and use our fancy headless skills to get content out to our amazing friends faster than ever (that’s you!)
The Results (Hopefully)
- New, more efficient build and deployment processes.
A lightning fast site, addressing many of Google’s recent Core Web Vitals metrics.
Content management that doesn’t require code changes. Great for our marketing team that thinks aligning a div tag makes them a developer.
- Decoupling content and display. Take our events for example. Enter all event details once into our CMS, and let the headless app grab the info it needs for specific areas of display. Never duplicate content or have to make two updates to the site.
- Gatsby renders static HTML pages ensuring the quickest possible way for browsers to load content.