지금부터가 반전

🔮 1. React-DOM React는 UI를 구축하기 위한 자바스크립트 라이브러리로, React의 핵심은 바로 컴포넌트이다. UI를 구축하기 위해서 바로 이 컴포넌트를 이용하기 때문이다. 컴포넌트를 통해 사용자 인터페이스를 구성하고, 업데이트 역시 컴포넌트를 통해서 한다. React는 컴포넌트와 상태 객체를 관리하고 업데이트가 일어나면 변경 전후의 상태를 확인한다. 그리고 React는 화면에 표시되어야할 모든 정보를 React-DOM 에게 전달하고, React-DOM이 DOM을 업데이트(렌더링 및 리렌더링) 한다. //index.js import ReactDOM from 'react-dom/client'; import './index.css'; import App from './App'; const r..

리액트의 내장 hook 중에 하나인 useEffect는 useState만큼이나 중요하고 또 자주 쓰이는데, useEffect의 실행 시점에 대해서 모호하게 알고있어 정확하게 짚고 넘어가야겠다 생각했다. useEffect에 전달된 콜백은 컴포넌트가 mount, update, unmount될 때 실행될 수 있는데, 각각의 경우 컴포넌트 내에서 어떤 순서로 실행되는지 확인해보기로 했다. 1️⃣ mount 될 때 useEffect 실행 시점 useEffect는 컴포넌트가 mount, update, unmount '될 때' 실행된다. 그런데 이 말이 조금 모호하다. 컴포넌트가 렌더링 되면서 함께 실행된다는 것일까, 렌더링 된 후에 실행된다는 것일까?🤔 결론부터 말하자면 useEffect의 실행은 컴포넌트의 렌더링..