Redux
Getting Started
Use this template to get started.
Learning Objectives
- React-Redux
- Redux Toolkit
- Redux DevTools
Description
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.
Acceptance Criteria
- Create a counter using
redux
Rubric
| Task | Points |
|---|---|
| Show effort | 10 |
Terminology
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