Learn Redux Toolkit through a hands-on React Redux example project. Explore app structure and data flow while building a simple application. Start with creating a posts slice and adding it to the store. Implement a PostsList component and create a posts selector. Add functionality to save new posts using a prepare callback. Utilize Redux Devtools for debugging. Create a users slice and modify the posts slice to include user data. Implement PostAuthor and TimeAgo components to display post metadata. Add reaction functionality to posts and create a ReactionButtons component. Follow along to gain practical experience with Redux Toolkit in a React.js environment.
Overview
Syllabus
Intro
Welcome
Prerequisite knowledge
Docs and Faster Pace
Starter Code
Create the posts slice
Add postsReducer to the store
PostsList component
Create a posts selector
Import PostsList into App.js
postAdded reducer function
Action creator functions are automatically generated
Immer.js is active in createSlice
AddPostForm component
Saving a New Post
Move state formatting to a prepare callback
Redux Devtools
Create a usersSlice
Import the usersReducer into the store
Modify the prepare callback in postsSlice
Modify the AddPostForm component
PostAuthor component
Import PostAuthor into PostsList
Install date-fns dependency
Handling date data in postsSlice
TimeAgo component
Import TimeAgo into PostsList
Display most recent post first
Adding reaction data to the postsSlice
ReactionButtons component
Import ReactionButtons into PostsList
Taught by
Dave Gray
