Learn advanced Redux techniques in this comprehensive tutorial video. Transition a blog project from Axios async thunks to RTK Query, implementing normalized state and optimistic updates using React and Redux Toolkit. Explore creating an API slice, configuring endpoints for CRUD operations, updating components, and implementing optimistic updates for reactions. Gain hands-on experience with JSON Server, Redux DevTools, and best practices for managing complex state in React applications. Follow along with step-by-step instructions to enhance your Redux skills and build more efficient, scalable React applications.
Redux Advanced Tutorial - React, Redux Toolkit, RTK Query Project
Overview
Syllabus
Intro
Welcome
Prerequisite knowledge
Starter Source Code
JSON Server
Create an api slice
Update postSlice to an extended api slice
getPosts endpoint method
Update the postsSlice selectors
Reconfigure the store
Update index.js
PostsList component
PostAuthor component
getPostsByUserId endpoint method
addNewPost endpoint method
updatePost endpoint method
deletePost endpoint method
Export the auto-generated hooks
AddPostForm component
EditPostForm component
UserPage component
Header component
Optimistic Updates for Reactions
ReactionButtons component
View Redux state cache and network requests with dev tools
Taught by
Dave Gray
Related Courses
-
Adopting RTK Query into an Existing Redux Application
-
Modern Redux with Redux Toolkit (RTK) and TypeScript
-
Learn React 18 with Redux Toolkit – Full Tutorial for Beginners
-
React Query Tutorial for Beginners vs Redux, Axios with CRUD Example
-
MERN Stack Project With React Redux and RTK Query
-
React Redux Toolkit Query Tutorial and RTK Query CRUD Example App
