Mira Digital Commerce Agency

Six months leading Zogics' migration from Stencil to Catalyst on BigCommerce, the decisions that shaped it, the integrations that tested us, and what we took away from it.

When a project lands on your desk fully scoped, the sale already done, the kickoff scheduled, you have no choice but to hit the ground running. That was the reality when I took on the technical lead role for Zogics' migration from a BigCommerce Stencil storefront to a fully headless Catalyst architecture. Six months, one QA, three developers, and more integration conversations than I can count later, we launched on time. Here's what I learned along the way.

 

The "why" shapes everything

Understanding why a client is going headless is the most important thing a technical lead can do before writing a single line of code. For Zogics, a leading supplier of commercial facility, sanitation, and wellness products, the answer was layered. Their marketing team was hitting real ceilings with the Stencil Page Builder, not just in terms of design flexibility, but in how they could structure rich content for SEO. They were working around the platform's limitations with external tools, and that fragility was slowing them down.

But the deeper driver was scale. Zogics isn't a single brand, it's part of a family of brands, and this migration was never just about one storefront. From the beginning, we were designing for the future: a reusable component library in Makeswift that would reduce implementation time when the next brand migrates. Every architectural decision we made, how we structured components, how we abstracted layouts, how we named things carried the weight of those future projects. That context changed how I led the project. We weren't constructing a storefront. We were laying a foundation.

 

"This was never about one website - we needed a foundation we could launch our whole family of brands on, and Mira built it that way from the first sprint. Headless projects come with real complexity, and when integrations got hard, their team solved problems instead of escalating them. We launched on time, on budget, with homepage performance up 253% on mobile. The next brand migration is already on the calendar."

Jeff Stripp, Chief Revenue Officer, Zogics

 

Integrations: where ambition meets reality

Headless gives you freedom. But freedom comes with surface area. Every feature that Stencil handled out of the box now needs an explicit integration, an API, a decision. Over the course of the project, we worked with Athos Commerce for search and product discovery, Yotpo for reviews and loyalty, BigCommerce B2B Edition for the buyer portal, HubSpot Forms, LiveChat, and more.

Athos Commerce replaced FastSimon as the search engine, and while their team handled the initial catalog sync, we still spent considerable time configuring filters, bundle logic, and custom field types to make the product discovery experience actually work end to end. That back-and-forth is normal and it's something worth budgeting for in any headless project plan.

The case I think about most is Sticky.io. Zogics relies on them for subscriptions, and it became clear early that Sticky.io had no headless-ready API integration. We were faced with a real choice: invest significant time building a custom integration from scratch, or find a pragmatic workaround. We went with the latter, a carefully crafted iframe presenting the Stencil subscription experience inside the Catalyst shell, visually seamless to the customer.

Not every vendor has caught up to the headless era. That's worth asking about early before the design is finalized, before the timeline is locked.

The iframe works. But it also stands as a reminder that third-party readiness is a real discovery question, not an assumption. When you're evaluating a headless migration, it's worth auditing every tool in the existing stack and asking directly: does this have a headless-first integration, or are we on our own?

Performance as a first-class citizen

Zogics takes page performance seriously. Their team watches PageSpeed Insights closely, and that accountability was actually a gift throughout the project; it ensured that performance remained a core consideration throughout the build.

 

Comparison showing Zogics homepage performance improvements after moving from Stencil to headless, with a 253% increase on mobile and an 88% increase on desktop.

 

*The performance impact was immediate. Following the move from Stencil to a headless architecture, Zogics saw homepage performance improve 253% on mobile and 88% on desktop.

One of the more technically interesting challenges was ensuring our implementation was ready for AI-driven crawlers and generative search engines. Catalyst's original rendering approach deferred a lot of content client-side, which meant that a bot's first request might not surface the full content it needed. We updated the architecture to use React Suspense more deliberately, ensuring that the initial server response included all critical SEO schemas and structured data not as an afterthought, but baked into each component from the start.

Every component we built ships with its own rich schema markup. It's not a manual process that someone has to remember to do later. When SEO is designed into a component from the start, it scales automatically, and that's what makes it durable.

Our SEO and Analytics team was involved throughout the build, not just at handoff. That collaboration produced better results on both sides: they understood what we were building architecturally, and we understood what they needed to measure and optimize for.

 

The B2B layer, and one post-launch lesson

Zogics serves both B2B and B2C customers, and a significant portion of the project involved migrating from B2B Ninja Quote to BigCommerce's native B2B Edition, including the Buyer Portal, which we integrated so that it feels native to the Catalyst experience. That meant custom styling, careful layout decisions, and building out account management flows that work for customers who may be placing large, recurring orders.

One issue that surfaced after launch was related to the BigCommerce channel change and its impact on B2B Edition. Some customers were temporarily unable to see their historical orders because companies and entities in B2B Edition remained associated with the previous channel. We worked through the issue after launch, and it reinforced an important part of any migration: there will often be items that only surface once the new environment is live. Discovery and launch planning should account for that post-launch period, not just the work leading up to go-live.

 

What Vercel quietly gave us

One of the underrated wins of this project was the infrastructure. Hosting Catalyst on Vercel isn't just a deployment choice, it's an architectural one. The ability to run cron jobs and serverless functions within the same environment as the storefront eliminated the need for external middleware for tasks like syncing data with Yotpo. What would have required a separate service, a separate deployment, and a separate system to maintain lives directly alongside the storefront code. That simplicity compounds over time, especially as the team grows and the number of integrations increases.

Zogics products displayed beside a laptop showing the ecommerce site, with a visual journey from Discovery to Build, Integrate, and Launch.

The client made us better

We've all had projects that launched late, but this was not one of them. What made Zogics different wasn't just the quality of the work, it was the quality of the collaboration. Zogics came into this project with clear goals, fast feedback loops, and a genuine appetite for continuous improvement. When we needed a decision, we got one. When we raised a concern, they engaged with it rather than deferring it. 

A headless migration carries real complexity. There are more moving parts, more integration decisions, more moments where the right answer isn't obvious. Having a client who is an active participant rather than a passive approver doesn't just make the project more pleasant, it makes the product better. Zogics shipped on time because both sides showed up for it.

The technical foundation is in place. The Makeswift component library is ready to be reused across the next brand migration, and the next. The lessons from this project about integration readiness, performance as a design constraint, and building for scale from the first sprint will carry forward into everything we do next.

Author: Gustavo Kiener - Tech Lead at Mira Commerce - 9/4/2026

We would love to hear from you

Stay connected:
Sign up for our newsletter