notesPart1.txt

https://redux.js.org/tutorials/essentials/part-1-overview-concepts
Redux is a pattern and library for managing and updating global application state, where the UI triggers events called "actions" to describe what happened, and separate update logic called "reducers" updates the state in response.

Redux is more useful when:
- You have large amounts of application state that are needed in many places in the app
- The app state is updated frequently over time
- The logic to update that state may be complex
- The app has a medium or large-sized codebase, and might be worked on by many people

npm install @reduxjs/toolkit react-redux
installed Redux Toolkit and React Redux packages into my project
Redux Toolkit - for writing Redux logic. 
React-Redux - lets your React components interact with a Redux store by reading pieces of state and dispatching actions to update the store.

Redux's update pattern separates "what happened" from "how the state changes"
- ACTIONS are plain objects with a type field, and describe "what happened" in the app. An action object can have other fields with additional information about what happened. By convention, we put that information in a field called payload.
- REDUCERS are functions that calculate a new state value based on previous state + an action
- A Redux STORE runs the root reducer whenever an action is DISPATCHED. The current Redux application state lives in an object called the store which  has method called dispatch. The only way to update the state is to call store.dispatch() and pass in an action object. The store will run its reducer function and save the new state value inside, and we can call getState() to retrieve the updated value.

Redux uses a "one-way data flow" app structure
- State describes the condition of the app at a point in time, and UI renders based on that state
- When something happens in the app:
--- The UI dispatches an action
--- The store runs the reducers, and the state is updated based on what occurred
--- The store notifies the UI that the state has changed
- The UI re-renders based on the new state