Advanced React and Redux
4.7 (3,216 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
21,109 students enrolled
Wishlisted Wishlist

Please confirm that you want to add Advanced React and Redux to your Wishlist.

Add to Wishlist

Advanced React and Redux

Detailed walkthroughs on advanced React and Redux concepts - Authentication, Testing, Middlewares, HOC's, and Deployment
4.7 (3,216 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
21,109 students enrolled
Created by Stephen Grider
Last updated 6/2017
English
English
Current price: $10 Original price: $140 Discount: 93% off
1 day left at this price!
30-Day Money-Back Guarantee
Includes:
  • 12 hours on-demand video
  • 2 Articles
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • Build a scaleable API with authentication using Express, Mongo, and Passport
  • Learn the differences between cookie-based and token-based authentication
  • Figure out what a Higher Order Component and how to use it to write dramatically less code
  • Write Redux middleware from scratch to uncover what is happening behind the scenes with Redux
  • Set up your own testing environment with Mocha and Chai
  • Realize the power of building composable components
View Curriculum
Requirements
  • Solid understanding of React
  • Intermediate understanding of Redux; you should have knowledge of reducers, actions, and action creators
Description

NOTE: Knowledge of React + Redux is 100% required! If you are familiar with reducers and action creators you will be fine.

This is the tutorial you've been looking for to take your React and Redux skills to the next level.

Authentication with Express/Mongo? Yes! Middleware/Higher Order Components? We got it. Testing with Mocha/Chai? It's here!

This course wastes no time diving right into interesting topics, and teaches you the core knowledge you need to deeply understand and build React components and structure applications with Redux.

Mastering React and Redux can get you a position in web development or help you build that personal project you've been dreaming of. It's a skill that will put you more in demand in the modern web development industry, especially with the release of Redux and ReactNative.

There are dozens of great tutorials online for React and Redux, but none of them teach the challenging, core features of these two fantastic libraries. I created this course to push you beyond "just getting started."

  • Learn how to thoroughly test React and Redux code, including tests for action creators and reducers
  • Get familiar with Higher Order Components. Don't know what they are? No problem, you have been using them without even knowing it!
  • Rewrite a popular Redux Middleware from scratch to handle asynchronous actions
  • Become a master of the trickiest topic in Javascript: authentication. You will write a server with enterprise-grade authentication from scratch that can scale to hundreds of thousands of users. No shortcuts, no dummy data.

I have built the course that I would have wanted to take when I was learning React and Redux. A course that explains the concepts and how they're implemented in the best order for you to learn and deeply understand them.


Who is the target audience?
  • Programmers with experience on React and Redux
  • NOT for programmers with no previous React/Redux experience!
Students Who Viewed This Course Also Viewed
Curriculum For This Course
119 Lectures
11:59:02
+
Welcome! Let's Get Started!
2 Lectures 01:52

Get an introduction to this course.  We'll focus on the critical aspects of React and Redux.

Preview 01:46

Github Links - Get Source Code Here!
00:06
+
Testing
21 Lectures 02:25:49

Project setup for our first React and Redux project.

Preview 03:29


Solidify your knowledge

Purpose of Describe, It, and Expect
3 questions

Testing of React applications is critical.  In this section we'll write our first test.

A First Spec
12:42

Test Reporting
04:05

Solidify your knowledge.

Test Structure
2 questions

Feature Mockups
06:09

Test Structure Setup
06:55

Comment Box Tests
08:19

Testing Class Names
07:50

Using beforeEach to Condense Tests
06:22

Expecting Child Elements
05:13

Testing React and Redux apps must include simulating user input, like clicking or typing.

Simulating Events
07:24

With React, controlled components get their value set by state.

Testing Controlled Components
07:23

Simulating change events isn't enough with React testing, we must also simulate form submit events as well.

Form Submit Event
07:13

Stub Comment List
06:00

Expectations on Content
07:43

Assertions with Lists
05:42

React and Redux's action creators can be tested as plain functions.

Testing Action Creators
09:34

Action Creator Shortcuts
04:47

TDD Comments Reducer
12:37

Spec Failures After Code Change
03:36

App Review
03:07
+
Test Environment Setup
9 Lectures 51:58
Purpose of Chai and Mocha
05:19

Test Helper From Scratch
02:43

JSDOM is a browser simulation library for testing React and Redux apps.

JSDom Setup
07:14

More JSDom Setup
05:28

TestUtils Library
07:53

Defining RenderComponent
07:52

Finishing RenderComponent Helper
05:12

Simulate Helper
07:09

Test Helper Review
03:08
+
Higher Order Components
14 Lectures 01:17:37
What is a Higher Order Component?
03:06

Connect and Provider
05:49

Higher Order Components enable fantastic code reuse with React.

Authentication HOC Overview
04:19

Header Setup
06:54

React Router Setup
07:36

Authentication Reducer
07:05

Action Creator Hookup
08:04

Authentication Higher Order Component
04:57

Nearly all React Higher Order Components end up looking identical.

HOC Scaffold Code
09:09

Nesting Higher Order Components
04:48

Accessing React Router on Context
05:30

Class Level Properties
02:12

Handling HOC Edge Cases
05:03

Higher Order Components Review
03:05
+
Middleware
12 Lectures 01:05:42
Middleware Overview
03:26

App Building Plan
03:50

Users Reducer
04:14

Static Users Action Creator
02:15

Rendering a List of Users
07:32

CSS Cleanup
04:20

Pains Without Middleware
07:15

Middleware Stack
04:43

Middleware Internals
07:55

Handling Unrelated Actions
05:17

Handling Promises
08:05

Middleware Review
06:50
+
Server Setup - Authentication
27 Lectures 02:36:15

Cookies vs Tokens
04:57

Scalable Architecture
04:49

Server Setup
03:45

More Server Setup
05:41

Express Middleware
06:29

Express Route Handler
06:09

Mongoose Models
10:22

MongoDB Setup
06:29

Inspecting the Database
06:19

Authentication Controller
04:57

Searching for Users
07:57

Creating User Records
06:31

Encrypting Passwords with Bcrypt
08:12

Salting a Password
06:16

JWT Overview
04:58

Creating a JWT
07:13

Installing Passport
05:50

Passport Strategies
08:55

Using Strategies with Passport
04:02

Making an Authenticated Request
05:55

Signing in with Local Strategy
05:37

Purpose of Local Strategy
04:17

Bcrypt Full Circle
05:08

Protecting Signin Route
04:12

Signing Users In
04:04

Server Review
02:39
+
Client Side Authentication
33 Lectures 03:39:30
Client Setup
02:28

App Architecture
05:48

Component and State Design
07:30

Header Component
04:17

Scaffolding the Signin Form
11:03

Adding Signin Form
05:58

Action Creator with Many Responsibilities
08:22

Introducing Redux Thunk
07:10

Signin Action Creator
10:38

CORS In a Nutshell
09:13

Serverside Solution for CORS
06:16

Programmatic Navigation
07:11

Updating Auth State
06:29

Breather and Review
05:39

LocalStorage and JWT
06:39

Auth Error Messaging
04:36

Displaying Errors
04:40

Header Logic
10:29

Signout Component
05:32

Signout Action Creator
04:45

Signup Component
04:12

Signup Form Scaffolding
08:02

Redux Form Validation
04:30

Implementing Validation Logic
09:28

More On Validation
05:40

Signup Action Creator
07:11

Finish Up Signup
08:55

Securing Individual Routes
10:21

Root IndexRoute
02:34

Automatically Authenticating Users
07:11

Making Authenticated API Requests
08:01

Handling Data from Authenticated Requests
05:13

Authentication Wrapup
03:29
+
Bonus!
1 Lecture 00:26
RallyCoding
00:26
About the Instructor
Stephen Grider
4.7 Average rating
33,982 Reviews
80,544 Students
11 Courses
Engineering Architect

Stephen Grider has been building complex Javascript front ends for top corporations in the San Francisco Bay Area. With an innate ability to simplify complex topics, Stephen has been mentoring engineers beginning their careers in software development for years, and has now expanded that experience onto Udemy, authoring the highest rated React course. He teaches on Udemy to share the knowledge he has gained with other software engineers. Invest in yourself by learning from Stephen's published courses.