Gecko Depot Europe: Advanced Snipcart Integration with Squarespace

In this case study, we interview a developer we're in contact with on a daily basis. Francis Côté works for our mother agency Spektrum, in our headquarters in lovely Quebec City. In 2017, he built a unique Snipcart use case for an e-commerce platform on top of a Squarespace website. The client on this project was Gecko Alliance.

Francis has been in software development for about eight years. His strong suit has always mostly been backend stuff and heavy SQL development. Although he's always dealt with the frontend side fairly well, he's been flirting with it a lot more lately. The projects that drive his passion are those that challenge his creativity and where there's as little compromise on quality as possible.

We're really happy to have the one we affectionately call "NaN" on the blog to talk about this particular Snipcart integration.

The agency

Spektrum is a high-end web development shop from Quebec City, Canada. For nearly 9 years, they've been crafting top-shelf software & sites for big clients. They're also the ones who helped us bootstrap Snipcart in the first place (full story here). Needless to say, we love these guys. <3

The business

For more than 25 years Gecko Alliance has been designing, producing and delivering components to spa & hot tub manufacturers. From control systems, keypads, pumps, and accessories, they do it all! It all started in Quebec City, but they now serve clients all over the world with manufacturing facilities in Quebec City and Tijuana, Mexico, and warehouses in North America, China, and Holland. Gecko Depot is Gecko Alliance’s aftermarket division.

It's for their Gecko Depot European operations that they had to find a quick solution to add e-commerce to their platform to sell parts online to spa and hot tub distributors, retailers, and technicians in Europe.

Let's see what Francis has to say about the specifications of this integration.

Snipcart Integration: Technical interview with Francis

Do you have experience with e-commerce in general? If so, which tools have you been using the most in your workflows? Why?

I have a limited experience in e-commerce. Aside from a few custom solutions that used Stripe directly to process some transactions (I don’t know if that really qualifies as e-commerce), the only other tool I used for pure e-commerce was Snipcart.

I work for Spektrum, which is the mother agency that developed the product, so Snipcart is my go-to choice for a shopping cart. We built it, so everyone knows it well here, and it just works flawlessly.

How would you qualify the e-commerce needs your client had for this project?

It is one rather complex integration of Snipcart. The business sells to certified retailers, so we hit the first bump right there: customer accounts must be approved, and then have a permanent discount level assigned to them. Those are two challenges that Snipcart didn’t address out of the box and had to be tackled to expand its B2B features and capabilities.

Also, a lot of the cart parameterization must be done dynamically on a per-customer basis (currency, pay later on/off, available shipping methods, apply discount automatically).

There’s a plethora of solutions and tools to handle e-commerce projects. Why use Snipcart?

Only Snipcart offers at the same time the flexibility I needed and a low ceremony, crazy fast integration path. As a developer, I see Snipcart as the ultimate e-commerce tool for custom solutions. With a fair amount of work, you can bend it to fit intimately in almost any business workflow.

Did you integrate our e-commerce solution on top of a specific CMS or site builder? If so, how did it go?

The client uses Squarespace extensively and had already built the whole product catalog in a Squarespace website, so to go fast I would have to build upon it. I knew Squarespace mostly because they advertised in absolutely every podcast I was listening to at that time, but I didn’t know what to expect from a developer standpoint.

Also, the client’s marketing team was really on a mission and dedicated to making a success of this adventure. The communication and the collaboration were excellent. It’s fun to work with cool people.

I must admit I was pretty impressed with the tooling they put out there. So I grabbed the @squarespace/toolbelt package and I walked my way to crafting a new product page that replaced the built-in e-commerce logic with a custom Snipcart integration.

Any interesting parts of your integration to highlight?

To make it work, I had to build an entire backend app aside from the front facing e-commerce website, so that the client can approve accounts, manage discounts levels, set currency conversion rates, etc.

That backend app provides an API layer that the product page uses, as well as Snipcart webhooks.

Here are the key highlights of the integration:

• The product page enforces authorization in various ways so that only approved account can log in and buy products.

• Discount levels are synchronized with matching Snipcart discounts, So we can apply permanent discount automatically in every cart.

• The app is notified of new orders so they can be sent to an ERP platform

• As part of its API, the app exposes a product info endpoint that acts as a proxy transforming Squarespace product data by applying custom business rules (multi-currencies, alternate prices, etc). That endpoint is used to dynamically build buy buttons in the front-end. It's also used by Snipcart’s JSON crawler when validating orders.

How was your experience with Snipcart’s v2.0? How long did it take to get it up and running?

It was up and running in a matter of minutes. Even though I had to do a whole lot of customization, Snipcart allowed me to cover the whole business need, end to end, in a record time and with great stability.

Did you rely much on our API & webhooks for this integration? If so, how did it go?

Absolutely.

The API is used to synchronize discounts and validate active sessions. The Shipping webhook allows us to handle custom shipping options and the general webhook endpoint takes care of performing some business logic when new orders are placed.

Were our documentation & our support helpful?

I frequently checked the documentation and it was really helpful. However, for some little things I had to get a direct response from the team as some features were not documented well enough.

Did you get the chance to use advanced Snipcart features (inventory management, abandoned carts, email templates customization, multi-currency, etc.)? If so, how did it go?

I had to customize the invoices by using the email templates feature. Overall, it went pretty smoothly, although I needed some support to make the outputting of order metadata work. I also enabled multi-currency so I could handle it on a per-customer basis.

We'd like to thank Francis to take some precious time to collaborate with us on this case study.

It's always a pleasure for us to see developers finding new ways to customize Snipcart to answer specific client's needs. You can follow NaN on Twitter or GitHub.

A big thank also to Gecko to let us take an insightful look at their online shop. Hoping it can inspire developers to push the boundaries of what can be made with our product. ;)

Liked this post? Take a second to share it on Twitter. All of us (Gecko, Spektrum, & Snipcart) would really appreciate it. We'd also love to hear your thoughts and questions on the integration itself below!