title: Too many re-renders. React limits the number of renders to prevent an infinite loop. UI and conole error
body: <p>import { useState, useEffect } from 'react'
  import './App.css';</p>
  <p>function App() {</p>
  <p>const [count, setCount] = useState(0)</p>
  <p>useEffect(() =&gt; {</p>
  <pre><code>console.log('render')
  </code></pre>
  <p>}, [count])</p>
  <p><strong>First:</strong> show me on UI but send me error on conosle: Too many re-renders. React limits the number of renders to prevent an infinite loop.</p>
  <blockquote>
  <p>const plusCount = () =&gt; {</p>
  <pre><code>setCount(count + 1)   }  
  </code></pre>
  <p>const minsCount = () =&gt; {</p>
  <pre><code>setCount(count - 1)   }
  </code></pre>
  </blockquote>
  <p><strong>Second</strong>  : do not sho em on UI send me error on UI: Too many re-renders. React limits the number of renders to prevent an infinite loop.</p>
  <p>const makeCount = {</p>
  <pre><code>add:setCount(count + 1),
  
  discount:  setCount(count - 1)
  </code></pre>
  <p>}</p>
  <p>return (
  </p>
  <pre><code>  &lt;h1&gt;Exercise&lt;/h1&gt;
    &lt;p&gt;Cunt: &lt;b&gt;{count}&lt;/b&gt;&lt;/p&gt;
    &lt;button onClick={plusCount}&gt;Add&lt;/button&gt;
    &lt;button onClick={minsCount}&gt;Discount&lt;/button&gt;
  
  &lt;/div&gt;
  </code></pre>
  <p>)
  }</p>
  <p>export default App;</p>
  <p><strong>Guestion:</strong>
  Why is this message show me error on both time, but on first let me show on UI
  on the second do not show me on UI</p>