Introduction to States in React
The next concept we'll look at is called states. States are reactive component variables.
Reactivity means that when a state changes, changes will occur in all places where that state is used. Technically, this is achieved by re-rendering the entire component when any state changes.
To use states, you first need to import the useState function:
import React, { useState } from 'react';
The useState function takes the initial state value as a parameter, and returns a special array of two elements as its result. The first element of the array will store the current state value, and the second element will contain a function for changing the state.
For states to work correctly, they cannot be changed directly, but a function should be used to change them - only then will reactivity work.