useEffect 훅에 대해 질문있습니다.

안녕하세요! 개발에서 멀어져서 가물가물하지만 얕은 지식을 꺼내봅니다 ㅎㅎ useEffect는 컴포넌트 생명주기에 관여하는 훅입니다. 그래서 처음에 렌더링될 때 한 번만 실행된다는 것은 반만 맞는 내용입니다. 최초 렌더링시 실행이 되고, 의존성 배열에 지정된 값들에 변화가 생기면 이를 감지하고 훅 내부에 있는 함수들이 다시 실행 됩니다. 여기에 API 함수가 있다면 다시금 데이터를 불러올테고 이 값이 컴포넌트 내부에 반영된다면 컴포넌트는 다시 리렌더링이 됩니다. 의존성 배열이 없는 경우 컴포넌트가 최초 렌더링 되는 시점에 한 번만 실행되지만 의존성 배열이 있는 경우 이러한 방식으로 동작합니다. 그리고 훅 내부에 리턴함수를 지정하면 컴포넌트가 언마운트 될 때(다른 페이지로 이동하여 해당 컴포넌트가 화면에서 사라질 때) 이 함수가 실행됩니다. 정리를해보자면, 1. 컴포넌트가 렌더링 될 때 최초로 실행된다. 2. 의존성 배열에 있는 값에 변화가 생기면 훅이 재실행 된다. 3. 훅이 반환하는 리턴함수가 있는 경우 컴포넌트가 언마운트 될 때 해당 함수가 실행된다. 입니다. 부족한 식견으로 여기까지만 기억이 나네요 ㅎㅎ 마지막으로 제가 react hook 공부할 때 좋았던 강의 영상 하나 추천드립니다! https://youtu.be/xnk_1Q1O5ro?si=szU_KptWwNmQt_Yc

useEffect에 대해서는 설명이 잘 된 듯 하여, 왜 API 관련 코드를 주로 useEffect 안에 작성하는 지에 대해 조금 남깁니다 ㅎㅎ 공식문서에서도 소개하기로 useEffect는 리액트 컴포넌트와 외부 시스템을 동기화하는 훅이라고 소개합니다. 여기서 외부 시스템이란, 리액트 내에서 제어할 수 없는 외부 API, 브라우저 API, 서드파티 라이브러리 등을 말합니다. 리액트 상태에 따라 외부 요소를 제어하거나, 외부에서 데이터를 가져와서 설정하는 데 사용되는 훅이기 때문에 useEffect 내부에서 외부 API를 호출해서 데이터를 가져오도록 하는 것입니다. useEffect의 의존성배열 설정 덕분에 중복된 호출을 방지할 수도 있습니다. 여기서 꼭 useEffect가 필요하지 않은 상황에서 사용되는 경우를 주의하시는 것이 좋은데, 이에 대해 리액트 공식문서를 읽어보시는 것을 추천드립니다 ㅎㅎ (Effect가 필요하지 않을 수도 있습니다.) [https://ko.react.dev/learn/you-might-not-need-an-effect]