Redux

  • 88 Lessons
  • 440 Minutes
  • Updated 2 months ago

This course is guaranteed to be up to date.

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 Fundamentals course and our Modern JavaScript course which will be a better fit.
Sign Up

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 skillset 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.
Sign Up

Course Outline

  • Introduction

    Welcome to the Redux course
    Redux Course Introduction
    FAQ
  • The Store

    What is the Store?
    Quiz: The Store
    Create Store: Getting the State
    Create Store: Listening to Changes
    Quiz: Listening to Changes
    Create Store: Updating the State
    Actions
    Quiz: Actions
    Pure Functions
    Quiz: Pure Functions
    The Reducer Function
    Quiz: The Reducer Function
    Create Store: Dispatching Changes
    Quiz: Dispatch and Modifying State
    Handling more Actions
    Combining Reducers
    Reducer Composition
    Quiz: Reducer Composition and Combine Reducers
    Leveraging Constants
    Action Creators
    Review: The Store, Actions, and Reducers
    Quiz: Review - The Store
  • Adding UI to our Library

    App Scaffolding
    Basic UI
    Dispatching New Items
    Subscribing for UI Updates
    Dispatching to Remove Items
    This is Redux
    Review: Adding UI to our Library
  • Redux Middleware

    Customizing Dispatch
    Utilizing Redux Middleware
    Redux Middleware
    Quiz: Middleware
    Logger Middleware
  • Redux and React

    Adding React
    Dispatching Todos with React
    Dispatching Goals with React
    Lists with React and Redux
    Toggling UI with Redux
  • Asynchronous Redux

    Handling Initial Data
    Loading States with Redux
    Optimistically Deleting Items
    Optimistically Toggling Todos
    Persisting Items
    Custom Thunk
    Benefits of Thunks
    Quiz: Thunks
    Thunkify Goals
    Thunkify Todos
    Thunkify Initial Data
    Redux Thunk Middleware
    More Asynchronous Options
  • Leveraging react-redux

    Downsides of React and Redux
    React's Context API
    Utilizing Context
    Quiz: Provider
    Connecting Components to the Redux Store
    Quiz: Connecting Components
    Implementing connect
    Using react-redux
    Quiz: react-redux
    Redux Folder Structure: Create React App
    Redux Folder Structure: Actions
    Redux Folder Structure: Reducers
    Redux Folder Structure: Middleware
    Redux Folder Structure: Components
    Redux Folder Structure: The Store
    Other Folder Structure Patterns
  • Real World Redux

    Introduction to Polls
    Starter Code
    First Actions
    First Reducers
    Adding Middleware
    Getting App Data
    Building the Dashboard
    Loading Reducer
    Leaderboard UI
    Add Poll UI
    Add Poll to Store
    Poll state
    Poll UI
    Add Answer to Store
    React Router
    Bonus: Redux Devtools
    Outro
    Next Steps

What devs are saying

Tyler's course not only teaches you how to use React and Redux but he takes the time to walk you through the internals of these tools, building them from scratch yourself. This alone is worth the price of his courses. You gain a complete understanding of what is happening "behind the scenes" of your React apps. I couldn't recommend this course more. It's a necessity when learning React and Redux.

This is by far the best structured online course I've taken. I take many courses on many different websites, 99% of them paid, and they are mostly good. This one is different, as it gave me a pro-level understanding of Redux. Redux is typically a difficult subject to grasp, and I have to confess that before Mr. McGinnis' course I've never really understood Redux. I have done two other courses on Redux before, I knew how to operate it but it was always uncomfortable. Mr. McGinnis' course brought me a level of comfort with Redux that is worth a lot more than $20. Mr. McGinnis - thank you so much for this experience. I can only imagine the huge amount of time needed to build this course, I'm really grateful and humbled that someone as experienced as you took the time. You're a hero, sir.

After taking a few courses from Tyler, I went ahead with the Redux course without any second thought, and man it was totally worth my time. Right now I feel like a react-redux ninja :) As you go through the course, you realize how much effort and passion Tyler has put into creating it for us. Thanks a ton Tyler.

Subscribing to tylermcginnis.com took me from fuddling around in the endless amounts of resources, trying to find my footing, to breaking off and confidently building my first few React applications with Redux. Stop reading and start doing with Tyler, you won't regret it.

Methodical, clear and focused. Tyler goes the extra mile to provide you with a deep understanding of exactly what you’re working with. I never once felt like I was required to ‘parrot’ information to remember it The lessons aren’t contrived - I was working on real world situations from the get go and learning opportunities emerged naturally - clearly explaining the issue and how it’s solved. If I’m learning anything React, Tyler’s course is the first place I go. I couldn’t recommend it highly enough.

Hands down the best learning resource on React + Modern Js + Redux online. Tyler's teaching style is simply the best. He makes sure you understand fundamentals concepts behind each and every tool/lib used which helps in longer run rather than just simply teaching how to use the tool/lib which is quite excellent.

A strongly, gifted teacher able to translate complicated concepts and enable people, like myself, to absorb them quite easily. 15/10 rating!

The ability of Tyler's to explain things clearly, simply and thoroughly is really unmatched. The idea to build a redux clone from scratch to make students understand what's going on under the hood is pure genius.

Sign Up

The Socials

The Newsletter