API Authentication How to decode the Firebase JSON web token with Express This lesson is available for PRO members or as a single course purchase. Sign-in and choose a plan below. *Enrollment provides full access to this course (and updates) for life. Or Signup for Unlimited PRO Access 📼 Login to Watch 👈 Firebase Setup Create a Customer 👉 SignIn and SignOut in React App.js import firebase from 'firebase/app'; import { auth, db } from './firebase'; export function SignIn() { const signIn = async () => { const credential = await auth.signInWithPopup( new firebase.auth.GoogleAuthProvider() ); const { uid, email } = credential.user; db.collection('users').doc(uid).set({ email }, { merge: true }); }; return ( <button onClick={signIn}> Sign In with Google </button> ); } export function SignOut(props) { return props.user && ( <button onClick={() => auth.signOut()}> Sign Out User {props.user.uid} </button> ); } Authenticated Fetch Helper file_type_js_official helpers.js import { auth } from './firebase'; const API = 'http://localhost:3333'; /** * A helper function to fetch data from your API. * It sets the Firebase auth token on the request. */ export async function fetchFromAPI(endpointURL, opts) { const { method, body } = { method: 'POST', body: null, ...opts }; const user = auth.currentUser; const token = user && (await user.getIdToken()); const res = await fetch(`${API}/${endpointURL}`, { method, ...(body && { body: JSON.stringify(body) }), headers: { 'Content-Type': 'application/json', Authorization: `Bearer ${token}`, }, }); return res.json(); } Express Middleware file_type_typescript index.ts // Decodes the Firebase JSON Web Token app.use(decodeJWT); /** * Decodes the JSON Web Token sent via the frontend app * Makes the currentUser (firebase) data available on the body. */ async function decodeJWT(req: Request, res: Response, next: NextFunction) { if (req.headers?.authorization?.startsWith('Bearer ')) { const idToken = req.headers.authorization.split('Bearer ')[1]; try { const decodedToken = await auth.verifyIdToken(idToken); req['currentUser'] = decodedToken; } catch (err) { console.log(err); } } next(); } /** * Throws an error if the currentUser does not exist on the request */ function validateUser(req: Request) { const user = req['currentUser']; if (!user) { throw new Error( 'You must be logged in to make this request. i.e Authroization: Bearer <token>' ); } return user; } Chapters Get Started 📜 1 Resources Source code and resources free 2:23 2 How does Stripe Work? Understand how payment flows work in Stripe as a developer free 4:34 3 API Keys How to safely work with Stripe API keys free 1:42 4 Intro to HTTP and REST How RESTful APIs work and tools that will increase your productivity free 3:04 5 Node Setup Configure Node.js for hot reloading with TypeScript free 4:50 6 Express Build your first API endpoint with Express 3:46 7 React Setup Configure a React project for Stripe Payments 2:47 Stripe Checkout 🛒 8 Stripe Checkout What is Stripe Checkout and should you use it? 1:49 🛒 9 Stripe Checkout on the Server Create a checkout session on the server 3:39 10 Checkout with React Complete a checkout session and redirect to a success or fail page 6:21 3D Secure Payments 💸 11 Payment Intents API Change and save credit card details with Payment Intents API 1:50 💸 12 Create a Payment Intent How to create a Payment Intent on the Server 1:39 🎣 13 Stripe Webhooks How to work with Stripe webhook events in development 4:45 14 React React integration of Payment Intents API & Stripe Elements 4:26 Customer Management & Saved Cards 🧑🏿🤝🧑🏻 15 Customers and Saved Cards Manage Customers and Save Cards 1:42 file_type_firebase 16 Firebase Setup Add the Firebase SDKs to your server and frontend app 3:07 17 API Authentication How to decode the Firebase JSON web token with Express 3:35 🧑🏿🤝🧑🏻 18 Create a Customer Create a Stripe customer record and attach it to a Firebase user. 2:05 🧑🏿🤝🧑🏻 19 Save and List Card Save a card for future payments & list all available cards 2:08 20 React SignIn with Firebase, then save a credit card to the customer account. 3:46 Subscriptions & Billing 🔄 21 Billing Use Stripe billing to manage customers and their payment history 2:01 🔄 22 Create a Subscription Add a customer to a paid subscription plan 3:12 🔄 23 Cancel a Subscription Cancel a subscription 2:21 🔄 24 Recurring Payments Webhooks to handle recurring subscription payments and cancelations 3:02 25 Billing with React Integrate stripe subscription billing in React 5:58 Deployment file_type_docker 26 Docker Dockererize your Node.js API and deploy it to Cloud Run 4:22 file_type_firebase 27 Firebase Cloud Functions Refactor the API for Firebase Cloud Functions 3:25