Search⌘ K
Home
Courses
The Road to React: The One with Hooks

React State

Explore React state management by learning how to use the useState hook to create interactive components. Understand how state updates work and how array destructuring simplifies accessing state and its updater. This lesson prepares you to manage component state effectively in your React apps.

We'll cover the following...

React Props are used to pass information down the component tree; React state is used to make applications interactive. We’ll be able to change the application’s appearance by interacting with it.

First, there is a utility function called useState that we take from React for managing state. The useState function is called a hook. There is more than one React hook – related to state management but also other things in React – and you will learn about them throughout the next sections. For now, let’s focus on React’s useState hook:

Node.js
const App = () => {
  const stories = [ ... ];
  const [searchTerm, setSearchTerm] = React.useState('');
  ...
};
...