Resolving real-world problems by mixing several advanced React patterns and features
summary
Builds a real radio group, a “radio picker” that shows conditional content, and an actionable dropdown that keeps draft state and only applies on demand, refactoring from children cloning to Context to Hooks and finally a useReducer plus a custom hook that cleans up workflow and fixes ref/functional component issues. Uses React Context, refs, HOCs, state initializers, Hooks and useReducer, and replaces Enzyme with React Testing Library so tests exercise behavior not implementation; final versions work and are covered by tests. cloneChildren pattern useActionableDropdown hook
AI-written summary · about
chapters (5)
- 0:00Start
- 1:50good documentation
- 28:54inline anonymous functions have a negligible impact on application performance
- 36:19Testing time
- 42:55Tests examples
related talks
35mAdvanced patterns in building React Components
35mHandling Large-Scale State Management with Context and Hooks
32mRefactoring React
45mReact refactoring, off the hook(s)!
28mThe State of React State in 2019
27mEric Bishard - State Management with React Hooks
35mBuilding reusable UI libraries with React
40mManaging Complex State in React