Redux Toolkit is an opinionated approach to utilizing Redux(from the Redux team).
Why?
Instead of wasting time on boilerplate, you can get started immediately. The standards followed are the recommended way to write Redux logic for modern JS applications. I found that I am writing less code for core logic & can see this being utilized in any application that needs state management.
Tools:
https://redux.js.org/ (core library, state management)
https://immerjs.github.io/immer/ (allows you to mutate the state)
https://github.com/reduxjs/redux-thunk (handles async actions)
https://github.com/reduxjs/reselect (simplifies reducer functions)
Set-up:
This example will implement the configureStore(), useSelector(), & useDispatch() tools to run a simple CRUD application. We'll be running off create-react-app for this example.
...
| Code Block |
|---|
dispatch(addPost({
id: posts[posts.length - 1].id + 1,
title: 'Testing',
content: 'woo haa'
})) |
CreateAsyncThunk:
Summary
With Redux-toolkit we’re able to rid ourselves from having complex store configurations & unnecessary files following boilerplate. I’m planning to add more to this. Highly recommend reading through the Redux-toolkit docs for full comprehension.
...