AMAZON REACT.JS Challenge | Day 4 (Stripe Checkout & Webhooks | Firestore | Next.js)

AMAZON REACT.JS Challenge | Day 4 (Stripe Checkout & Webhooks | Firestore | Next.js)

Join me on Day 4 of 5 of the 5-DAY AMAZON CHALLENGE where we build the following: πŸ‘‰ Payment Processing with Stripe Checkout πŸ‘‰ Creating our first webhook with the Stripe CLI πŸ‘‰ Build the Orders & Confirmation page with Firebase's real-time Firestore database

❗SIGN UP for the FINAL DAY Webinar (Day 5 - FREE Prize)πŸ‘‡ https://www.crowdcast.io/e/secret-challenge

❗Submit your Day 4 Homework Here πŸ‘‡ https://www.papareact.com/secret-challenge-day-4-homework

Join me on Day 4 of 5 of the 5-DAY AMAZON CHALLENGE where we build the following:

πŸ‘‰ Payment Processing with Stripe Checkout πŸ‘‰ Creating our first webhook with the Stripe CLI πŸ‘‰ Build the Orders & Confirmation page with Firebase's real-time Firestore database

πŸ”΄ Make sure to follow all the steps below for the FREE Amazon Challenge RIGHT NOW so you don't miss out on the Challenge and the potential grand prizes (Β£10,000+) you can win on the 23rd of May where we will reveal the WINNERS!

1️⃣ : REGISTER for the LAST DAY SURPRISE REVEAL. This is where we will reveal the winners and a surprise reveal that you do not want to miss: https://www.crowdcast.io/e/secret-challenge

2️⃣ : JOIN the Facebook Group to keep up to date with the Amazon Challenge and to submit assessments everyday by clicking this link: https://www.facebook.com/groups/1388021798201385/

3️⃣ : JOIN our Official PAPA Server on Discord by clicking the invite link below to stay up to date with the Amazon Challenge: https://links.papareact.com/discord

4️⃣ : SHARE the Amazon Challenge on your Instagram story, Twitter and Facebook feed to refer other people to the challenge with the hashtag (# PAPASecretChallenge) ! (MAKE sure you are following Sonny on Instagram! πŸ‘‡) https://links.papareact.com/instagram

Check out Hostinger (Use code SONNY for 7% OFF Annual Plans!) πŸ‘‰ https://www.hostinger.com/sonny

🚨 JOIN THE PAPAFAM: Join the world’s BEST developer community β€œZero to Full Stack Hero” NOW: https://www.papareact.com/course

Zero to Full Stack Hero covers simplified to advanced concepts in most of the programming languages. Useful if you want to start learning programming or want to perfect your skills in a certain language. The course features an exclusive Slack community and a Github Repo which contains source code of all the builds made on YouTube and a Resume Starter Pack. It also features weekly coaching calls to interact and code alongside me.

πŸ”΄ LOOKING FOR THE CODE? πŸ› οΈ https://links.papareact.com/github

πŸ“© WANT TO LISTEN TO THE EXCLUSIVE PAPAFAM PLAYLIST? Sign up to the PAPA Newsletter here πŸ‘‰ https://links.papareact.com/newsletter

πŸ‘‡FOLLOW ME HERE: Instagram: https://links.papareact.com/instagram Facebook: https://links.papareact.com/facebook LinkedIn: https://links.papareact.com/linkedin Twitter: https://links.papareact.com/twitter Discord: https://links.papareact.com/discord

πŸ’° WANT TO SUPPORT THE CHANNEL? Donate here: https://links.papareact.com/donate Grab some PAPA Merch: https://links.papareact.com/merch

πŸ•€ TIMESTAMPS:

  • 00:00 Introduction
  • 00:35 Day 4 Presentation (1/2)
  • 06:03 Day 4 Homework Submissions
  • 10:39 Day 4 Presentation (2/2)
  • 13:10 Day 4 Build Demo
  • 15:50 Starting the Build
  • 16:19 Implementing Stripe Checkout
  • 29:52 Modifying the Checkout Page
  • 31:58 Creating the Checkout Session
  • 1:04:21 Stripe Checkout Demo
  • 1:08:10 Checkout Process Explanation
  • 1:10:48 Explaining Webhook
  • 1:12:37 Integrating Stripe CLI
  • 1:21:27 Creating the Webhook!
  • 1:56:36 Building the Success Page
  • 2:03:25 Building the Orders Page (1/2)
  • 2:12:51 Setting up Firebase Database
  • 2:13:54 Building the Orders Page (2/2)
  • 2:24:08 Building the Order Component
  • 2:36:25 Bug Fixes
  • 2:38:55 Final Build Demo
  • 2:42:12 Deploying to Vercel
  • 2:57:31 Hosting on Hostinger
  • 3:02:33 Deployed Final Build Demo
  • 3:06:01 Final Build Breakdown
  • 3:10:15 Outro

firestore next react database

What is Geek Coin

What is GeekCash, Geek Token

Best Visual Studio Code Themes of 2021

Bootstrap 5 Tutorial - Bootstrap 5 Crash Course for Beginners

Nest.JS Tutorial for Beginners

Hello Vue 3: A First Look at Vue 3 and the Composition API

How native is React Native? | React Native vs Native App Development

Article covers: How native is react native?, React Native vs (Ionic, Cordova), Similarities and difference between React Native and Native App Development.

React Native Firebase Firestore | Cloud Firestore Database

We take a look at the react native firebase cloud firestore database system and integrating firestore into our react native app.

Best Databases for React Native Development.

In this tutorial, we'll learn Best Databases for React Native Development. What's so special about it? Why is it used by so many professionals? Read this article to the end and you will understand.

Top Databases for React Native App Development

This list of the best SQL, NoSQL, and document-based databases will help you choose the perfect database for your next React Native app. React Native is the best available framework for building a cross-platform mobile app for iOS and Android. The demand for React Native development is increasing, and many organizations and developers rely on the framework and its ecosystem to ship mobile apps.

NETFLIX REACT.JS Challenge | Day 4 (STRIPE Checkout/Payments & Firestore Database)

Join me on Day 4 of the Netflix Challenge where I build STRIPE Checkout/Payments & Integrate the Firestore Database!