Create an eCommerce Store with Next.js and Stripe Checkout
Instructor
Colby Fayock
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
Learner Reviews
- Madson Muller2 years agoWhat did you like about this course?
You have made so easy to understand the all flow from eCommerce. Thanks for that
- Learner2 years agoWhat did you like about this course?
Videos were split up into small chunks, supporting code on Github was very helpful also
- Alexis Diaz2 years agoWhat did you like about this course?
Nice course, straight to the point! Having the code by videos is great also. It feels incomplete though, maybe one or two more videos to wrap up styling and redirect after checkout.
- Héctor Palma Téllez3 years agoWhat did you like about this course?
It was very straightforward and it used important parts of Next and React in a way that made it easily understandable to be applied in other contexts and projects.
- Csongor Széles3 years agoWhat did you like about this course?
Great intro into Stripe and NextJS!
- Sri-Ni.3 years agoWhat did you like about this course?
It was clear and had an engaging app and UX to it.
Course Content
You might also like these resources:
Introduction to Cloudflare Workers
Become familiar with the Workers CLI wrangler that we will use to bootstrap our Worker project. From there you'll understand how a Worker receives and returns requests/Responses. We will also build this serverless function locally for development and deploy it to a custom domain.
Practical Git for Everyday Professional Use
git is a critical component in the modern web developers tool box. This course is a solid introduction and goes beyond the basics with some more advanced git commands you are sure to find useful.
Build an App with the AWS Cloud Development Kit
Tomasz Łakomy will guide you through using TypeScript to complete the lifecycle of an application powered by AWS CDK. You'll see how to start a project, develop it locally, deploy it globally, then tear it all down when you're done. Excellent kick start for your next side project or your developer portfolio.