Gatsby E-Commerce

Demo Store

🧐

This is a rewrite of Sarah Drasner's Ecommerce Store with Netlify Functions and Stripe from 2019. Sarah's store was built with Nuxt. This version is written in Gatsby. Check out Sarah's blog post on building the site.

In January 2021, I updated this project's dependencies and also made a few small changes & bug fixes.

🤓

Gatsby is commonly used as a static site generator. However, in this project the /product route is generated dynamically using the Gatsby createPage API. To stop the client side router serving the 404 page on /product requests, there is a server redirect and a rather obscure conditional check.

If I was to rewrite this project today I would architect it quite differently and take advantage of Gatsby's new File System Router API.

🏗

Clone repository

Create an .env file in the root directory. This file needs to contain your Stripe secret key:

STRIPE_SECRET_KEY=XXXXX

• npm install
• npm start to develop
• npm run build to build
• npm run serve to serve built site

To test the Netlify function, run the project with the Netlify CLI instead.