\newline Logo
Left arrow icon.
Go to Preview Lesson
Go to Preview Lesson
LESSON 1.1Part Two Welcome
Course Thumbnail of TinyHouse: A Fullstack React Masterclass with TypeScript and GraphQL - Part Two.TinyHouse: A Fullstack React Masterclass with TypeScript and GraphQL - Part Two
  • MODULE 1
    Introduction
    • LESSON 1.1Part Two Welcome
    • LESSON 1.2The TinyHouse App
    • LESSON 1.3Walkthrough of TinyHouse Code
    • LESSON 1.4Code Patterns & Behavior
    • LESSON 1.5How To Go Through The Course
  • MODULE 2
    Set-up for Part 2
    • LESSON 2.1Set-up For Part II
  • MODULE 3
    Routing in TinyHouse
    • LESSON 3.1Module 2 Introduction
    • LESSON 3.2Server-side vs Client-Side Routing in a Web Application
    • LESSON 3.3Build Web App Navigation With React Router and BrowserRouter
  • MODULE 4
    Setting up our Database
    • LESSON 4.1Module 3 Introduction
    • LESSON 4.2How to Build MongoDB Database Collections in React
    • LESSON 4.3Build a MongoDB Document Schema: Examples and Best Practices
    • LESSON 4.4How to Build a Seed Function to Add Data to MongoDB
  • MODULE 5
    User Authentication with Google Sign-In & OAuth 2.0
    • LESSON 5.1Module 4 Introduction
    • LESSON 5.2How Does OAuth 2.0 Work? [with diagrams and examples]
    • LESSON 5.3How to Get Google Access Credentials for OAuth Authentication
    • LESSON 5.4The GraphQL Document Fields Needed for Google Sign-In
    • LESSON 5.5Using Google Auth and People API With React and GraphQL
    • LESSON 5.6Build GraphQL Authentication Resolvers for Google Auth
    • LESSON 5.7How to Build a Custom Google Sign-In UI in React
    • LESSON 5.8How to Query Google Sign-In Authentication URL From a Client
    • LESSON 5.9How to Build a React Header With a React Log Out Mutation
    • LESSON 5.10Module 4 Summary
  • MODULE 6
    Persist Login Sessions with Cookies
    • LESSON 6.1Module 5 Introduction
    • LESSON 6.2How to Store Persistent Google Sign-In Sessions With Cookies
    • LESSON 6.3sessionStorage vs localStorage vs Cookies for Secure Storage
    • LESSON 6.4Using NPM cookie-parser to Read Cookies in React
    • LESSON 6.5How to Use a Viewer Cookie to Automatically Log In a User
    • LESSON 6.6Prevent Cross-Site Request Forgery Attacks With X-CSRF Token
    • LESSON 6.7Module 5 Summary
  • MODULE 7
    Building the User Page
    • LESSON 7.1Module 6 Introduction
    • LESSON 7.2Building a GraphQL Query to Fetch User Account Data Fields
    • LESSON 7.3How to Modify GraphQL Type Definitions to Support TypeScript
    • LESSON 7.4How to Build Paginating GraphQL Resolvers [with examples]
    • LESSON 7.5How to Build a UserProfile Component With React and GraphQL
    • LESSON 7.6Build User Profile Pages With GraphQL, Ant Design, & Apollo
    • LESSON 7.7Module 6 Summary
  • MODULE 8
    Building the Listing Page
    • LESSON 8.1Module 7 Introduction
    • LESSON 8.2Requesting a Single Set of GraphQL Fields
    • LESSON 8.3Building a GraphQL Resolver For Specific Fields
    • LESSON 8.4How to Query for GraphQL Data With Limits and Filters
    • LESSON 8.5Build a Grid Column Layout with Ant Design in React
    • LESSON 8.6Build a Booking Form With React and GraphQL
    • LESSON 8.7Module 7 Summary
  • MODULE 9
    Building the Home Page
    • LESSON 9.1Module 8 Introduction
    • LESSON 9.2Listings GraphQL Fields
    • LESSON 9.3Building a GraphQL Resolver For Filtered and Sorted Results
    • LESSON 9.4Building a Card-Based Homepage Layout in React
    • LESSON 9.5Sort GraphQL Data And Display Filtered Results in React
    • LESSON 9.6Module 8 Summary
  • MODULE 10
    Searching for listings with Google's Geocoding API
    • LESSON 10.1Module 9 Introduction
    • LESSON 10.2Get Started With Google Geocoding API for Location Data
    • LESSON 10.3How to Implement Location Search With GraphQL and Google
    • LESSON 10.4Using the Google Maps Node.js Client With GraphQL
    • LESSON 10.5Building a Location-Based Listings Search Page in React
    • LESSON 10.6Building Filters and Pagination in React [with examples]
    • LESSON 10.7Building a React Search Bar in the App Header
    • LESSON 10.8How to Index Location Search Results With MongoDB Indexes
    • LESSON 10.9Module 9 Summary
  • MODULE 11
    Connecting with Stripe
    • LESSON 11.1Module 10 Introduction
    • LESSON 11.2Building a Payment Platform With Stripe and Stripe Connect
    • LESSON 11.3How to Get Stripe Connect OAuth Credentials for Payments
    • LESSON 11.4Building a GraphQL Schema for Stripe Connect Integration
    • LESSON 11.5Integrating the Stripe NPM Library With React and GraphQL