Marc Brehmer
Rethinking React State Management: The Power of Built-In Solutions
#1about 4 minutes
What is state management and why is it important
State management is crucial for application functionality and user experience because it ensures data consistency and improves performance.
#2about 3 minutes
Managing local state and the problem of prop drilling
Using the useState hook for local component state can lead to prop drilling, where state is passed down through many layers of components.
#3about 4 minutes
Using an external library like Recoil for global state
External libraries like Recoil offer a global state solution using atoms and selectors to avoid prop drilling and manage shared state.
#4about 2 minutes
Implementing global state with React's Context API
React's built-in Context API provides a way to create a global state without external dependencies, avoiding prop drilling.
#5about 2 minutes
Challenges of Context API and Recoil for state management
Both the Context API and Recoil can introduce performance issues, complexity like 'context hell', and the risk of overusing global state.
#6about 2 minutes
Simplifying state logic with state transformers
State transformers are pure functions that encapsulate state modification logic, making updates more maintainable, testable, and reusable.
#7about 5 minutes
Example: Combining Context, useReducer, and transformers
A practical example shows how to manage user authentication by combining the Context API for global access, useReducer for predictable updates, and state transformers for logic.
#8about 1 minute
Conclusion: Benefits of using React's built-in tools
Using React's native tools for state management reduces dependencies, improves performance with a smaller bundle size, and offers flexibility.
Related jobs
Jobs that call for the skills explored in this talk.
Matching moments
00:17 MIN
The challenge of managing local versus global state
State management in a world of hooks
07:47 MIN
Using the React Context API for shared state
State management in a world of hooks
06:51 MIN
How popular JavaScript libraries implement reactivity
Bringing back reactivity in "reactive" frontend
06:49 MIN
Explaining the core concepts of Redux state management
Hello generics, goodbye boilerplate!
02:31 MIN
Understanding the core concepts of React
React and the power of visualisation
05:01 MIN
Understanding React fundamentals for the examples
How to become an AI toolsmith
01:33 MIN
Why React developers naturally transition to React Native
Challenges of building React and React Native apps
20:27 MIN
Live demo of refactoring local state to a shared store
State management in a world of hooks
Featured Partners
Related Videos
28:10State management in a world of hooks
Adam Klein
20:16Dos and don'ts with react hooks. An opinionated approach
Daniel Espino Garcia
28:43Bringing back reactivity in "reactive" frontend
Michał Moroz
30:40What the heck do "declarative" and "reactive" actually mean?
André Kovac
24:10Challenges of building React and React Native apps
Milica Aleksic & Stefan Nikolic
23:09Building Better Apps with React Native
Marc Rousavy
49:32Keith Cirkle of GitHub on React Fatigue
Keith Cirkle
27:01The Journey of a Pixel in a React Application
Shem Magnezi
From learning to earning
Jobs that call for the skills explored in this talk.
