React State Management
About
This module introduces the idea of state in React components. State in React can be thought of as the present status of a component. It holds the answers to questions like: “has a user selected something?” or “what is the current input value of a form?”
As code, state is an object that reflects the current attributes or conditions of a component. We’ll learn how React manages component state with the use of helpful hooks like useState(). This module is suitable for beginners who have worked with react components and understand basic JSX syntax.
Content
| Lesson | Video Time | Video | Skills |
|---|---|---|---|
| Setup | 3 min | link | Setting up the development environment. |
| Concepts | 5 min | link | Describe the concept of state in React. |
The useState() Hook |
16 min | link | Use the useState() hook to create stateful components. |
| Event Listener Syntax | 6 min | link | Respond to events with event handler functions. |
| Updating State | 6 min | link | Update state using a setter function. |
| Refactoring state | 7 min | link | Refactor a React component’s state to handle multiple modes, add anonymous functions to events. |
| Updating Complex State | 4 min | link | Update arrays in the state while maintaining immutability. |
| Total content | 47 min |
References
Internal
Prerequisites
- Intro to React
- Building Your First React App
Course landing pages
Resources
Find a 👾 bug 👾 or have suggestions? Let us know!