Objective was to create an e-commerce store built on a decoupled architecture. The store features dynamically generated items fetched via GraphQL from the Shopify API. In order trigger site rebuilds whenever content is modified on the CMS, the project features a serverless function to listen for specific events coming from the Shopify API and trigger a site rebuild updating any data that needs to be displayed on the front end. The shopping cart retains items across sessions, so customers that leave the site before checking out will have their previously added items still available in their shopping cart when they return to the site. The front-end of this site features data pased and shared between components via React's Context API and is built on the Gatsby.js platfrom, not only maximizing page load speeds and SEO, but allowing for the building and implementation of a custom built theme.
This e-commerce site is deployed on Netlify and boasts a decoupled architecture with serverless functions to provide a fully functioning e-commerce web store for purchasing items. The decoupled architecture allows for granular customization of the user interface, as well as fast page loads to maximize all SEO efforts.
Features of this project include:
- Dynamic content served via Shopify API
- Programatically created pages
- Decoupled architecture
- Serverless functions
- Checkout cart
- Persistent cart items