So, the people who brought us React introduced Redux to shore up that weakness. It is laser-focused on taking your extremely complex data needs and simplifying them so that React (or Angular or Vue or anything else) can focus on presenting that data. It will make your UI components extremely simple and easy to change when new requirements come up in the business!

The downside of Redux is that the learning curve is very steep. That’s where this course comes in. We will take a JavaScript developer and teach them every aspect of Redux to the point where they can add it to any project and simplify its data needs.

Objectives

Upon completion of this course, the student should be able to:

Simplify complex state management with the Redux library

Use best practices for reducers, dispatchers, and action creators

Explain and leverage reducer composition

Understand when, how, and why to use Redux middleware

Handle asynchronous operations with Redux -- including Ajax

Integrate a Redux store into a React application

Audience

Experienced web developers who want to be equipped to handle large-scale web applications.

Prerequisites

A very strong grasp of advanced JavaScript.  Please ask about our 5-day JavaScript course which will prepare you for the high-level of JavaScript fluency needed for this course. Knowledge of React would be helpful also but is not necessary.

Duration

Three days

 

Outline for Redux Training

Chapter 1. Course Overview

Chapter 2. Redux intro

a.It's a library

b.The single responsibility principle

c.Why Redux?

d.Why Redux with React?

e.Its history and growth

f.The 4 concepts of Redux

g.State

h.Pure functions

i.Composition

j.Immutability

k.The parts of Redux

l.The big picture of Redux

Chapter 3. Creating the store

a.Installing and including Redux

b.The createStore() method

c.The simplest possible store

d.Redux ducks

Chapter 4. State and Subscriptions

a.Single source of truth

b.Initializing state

c.What goes in state?

d.Why subscriptions?

e.How to subscribe in Redux

Chapter 5. Actions and Reducers 101

a.Actions are objects

b.The shape of actions

c.Type and payload

d.Reducers are functions

e.Why we have them

f.The shape of a reducer

g.Tips in avoiding the worst Redux rookie mistakes

Chapter 6. Actions

a.Action Creators in a React Application

b.Dispatching Actions

c.Mapping Actions to prop Names

Chapter 7. Advanced Actions

a.Action constants

b.Action type enumerations

c.Action creators

d.Action creator enumerations

Chapter 8. Reducer composition

a.The problem: complex state => complex reducers

b.The solution: Create state slices

c.Creating reducers to handle slices

d.Combining reducers with Redux's built-in combineReducers

e.Doing it manually

f.Why manually is the right way

Chapter 9. Redux Middleware

a.The Open-Closed Principle

b.Introduction to middleware

c.The next() function

d.The required shape of middleware

e.Middleware's super-powers

f.Recipes and examples

g.Why you must register middleware and how to do it

Chapter 10. Ajax with Redux

a.The problem with async calls in Redux

b.The trick to making a good middleware function

c.Registering the middleware

d.Dispatching an Ajax call

e.Making RESTful API calls

f.How to process them into Redux and then into React

Chapter 11. Redux-thunk (Time permitting)

a.The need for a thunk

b.How redux-thunk fits that need

c.Installing and using redux-thunk properly

d.Dispatching Ajax calls with redux-thunk