후니의 개발 기록

이번 스프린트 작업 중에 useRef를 사용하면서 ref를 통해 언제 DOM 요소에 접근하는지에 대해 명확한 이해가 되지 않았었습니다. 먼저 React의 동작을 크게 두 단계로 나누어 설명해보겠습니다. 렌더링 단계 (Rendering Phase) 렌더링 단계에서 계산된 변경사항들을 실제 DOM에 적용하는 단계입니다. 이 단계에서는 Virtual DOM을 구성하고, 컴포넌트의 업데이트 여부를 판단합니다. 커밋 단계 (Commit Phase) 렌더링 단계에서 계산된 변경사항들을 실제 DOM에 적용하는 단계입니다. 💡 만약 렌더링 단계에 dom에 접근한다면 ? 첫 렌더링 시 DOM 생성 전: 실제 dom이 아직 생성되지 않았기에 ref.current의 값은 null이 됩니다. 업데이트 중 DOM 변경 전: 렌..