eCommerce Website · Clover Integration
A custom, Clover-integrated online store for a local yarn shop.
Knits 'N Purls is an inclusive knitting and crochet shop in Gaithersburg, MD. DevMD designed and hand-built an ecommerce storefront wired directly into the Clover POS the team already runs in-store, so online and in-person sales work off the same inventory. We keep it running on a managed monthly partnership.
LiveOverview
Knits 'N Purls is a local yarn shop that wanted to sell online without giving up the Clover point-of-sale system its team already relied on in-store. The challenge wasn't just building a nice storefront. It was making online and in-person sales run off the same inventory, so the shop never had to manage two disconnected systems.
Rather than force Clover into an off-the-shelf platform, DevMD designed and hand-built a fully custom storefront connected directly to Clover's API. The result is an on-brand online shop where inventory, orders, and customer data stay aligned with the register, backed by an ongoing partnership that keeps the whole system reliable.
Site Walkthrough
A quick pass through the storefront the way a customer moves through it, from the homepage to the shop, a product, checkout, the class schedule, and the newsletter signup.
The Challenge
The off-the-shelf connectors that bridge Clover to platforms like Shopify, Wix, and Squarespace are unreliable. They're prone to inventory discrepancies, sync delays, and double data entry. For a small shop selling the same yarn in person and online, that kind of drift means oversold products, manual corrections, and a frustrating customer experience. Knits 'N Purls needed an online store that stayed in step with the shop floor, without adding operational overhead for the team.
What We Built
A fully custom ecommerce storefront (home, shop, product pages, FAQ, a class schedule, and policy pages) connected directly to the shop's existing Clover system. Because Clover offers no real way to run a storefront it didn't generate, we built a custom backend that reads, maps, and serves the shop's Clover inventory to the site. Clover stays the single source of truth, while Knits 'N Purls gets a clean store that's entirely their own.
Customers can browse the catalog, search by brand or product, add to cart, and check out securely, while orders flow straight into Clover. Every online purchase triggers an order-fulfillment service that emails the shop and prints the order to their in-store Clover device, so web orders land right in the team's existing routine. We added the tools the shop uses day to day: a Constant Contact newsletter signup, Google Maps Places address autocomplete at checkout to cut failed deliveries, free-shipping logic, and a schedule page for lessons and social stitch hours, all built for speed, search, and good product photography.
Issues & Solutions
Building a custom store on top of a point-of-sale system meant working around things Clover wasn't designed to do. Here's what came up, grouped by where it lived in the build.
Clover is built for the register. Its native ecommerce options are limited, and the third-party connectors for Shopify, Wix, and Squarespace are unreliable, causing inventory mismatches, sync lag, and double entry.
We skipped the middleware and built a custom storefront directly against the Clover API. Clover stays the single source of truth for inventory and orders, with nothing fragile in between.
Clover provides no good way to surface inventory on a storefront it didn't generate. Its tooling assumes you're using Clover's own hosted store, not a fully custom site.
We built a custom backend that reads Clover's inventory, maps it into a clean storefront catalog (brands, product groups, and variants), and serves it to the site. The shop manages products in Clover while the storefront stays entirely their own.
Clover's API doesn't expose product images from inventory in a way a custom storefront can use, so we couldn't pull product photos from Clover at all.
We host the product images on Dropbox and serve them through a small image proxy that matches each photo to its product by Clover item ID. The right image always lands on the right item, while Clover stays the source of truth for inventory data.
The same yarn sells in person and online, so stock had to stay aligned in real time. Otherwise the site could sell a skein that just left the shelf at the register.
We tied product availability directly to Clover so the website reflects current stock, cutting down on oversells and the manual corrections that follow.
A second copy of inventory that syncs on a schedule or through webhooks can quietly fall out of step with the register, leaving a storefront that shows the wrong availability.
Instead of maintaining a sync, the storefront reads inventory live from Clover on demand and caches it briefly, so there's no second copy to drift. A built-in rate limiter keeps those reads comfortably within Clover's API limits.
Online payments had to be authorized and processed securely as part of a custom checkout, not a hosted, pre-built one.
We tokenize the customer's card with Clover's SDK and authorize the charge server-side through the Clover Ecommerce API, so no raw card data touches our servers. A failed payment automatically cleans up its order.
The team needed to know the instant an online order came in and fulfill it the same way they handle an in-store sale, not by watching a dashboard.
We built an order-fulfillment step that, on every purchase, emails the shop the order details and triggers a receipt print on their in-store Clover device. It runs in the background, so it never slows the customer's checkout.
Customer emails needed to land in two places: Clover for order and customer records, and Constant Contact for the shop's newsletter, without making customers sign up twice.
We capture the email at checkout, attach it to the Clover order, and sync it to the shop's Constant Contact list. An embedded newsletter signup on the site covers visitors who aren't checking out.
The Constant Contact signup relies on a script that the site framework strips out of its templates, so the branded form wouldn't appear.
We load the Constant Contact widget programmatically after the page mounts, so the signup form renders reliably without breaking the build.
To cut failed deliveries we added Google Maps Places address autocomplete at checkout, but the Maps API key kept getting blocked across our rotating Vercel preview and staging URLs.
We scoped the API key to the right domains and set a fixed staging alias, so address autocomplete works consistently in every environment from preview to production.
A storefront generated dynamically with JavaScript can be invisible to search engines. They can't reliably crawl the shop or its yarn inventory, which leaves the catalog effectively absent from search.
We server-render the shop and product pages as crawlable HTML instead of relying on client-side JavaScript, and add per-product metadata and JSON-LD structured data with live in-stock status. That makes the shop and its yarn discoverable in Google.
Results
Tech Stack
Component-based, server-rendered front end for the custom storefront.
Custom backend that reads, maps, and serves Clover inventory and runs the integrations Clover couldn't.
Stores the Clover OAuth tokens that keep the integration authorized.
Direct REST and Ecommerce integration for inventory, orders, customers, and payments. The single source of truth.
Hosts product images, served through an image proxy and matched to each item by Clover ID.
Emails the shop and prints each order to their in-store Clover device.
Newsletter signups and customer email sync.
Address autocomplete for cleaner shipping and fewer failed deliveries at checkout.
Hosting, preview/staging environments, and on-the-fly image optimization.
Server-rendered pages with per-product metadata and structured data so the catalog is indexable.
Let's Build
If your business runs on Clover and needs a better ecommerce experience, DevMD can scope the right architecture, build a storefront that's truly your own, and keep managing the technical side so your team doesn't have to.