useEffect란?

useEffect는 페이지가 렌더링되자마자 무조건 한번씩 실행된다.

또한 페이지내에서 state값이 변경되면 한번 더 실행된다.

그렇기때문에 잘못사용하게되면 무한루프에 걸리게되거나

사용자가 많은 경우 너무 자주 사용되어 서버에 무리가 갈수있다.

자세한 사용법은 api를 활용한 아래 코드 사진을 통해 설명하겠다.

useEffect 사용없이 setState만을 사용하여 api 사진을 불러오는 경우
restAPI에 계속 요청이 갈테고 그때마다 state가 바뀌기 때문에 좋은 방법이 아니다.
이럴때 useEffect를 사용하게 되면 useQuery처럼 사용할 수 있게된다.
useEffect 내에서 강아지 이미지를 불러오는 함수가 한번 실행되고 setState를 통해 한번 랜더링하면 끝나게되는 것이다.