Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

egghead.io

Build A React App With Redux

via egghead.io

Overview

Managing state in modern web applications is hard. As applications grows in complexity, keeping track of state changes and mapping those changes back to your UI becomes increasingly difficult.
One way data flow makes managing state more approachable and lightens the cognitive load required to follow the flow of data through your application. Using Redux takes this idea to the next level and moves the state and the state changes and centralizes them in a global store, managed with pure reducer functions.
In this course you will learn how to build a production quality React application using Redux. We will build up from using redux by itself, so we can understand the core API and how that interacts with a React application, then we’ll move on to introduce react-redux to abstract away some of the underlying details and clean up our code. We’ll use middleware and a mocked API server to understand how asynchronous code fits into the Redux model and we’ll even deploy our finished work so we can see it running live in the cloud.
If you are brand new to React, you’ll want to read the documentation and watch our free React Fundamentals course and our Build Your First Production Quality React App course. To get up to speed on Redux, you should check out Dan Abramov’s Getting Started With Redux course.

Syllabus

  • Bootstrap a React Application with Yarn & Create React App
  • Render a React UI with JSX
  • Render in React Based on a Global State Object
  • Refactor JSX in React to Stateless Functional Components
  • Create a Redux-Style Reducer Function
  • Create a Redux Store
  • Render React UI Based on State Changes with Subscribe in Redux
  • Keep UI and State Synchronized Using Controlled Components in React with Redux
  • Make Dispatching Redux Actions More Reliable With Action Creators
  • Create Redux Dispatch Functions From Action Creators with bindActionCreators
  • Connect Redux to a React Application with react-redux
  • Handle Actions in Redux with mapDispatchToProps
  • Use mapDispatchToProps Shorthand Syntax in Redux
  • Connect Redux to Individual React Components For More Efficient Rendering
  • Setup a Mock API Server with the json-server npm module
  • Dispatch Asynchronous Actions with Redux Thunk Middleware
  • Save New Records on The Server with Redux Thunk and Fetch
  • Configure and Use Redux Dev Tools
  • Create a React Component to Display Status Messages
  • Use Multiple Reducers in Redux with combineReducers
  • Respond to a Single Redux Action in Multiple Reducers
  • Update Existing Records on The Server with Redux Thunk and Fetch
  • Delete Existing Records on The Server with Redux Thunk and Fetch
  • Add React Router to a Redux Application
  • Filter State Data in Redux with a Selector Function and React Router
  • Configure a React & Redux Application For Production Deployment and Deploy to Now

Taught by

Andy Van Slaars

Reviews

4.7 rating at egghead.io based on 201 ratings

Start your review of Build A React App With Redux

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.