Learn Redux Toolkit with this React Redux example project. This project will help you learn more about app structure and data flow with Redux Toolkit in React.js. This simple example app project will get you started.
(00:00) Intro
(00:15) Welcome
(00:28) Prerequisite knowledge
(00:45) Docs and Faster Pace
(01:13) Starter Code
(02:32) Create the posts slice
(03:45) Add postsReducer to the store
(04:30) PostsList component
(05:58) Create a posts selector
(07:29) Import PostsList into App.js
(08:34) postAdded reducer function
(09:46) Action creator functions are automatically generated
(10:12) Immer.js is active in createSlice
(11:14) AddPostForm component
(13:25) Saving a New Post
(17:08) Move state formatting to a prepare callback
(20:25) Redux Devtools
(22:20) Create a usersSlice
(23:36) Import the usersReducer into the store
(24:02) Modify the prepare callback in postsSlice
(24:30) Modify the AddPostForm component
(28:57) PostAuthor component
(30:28) Import PostAuthor into PostsList
(32:25) Install date-fns dependency
(33:10) Handling date data in postsSlice
(34:55) TimeAgo component
(36:18) Import TimeAgo into PostsList
(37:29) Display most recent post first
(39:02) Adding reaction data to the postsSlice
(41:30) ReactionButtons component
(43:39) Import ReactionButtons into PostsList
🔗 Source Code and Resources for this Redux Toolkit Series: https://github.com/gitdagray/react_redux_toolkit
☕ Buy Me A Coffee: https://www.buymeacoffee.com/davegray
📚 General Redux Toolkit References:
🔗 Official Site for Redux Toolkit: https://redux-toolkit.js.org/
🔗 Redux Devtools: https://github.com/reduxjs/redux-devtools
🔗 Immer.js: https://immerjs.github.io/immer/
Subscribe: https://www.youtube.com/@DaveGrayTeachesCode/featured
