useRef
는 화면을 바꾸지 않는 데이터 저장 장치로, state와 달리 값을 변경해도 리렌더링을 유발하지 않음. 💾useRef
를 통해 DOM에 접근하는 방식은 권장되지만, 직접적인 DOM 조작은 리액트의 상태 관리와 충돌할 수 있어 지양해야 함. 🚫ref
객체의current
속성을 통해 DOM 노드에 접근하고 조작할 수 있으며, 포커스 이동이나 스크롤 위치 변경 등에 활용 가능. 🎯useRef
는 HTML 요소뿐만 아니라, 화면 갱신 없이 로깅 등의 목적으로 사용되는 일반적인 데이터 저장에도 활용 가능. ⚙️- 실행 순서가 헷갈릴 때는
console.log
를 활용하여 코드 실행 순서를 파악하는 것이 중요함. 🔍