custom hooks and dependency arrays in useEffect

May '24 • Help

I have been practicing creating custom hooks and I encountered this challenge on react.dev. it requires to create a custom hook that displays a number that increments every second.

I have written the useEffect with an empty dependency and without dependency, the component renders the same amount of times.

my question would be, why, when there is an empty dependency array, the count works and the component re-renders?

is it due to the setInterval function?

I am trying to understand how setInterval works inside useEffect, although useEffect runs only once, the setInterval forces the component to re-render. 🤔

https://stackblitz.com/edit/vitejs-vite-7tgd9z?file=src%2FApp.jsx,src%2Fhooks.js

2 comments