useEffect hook functional component in reactjs

#react #javascript #webdev #codenewbie

import React, {useState,useEffect} from "react"
import randomcolor from "randomcolor"

function App() {
    const [count, setCount] = useState(0)
    const [color, setColor]=useState(randomcolor())    
    function increment() {
        setCount(prevCount => prevCount + 1)
    }

    function dibs() {
        setCount(prevCount => prevCount *2)
    }


  //Callbacks for useEffect for changing color
  useEffect(()=>{
            setColor(randomcolor())
},[count])

    return (
        <div>
            <h1 style={{color: color}}>{count}</h1>
            <button onClick={increment}>Increment</button>
            <button onClick={dibs}>Doubly</button>
        </div>
    )
}
export default App

*This codeSnippet doing follwing things when we increment then number increment with color changing and for doubling also same🔼
incrementing number by 2 and by using effect callbacks hooks i studied useEffect hooks here hope you guys also get it *

GithubGistLinks