CF

Redux

7h 13m 23s
English
Paid

There's no better strategy for learning a new technology than building your own version of it. In this course, we'll take that to the extreme. First, you'll start off by building your own Redux. Then, once you understand the ins and outs of Redux, you'll look at how to hook that up to a vanilla JavaScript UI. Then, you'll see how React and Redux work together by swapping out your UI with React.

After that, we'll address the issues between our React and Redux implementation which will lead us to building our own version of the react-redux bindings.  After all of this, you'll take your knowledge of the Redux ecosystem and build a real world application.

Pre-Requisites:

You'll be tempted to jump straight into Redux when you first start using React. Don't do this. If you're already familiar with React and modern JavaScript (ES2015+), this course is perfect for you. If not, this may not be the right starting point for you. Check out our 'React' and 'Modern JavaScript' courses which will be a better fit.

What you'll learn:

Redux

  • createStore
  • getState
  • subscribe
  • dispatch
  • Reducers
  • Actions
  • Combining Reducers
  • Middleware
  • Thunk Middleware
  • Logger Middleware
  • Utilizing Constants
  • Action Creators
  • Architectural Patterns
  • Redux with JS UI
  • Redux with vanilla React
  • Normalizing data structures
  • Handling Asynchronous Events
  • Optimistic Updates
  • Error Handling
  • Immutability
  • Hot Module Replacement
  • Time Travel Debugging

Advanced React

  • Performance
  • Higher Order Components
  • React Router v4
  • Render Props
  • Context.Provider
  • Context.Consumer
  • Folder Structure

Who is this course for?

  • Developers who are comfortable with React and are curious about what benefits Redux will give them.
  • Developers who have been trying to learn Redux but are frustrated with the current ecosystem of learning resources.
  • Front end developers wanting to modernize their skill set in order to get a raise or apply for another job.
  • Mid to Sr level developers who are confident in their ability to learn quickly and want the quickest approach to learning Redux for production.
  • Jr developers who are comfortable with JavaScript and React and want to better contribute to their Redux apps at work.
  • Developers who want to understand how Redux works under the hood.
  • Developers who want to learn how the react-redux bindings work under the hood.
  • Developers who have tried and failed to learn Redux before.

About the Author: UI.dev (Tyler McGinnis)

UI.dev (Tyler McGinnis) thumbnail

UI.dev (formerly tylermcginnis.com) is the online course platform of Tyler McGinnis, a US developer who has been publishing React and JavaScript educational material continuously since 2014. The platform was one of the earliest dedicated React-tutorial sources and remains widely cited for the depth of its long-form courses on JavaScript fundamentals and the React ecosystem.

Course material covers React (including modern hooks-based patterns and Next.js), modern JavaScript (the canonical Modern JavaScript course), Firebase, GraphQL, Redux, TypeScript with React, and the algorithm / data-structure interview prep track. The teaching style is unusually rigorous about the language fundamentals underneath the framework material — Tyler's Modern JavaScript course in particular is a classic of the genre.

The CourseFlix listing under this source carries over 15 UI.dev / Tyler McGinnis courses spanning that range. Material is paid; UI.dev runs on per-course or membership pricing on the original platform.

Watch Online 32 lessons

This is a demo lesson (10:00 remaining)

You can watch up to 10 minutes for free. Subscribe to unlock all 32 lessons in this course and access 10,000+ hours of premium content across all courses.

View Pricing
0:00
/
#1: Redux Course Introduction
All Course Lessons (32)
#Lesson TitleDurationAccess
1
Redux Course Introduction Demo
05:13
2
The React-Redux Ecosystem
09:19
3
Firebase Schema
13:48
4
Redux Schema
17:51
5
Redux Actions
11:20
6
Part 1- Transforming State with Reducers
14:51
7
Part 2- Transforming State with Reducers
24:34
8
Up and Running with React and Redux
07:05
9
Adding React Router to your Redux Project
04:32
10
Improving your Developer Experience with Redux
26:23
11
Home Route
19:12
12
Authentication Mocks
09:14
13
Connecting our first React Component to Redux
29:34
14
Redux Thunks
05:33
15
Route Protection with React Router
18:31
16
Auth with Firebase
24:58
17
Developer Tooling with Redux
03:18
18
combineReducers in Redux.
22:20
19
Saving data to Firebase in Redux
22:20
20
Redux Listeners Module
01:40
21
Firebase Listener
13:57
22
Architecting a Redux React App
16:59
23
Managing Normalized Data in Redux and Firebase
08:42
24
Duck UI
08:05
25
Fetching Initial Date with Redux and Firebase in React
03:10
26
Profile UI
25:20
27
Duck Details UI
18:33
28
Creating Replies in Redux
11:14
29
Lists in Redux
13:48
30
URL State in Redux.
04:32
31
Video 1- Refactoring to Immutable.js
09:58
32
Video 2- Refactoring to Immutable.js
07:29
Unlock unlimited learning

Get instant access to all 31 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.

Learn more about subscription

Course content

32 lessons · 7h 13m 23s
Show all 32 lessons
  1. 1 Redux Course Introduction 05:13
  2. 2 The React-Redux Ecosystem 09:19
  3. 3 Firebase Schema 13:48
  4. 4 Redux Schema 17:51
  5. 5 Redux Actions 11:20
  6. 6 Part 1- Transforming State with Reducers 14:51
  7. 7 Part 2- Transforming State with Reducers 24:34
  8. 8 Up and Running with React and Redux 07:05
  9. 9 Adding React Router to your Redux Project 04:32
  10. 10 Improving your Developer Experience with Redux 26:23
  11. 11 Home Route 19:12
  12. 12 Authentication Mocks 09:14
  13. 13 Connecting our first React Component to Redux 29:34
  14. 14 Redux Thunks 05:33
  15. 15 Route Protection with React Router 18:31
  16. 16 Auth with Firebase 24:58
  17. 17 Developer Tooling with Redux 03:18
  18. 18 combineReducers in Redux. 22:20
  19. 19 Saving data to Firebase in Redux 22:20
  20. 20 Redux Listeners Module 01:40
  21. 21 Firebase Listener 13:57
  22. 22 Architecting a Redux React App 16:59
  23. 23 Managing Normalized Data in Redux and Firebase 08:42
  24. 24 Duck UI 08:05
  25. 25 Fetching Initial Date with Redux and Firebase in React 03:10
  26. 26 Profile UI 25:20
  27. 27 Duck Details UI 18:33
  28. 28 Creating Replies in Redux 11:14
  29. 29 Lists in Redux 13:48
  30. 30 URL State in Redux. 04:32
  31. 31 Video 1- Refactoring to Immutable.js 09:58
  32. 32 Video 2- Refactoring to Immutable.js 07:29

Related courses

Frequently asked questions

What is Redux about?
There's no better strategy for learning a new technology than building your own version of it. In this course, we'll take that to the extreme. First, you'll start off by building your own Redux. Then, once you understand the ins and outs…
Who teaches Redux?
Redux is taught by UI.dev (Tyler McGinnis). You can find more courses by this instructor on the corresponding source page.
How long is Redux?
Redux contains 32 lessons with a total runtime of 7 hours 13 minutes. All lessons are available to watch online at your own pace.
Is Redux free to watch?
Redux is part of CourseFlix's premium catalog. A CourseFlix subscription unlocks the full video player; the course description, table of contents, and preview information are available to everyone.
Where can I watch Redux online?
Redux is available to watch online on CourseFlix at https://courseflix.net/course/redux. The page hosts every lesson with the integrated video player; no download is required.