React Redux Example Project with Redux Toolkit

This project-based course teaches Redux Toolkit’s app structure and data flow by building a React bulletin board application. Learners create posts and users slices, manage dates and reactions, and inspect state with Redux DevTools; prior React knowledge is expected.

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