Stripe Masterclass With React.js & Node.js

Course Curriculum

Chapter 1: Course Introduction

Lecture 1: Introduction

Lecture 2: What We're Going To Be Building

Lecture 3: Course Resources

Chapter 2: React Ecommerce Site Build

Lecture 1: Setup React App With CRA

Lecture 2: CSS Setup

Lecture 3: Node Sass Issue

Lecture 4: Header 1

Lecture 5: Header 2

Lecture 6: Cart Icon

Lecture 7: Hero

Lecture 8: Main Section 1

Lecture 9: Main Section 2

Lecture 10: Products Context

Lecture 11: Featured Product

Lecture 12: Featured Collection

Lecture 13: Footer

Lecture 14: Layout and Home Page

Lecture 15: Not Found

Lecture 16: Shop Page 1

Lecture 17: Shop Page 2

Lecture 18: Single Product View 1

Lecture 19: Single Product View 2

Lecture 20: Single Product View 3

Chapter 3: Build Cart with React Context and useReducer Hook

Lecture 1: Introduction

Lecture 2: Create Cart Context

Lecture 3: Add Product

Lecture 4: Helper Function

Lecture 5: Add Click Handler To Add Product To Cart

Lecture 6: Test Add Product Feature

Lecture 7: Add Click Handler To Single Product Component

Lecture 8: Increase Item Quantity

Lecture 9: SVG Component For Cart Page

Lecture 10: Cart Page Build 1

Lecture 11: Cart Page Build 2

Lecture 12: Cart Page Build 3

Lecture 13: Cart Page Build 4

Lecture 14: Cart Page Build 5

Lecture 15: Decrease Item Quantity

Lecture 16: Remove Item From Cart

Lecture 17: Clear The Cart

Lecture 18: Persist Cart Data

Chapter 4: Stripe Hosted Checkout

Lecture 1: React Cart Repo

Lecture 2: Stripe Introduction

Lecture 3: Stripe Account Setup

Lecture 4: Stripe Dashboard

Lecture 5: Stripe Payment Flow

Lecture 6: Node Setup

Lecture 7: What Is Stripe Checkout

Lecture 8: Stripe Checkout Process

Lecture 9: Create Stripe Object In The Server

Lecture 10: Create Checkout Session Endpoint

Lecture 11: Create Checkout Session Endpoint 2

Lecture 12: Test Checkout Session Endpoint

Lecture 13: Setup Stripe On Frontend

Lecture 14: Checkout Page

Lecture 15: Fetch Helper Function

Lecture 16: Stripe Checkout Component

Lecture 17: Stripe Checkout Component 2

Lecture 18: Create Success & Canceled Pages

Lecture 19: Webhooks Introduction

Lecture 20: Success Component Fix

Lecture 21: Webhooks

Lecture 22: Webhooks 2

Lecture 23: Webhooks 3

Chapter 5: Stripe Custom Checkout

Lecture 1: Stripe Custom Checkout Process

Lecture 2: Create Payment Intent Endpoint

Lecture 3: Test Payment Intent Endpoint

Lecture 4: Note on Formik import

Lecture 5: Build Shipping Address Component

Lecture 6: Build Shipping Address Component 2

Lecture 7: Build Custom Checkout Component

Lecture 8: Build Custom Checkout Component 2

Lecture 9: Create Handle Checkout Component

Lecture 10: Webhook Update

Chapter 6: Setup Authentication

Lecture 1: Create Firebase Project

Lecture 2: Build Sign Up Component

Lecture 3: Build Sign In Component

Lecture 4: Important – please read before next video – Firebase user profile setup update

Lecture 5: Create User Profile Function

Lecture 6: Create User Context

Lecture 7: Update Sign Up Component

Lecture 8: Update Sign In Component

Lecture 9: Update Header Menu Links

Lecture 10: Update Fetch fromAPI function

Lecture 11: Create Service Account Environment Variable

Lecture 12: Firebase Initialization

Lecture 13: Auth Helper Functions

Chapter 7: Checkout Using Saved Credit Card

Lecture 1: Get Customer From Stripe Function

Lecture 2: Create Setup Intent Endpoint

Lecture 3: Create Get Payment Method Endpoint

Lecture 4: Validate User Fix

Lecture 5: Show Saved Cards 1

Lecture 6: Show Saved Cards 2