Use this template to get started.
- React-Redux
- Redux Toolkit
- Redux DevTools
Redux is a popular global state management library that is used in mid-sized to large applications.
We'll be looking into redux
, the redux store
and redux-toolkit
. the modern way to build applications with react-redux.
- Create a counter using
redux
Task | Points |
---|---|
Show effort | 10 |
Action
: A regular javascript object that has a required type
property and an optional payload
//the type of action will always be a string the payload can be anything
const action1 = {type: String, payload: {name: 'Vonta', age: 30}};
const action2 = {type: String, payload: [1, 2, 3]};
const action3 = {type: String, payload: 9};
const action4 = {type: String, payload: true};
const action5 = {type: String, payload: 'Nice Day out!'};
Reducer : A reducer is a function that receives the current state and an action object, decides how to update the state if necessary, and returns the new state: (state, action) => newState
Store : The current Redux application state lives in an object called the store
Dispatch : he only way to update the state is to call dispatch()
and pass in an action object
Selector : Selectors are functions that know how to extract specific pieces of information from a store state value. As an application grows bigger, this can help avoid repeating logic as different parts of the app need to read the same data