Richer — A Shopify Ajax Cart Library without the Fat
I’ve done a lot of bad things to Shopify, a lot of things you’re not supposed to, a lot of things that most likely terrified the developer that had to inherit the code after me. This is mostly not my fault, because everyone wants custom e-com experiences from a closed box system (well not that closed but you know what I mean).
So this is my effort to give something back that isn’t bloated and disgusting and hopefully makes building things like rich/ajax carts experiences easier without a boat load of dependences and of course no jQuery.
Welcome Richer ~~
This is a really simple Shopify request lib. For those of you that have built Shopify sites in the past you know that Shopify has a sort of api for handling ajax cart functionality. It’s basically a series of calls to Shopify js files that can manipulate your cart. It’s not terribly elegant and absolutely needs a refactoring but until that happens we have to roll our own solutions around it.
The Library is very simple, and if you don’t want to install the package you could just drop the code in you need and use it as you please since it’s ~70 lines of code to handle all the create, retrieve, and updating of a shopify cart instance:
The above just returns the RicherAPI, I was actually experimenting with yo-yo at the time of writing this and wrote some example code that can be found in the repo that you could easily drop into your own shopify sites.
Respect to the people that built and developed Timber, it was my goto for a long time and I actually based most of this code off the ajax-cart.js which is part of that starter repo for Shopify. The only difference is it doesn’t use handlebars or force you into using it’s conventions as strictly and of course the minimal deps (aside from the serializer and the polyfill for fetch ;)).
Currently only have an example using yo-yo, look out for react/preact examples in the near future as I’ll probably be using this with react on my next project :).
The Example yo-yo code assumes you’re using Slate, as it uses the slate currency formatter, if you are not using slate you will need to use the native/whatever currency formatter for handling money within javascript.
