illustration for Create an eCommerce Store with Next.js and Stripe Checkout

Create an eCommerce Store with Next.js and Stripe Checkout

Instructor

Colby Fayock
1h 4m
Star icon$$$
Star icon$$$
Star icon$$$
Star icon$$$
Star icon$$$
4.5
267
people completed
Bookmark
Download
RSS

Accept payments & sell products powered by Stripe and the best of the JAMStack

There are as many ways to build an e-commerce store on the internet as there are products to sell. One thing is for certain, e-commerce is here to stay and as professional developers we need to understand how to build fully custom stores for our clients using the best modern tools available.

  • React: flexible and customizable while following modern best practices
  • Next.js: lightening fast with guide rails to help your project perform as consumers expect
  • Stripe Checkout: lets you offload reams of complicated business logic to a trusted third party that maintains regulatory compliance, global payments, and a standard UX.

Your store will have well managed local component state using React Hooks and you'll also have clear and cohesive shared (global) state with React Context.

Finally you'll deploy your custom store to Vercel (the platform behind Next.js) as well as how to make your Next.js e-commerce store portable to deploy to other platforms.

Credits

Kamil Khadeyev (illustration)

What you'll learn

  • Starting a project with Create-Next-App
  • Working with static and dynamic routes
  • Managing product data in Stripe
  • Securely managing secret keys
  • Using the useReducer Hook and writing custom React Hooks for Cart functionality
  • Add global state management with React Context
  • Storing and retrieving data from localStorage
  • Deploying with Vercel and GitHub