Frontend with React
🗂️ useReducer and Context
Manage complex state with useReducer, share data between components with the Context API, and learn to lift state up to the common ancestor.
What you'll learn
- Centralize complex state logic in a reducer
(state, action) => nextStateand send actions withdispatch - Share data between distant components with
createContext,Provider, anduseContext, avoiding prop drilling - Lift state up to the common ancestor and pass data and callbacks through props to share it between children
- Distinguish when
useReduceris preferable overuseState
Lessons
useReducer: state with clear transitionsCentralize update logic in a reducer. Context API: avoiding prop drillingShare data without passing it through every level. Lifting state upState in the common ancestor; data and callbacks through props.Practice this module in the app
DevPath is a hands-on course: you read the theory here; in the app you put it into practice with exercises that really run, offline.
Start free in the app →