React Basic Hooks - useEffects sample

HTML

<div id="root"></div>
<div id="other-div"></div>

CSS

.buttons {
  display: flex;
  flex-direction: column;
  max-width: 200px;
  gap: 2px;
}

React

const {useState, useEffect} = React;

function Example() {
  const [count, setCount] = useState("2");

  // Similar to componentDidMount and componentDidUpdate:  
  useEffect(() => {   
  	// Update the document title using the browser API    
  	document.getElementById('other-div').innerHTML = `You clicked ${count} times (Side effect)`;  
  });
  return (
    <div className="buttons">
      <button onClick={() => alert("1")}>1</button>
      <button onClick={() => setCount(count + "2")}>2</button>
      {count}
    </div>
  );
}

ReactDOM.render( <Example />, document.getElementById('root') );