useState - Godfather of the hooks useState is probably the most used and common hook. It is the simplest way to have a state in a functional component. SYNTAX const [value, setValue] = useState(initialValue) useState returns an array first item is the value of the state second item is a method to set the state const [value, setValue] = useState(initialValue) WHAT HAPPENS WHEN YOU SET IT? When you use the "setValue" function to set the value of the state variables, the component gets re-rendered. You should set values in event handlers or within other hooks like useEffect, because the change triggers a rerendering. Re-rendering should be only done when the rendering of the component is finished. function SomeDumpComponent() { const [text, setText] = useState('') setText('A new text'); // here the rendering of the component is not finished. // The code below for rendering is not executed. // This can cause side-effects. return(<h1>{ t...