Building ThemeBridge — A True Staging Environment for BigCommerce

IntuitSolutions
BigCommerce Developer Blog
7 min readDec 11, 2019

We spend a lot of time here at IntuitSolutions thinking about ways that we can extend our BigCommerce expertise to our clients. Many of our ideas are based on client requests, while others are from a desire to scratch our own itch. One of our latest ideas solved not only an internal pain point, but was also one of the most frequently requested features from our BigCommerce store owner clients.

Our Team

IntuitSolutions is a full-service agency that works exclusively on the BigCommerce platform. Before building our relationship with BigCommerce, IntuitSolutions, which was founded in 2001 as a website hosting provider, worked on the late ProStores e-commerce platform. While this platform had some kinks, we learned a lot about e-commerce and the ins and outs of e-commerce platforms.

Nowadays, between custom site builds, SEO and UX optimization, and 3rd party or in-house custom software integrations on BigCommerce, there has been one issue that’s persisted and negatively affected our services as an Elite BigCommerce agency: the ability to accurately test how an updated theme would work with a store’s actual live data.

Introducing ThemeBridge™

Like us, if you find yourself frequently creating sandbox stores or hoping for the best when you deploy an update to a live store, our app — ThemeBridge™ — will save you countless hours in sandbox set up and review with your team. ThemeBridge™ is a true theme staging environment for the BigCommerce platform, meaning that you and any agency partners you work with can use our app to test and preview how the work you’re doing will affect your client’s live website before actually applying the theme. This process can sometimes be called UAT (User Acceptance Testing or End User Testing). Once you’ve developed on a theme locally, you can push that theme to the ThemeBridge for final testing and approval before launch.

Why We Built A Theme Staging Environment

Being a full service Elite BigCommerce Partner we felt a need to provide a higher level of service to our clients. Launching a custom developed theme, migrating a store from Blueprint to Stencil, and making UX improvements for our Recurring services clients all proved to be frustrating during one of the most important phases — launch. We found ourselves sometimes spending hours fixing issues post launch when those could have easily been fixed had we been able to test the new theme with live store data. This was especially frustrating when a client trusted us to increase conversions and grow their business with our SEO and UX optimization services. If you didn’t know, site issues do not help with SEO or UX.

For example, the features that make BigCommerce a superior e-commerce platform, such as the unique IDs for products, product options, option sets, etc. were also causing issues when unique customizations were transferred from sandbox environments to live stores. The small discrepancies between each store’s database can mean a world of difference when developing custom software. For instance, if a store owner requests a product upsell customization which relies upon a pre-specified product ID, that customization will test successfully in local development and on the sandbox store, but can break the moment it gets deployed onto the live store if the product ID is not adjusted accordingly.

Without a Staging Site, You’re Leaving Money on the Table

This environment of building twice, testing twice, and deploying with extreme prejudice costs time and money. Before ThemeBridge™, we’d have to run our testing suite over local development and then sandbox — even then, we couldn’t ensure a conflict-free deployment of our software and theme changes. Thanks to ThemeBridge™, we’re able to test our work on a live staging environment that’s actually wired to the store’s database — eliminating most of the risk involved with pushing a significant update to a live store.

Something had to be done — deploying unreliable code was the number one concern for every developer at IntuitSolutions. So Sean Hayes, the Technology Director at IntuitSolutions, combined his previous experience of domain management with his expert knowledge of back-end programming to create ThemeBridge™ — BigCommerce’s first true staging site.

“Do the difficult things while they are easy and do the great things while they are small. A journey of a thousand miles must begin with a single step.” — Lao Tzu

Similar to how Mark Zuckerberg had built Facebook in only two weeks, it took Hayes a remarkably brief amount of time to construct his ThemeBridge™ proof of concept, initially named “Untitled BigCommerce Staging Site”. That being said, it took months of refinement to get the software ready for public consumption. Even before ThemeBridge could be released to the public, it first had to be approved by the e-commerce platform that it had been designed for — BigCommerce.

The first iteration of the “Untitled BigCommerce Staging Site” took 28 seconds for a page to load. Our final iteration before release reduced that time down to just under 3 seconds. — Sean Hayes, Technology Director at IntuitSolutions

BigCommerce was incredibly enthusiastic and responsive when IntuitSolutions presented this breakthrough software to them. Multiple meetings were arranged — both via phone and in-person — which is significant in that BigCommerce is headquartered in Austin, TX and IntuitSolutions is located in Philadelphia, PA. So one meeting was hosted by IntuitSolutions in Philadelphia, and allowed BigCommerce’s Account Management teams to inform us on how to get into the app store. Another meeting was hosted by BigCommerce in Austin, and allowed IntuitSolutions to train BigCommerce on the intricacies of the app.

BigCommerce even allowed IntuitSolutions time with their sales and engineering teams, helping IntuitSolutions through minor bug fixes and framework updates. This opportunity allowed BigCommerce’s engineers to suggest Theme Scheduling, which allows a store administrator to schedule an automatic deployment of theme bundles to the BigCommerce store. This way a new theme can be deployed to coincide with a scheduled marketing initiative or coupon push — even at 2:00 AM on a Sunday evening.

ThemeBridge Scheduling Example
IntuitSolutions loved BigCommerce’s idea to include theme scheduling into its true staging app, ThemeBridge™.

Even though IntuitSolutions developed ThemeBridge™ helmed by a crackshot programmer with decades of experience and we were supported 100% by BigCommerce itself, testing and refining the software was not without its challenges. Because ThemeBridge™ identically replicates a BigCommerce site, Hayes’ team needed to ensure that his software wouldn’t skew analytics data — neutralizing tracking pixels, header tags, and preventing Google and Bing from crawling the staging site.

App inclusion was also a demanding, yet necessary, feature to account for when replicating an e-commerce site in a staging environment. During local development, apps crucial to the layout and UX of a site lay dormant. Not only can these missing apps leave empty spaces on built out page templates and create overlooked actions during local development, but they also engender largely unexpected behavior once developed updates have been deployed to the live store.

IntuitSolutions’ Friends with Benefits

When I was still in primary school, I had a friend whose dad worked for Pepsi. Every time Pepsi was about to release something new — Clear Pepsi, Pepsi Kona — her dad would bring home some of the trial products and we would get to try them first. This same sentiment of insider privilege applies to all of IntuitSolutions’ Recurring Services and Custom Website Development clients. Before we released ThemeBridge as an app on BigCommerce’s App Store, we had the software running on 30 of our clients’ stores — providing us with a wealth of testing information from our Recurring Services team. Thanks to our testing data, our application is better polished and relatively bug free upon release to the general public because we were able to fix against unexpected user behavior.

Now that IntuitSolutions’ ThemeBridge™ is available not just to our Recurring Services clients, but also the general public, we’ve learned quite a bit about what exactly makes this software so valuable. The ThemeBridge™ saves time. We’ve calculated that the average e-commerce agency could save 400–500 hours of development and testing time by using the ThemeBridge™. Our agency alone has saved close to 200 hours and we aren’t even calculating from the beginning of the year.

“Time is the longest distance between two places.” — Tennesee Williams

For such a groundbreaking app, IntuitSolutions was relatively surprised at how quickly we were able to produce it. From the initial brainstorming to its release on BigCommerce’s App Store, the process took just around one fiscal quarter. What was surprising about the process was how much stronger the bond between BigCommerce and IntuitSolutions became. Yes — building a true theme staging environment for the best e-commerce platform for enterprise level merchants did prove that IntuitSolutions is a BigCommerce house. However, ThemeBridge’s success also revealed the respect and dedication each team has for one another, because a win for IntuitSolutions is also a win for BigCommerce. In the case of ThemeBridge™, we have a win for the entire BigCommerce community.

--

--