Redux Notes
*redux notes
Redux Redux Introduction ・state management ・get rid of all states in components ・put them in a store and pass the state to the component that needs it Why Redux ・Good for managing large state ・Useful for sharing data between components ・Predictable state management using 3 principles - Single source of truth -> one state object that describes the app - State is read-only -> immutability, state object created with Redux will not be modified but you create a new state after each action is taken by the user - Changes using pure function ・Action -> action from the user (button pushed) ・Root Reducer -> pure function that receives the action an creates an output (state or store) ・Store -> entire state of the app ・Dom Changes -> state change re-render ・Flux pattern -> one way data flow (action -> dispatcher -> store -> view) ・MVC -> (action -> controller -> model -> view) Problem without Redux ・when a child of a child needs the state (app -> header -> cart (only cart component needs the state from app)) Redux Actions and Reducers ・Combination of reducers make up the Root Reducer -> pass state as props -> component -> trigger action -> update reducer ・Action object of type and payload ・Reducers are functions that take the current state and action - with the action type, determines it needs to rerender Middleware in Redux ・something that receives the action object before the Root Reducer ・Redux Logger middleware -> logs the actions that get fired and what the states are before and after the action