Custom Shopify Theme

Loloi rugs needed a new custom Shopify build. Shopify is a very flexible-powerful ecommerce solution. Our UX team had lofty goals to make for a slick User Friendly Experience. Challenge accepted.

My role was largely Javascript Development. Shopify has several APIs, specifically for retrieving information about products, saving products to the cart, and fetching inventory information. Further, we were working with Algolia to power the search results, recommended products and variations of skus. With several interactive modules throughout, and a handful of endpoints, there needed to be consistent communication across the site.

To help with the data flow, I elected to use an ES6 Proxy to guard my Cart module. Because I could tap into the "set" of any cart changes, I could intercept and trigger events via a custom PubSub file. To keep things further decoupled, I developed small public APIs within each module in order to receive updates. To organize all communications between the PubSub and each of the Modules, I decided to use a Mediator Pattern. This allowed for easy updating and data flow throughout the application. When any of the modules requested changes or additions to the cart, I could update several modules across the page with ease. This allowed each module to work as standalone, without knowledge of each other. Now, adding any new modules that need access to the data flow can be spliced in with ease.