Course Overview - Start Here!
  • How to Get Help
  • Course Resources
  • Join Our Community!
  • App Overview
  • App User Flow Walkthrough
  • Tech Stack
  • App Mockups
Server Side Architecture
  • Application Architecture
  • Relationship Between Node and Express
  • Generating Express Apps
  • Express Route Handlers
  • Node Version in Engines Property
  • Heroku Deployment Checklist
  • Installing the Heroku CLI
  • Verifying Heroku Deployment
  • Followup Deployments
Authentication with Google OAuth
  • Intro to Google OAuth
  • The OAuth Flow
  • Overview of Passport JS
  • Passport Setup
  • Google+ Deprecation
  • Google Project Setup with new UI
  • Enabling Google OAuth API
  • Securing API Keys
  • Google Strategy Options
  • Testing OAuth
  • Authorized Redirect URI's
  • OAuth Callbacks
  • Access and Refresh Tokens
  • Nodemon Setup
Adding MongoDB
  • Server Structure Refactor
  • The Theory of Authentication
  • Signing In Users with OAuth
  • Introduction to MongoDB
  • MongoDB Atlas Setup and Configuration
  • mLab Setup [PARTIALLY DEPRECATED]
  • Mongoose Connect Update
  • Connecting Mongoose to Mongo
  • Breather and Review
  • Mongoose Model Classes
  • Saving Model Instances
  • TokenError: Bad Request
  • Mongoose Queries
  • Passport Callbacks
  • Encoding Users
  • Deserialize User
  • Enabling Cookies
  • Testing Authentication
  • Logging Out Users
  • [Optional] A Deeper Dive
Dev vs Prod Environments
  • Dev vs Prod Keys
  • MongoDB Atlas Production Setup and Configuration
  • Generating Production Resources
  • Determining Environment
  • Version Control Scheme
  • Heroku Env Variables
  • Fixing Heroku Proxy Issues
Moving to the Client Side
  • npx Create React App Generation
  • React App Generation
  • A Separate Front End Server
  • Running the Client and Server
  • Important Create React App Proxy Update
  • Routing Stumbling Block
  • The Beauty of Create React App's Proxy
  • [Optional] Why This Architecture?
Developing the Client Side
  • Async/Await Syntax
  • Refactoring with Async/Await
  • Important Note About Proxy
  • Front End Tech
  • Client React Setup
  • Installing Root Modules
  • Troubleshooting NPM
  • Redux Review and Setup
  • The Auth Reducer
  • Finishing Reducer Setup
  • Why We Care About Auth
  • React Router Setup
  • Route Configuration
  • Matching Routes with Exact
  • Always Visible Components
  • Materialize CSS
  • Webpack with CSS
  • Header Design
  • Current User API
  • Additional Proxy Rules
  • Basics of Redux Thunk
  • Refactoring the App
  • Testing FetchUser
  • Refactoring to Async/Await
  • AuthReducer Return Values
  • Accessing State in the Header
  • Header Content
  • Redirecting a User on Auth