이다닷

📌useRef란? 리액트를 사용하는 프로젝트에서도 가끔 직접 DOM을 선택해야하는 상황이 발생 할 때가 있다. 그리고 video.js, JWPlayer 같은 HTML5 Video 관련 라이브러, 또는 chart.js 같은 그래프 관련 라이브러 등의 외부 라이브러리를 사용해야 할 때에도 특정 DOM에 적용하기 DOM을 선택해 하는 상황이 발생할 수도 있다. => 그럴때 Ref라는 것을 사용한다! 초기 파일은 저번 시간에 완성한 MultiInput.js를 사용한다. ➡️우리가 저번 시간에 만들었던 내용은 초기화 버튼을 누르고나면 포커스가 초기화 버튼에 그대로 남아있게 된다. 우리는 Ref를 이용해서 초기화 버튼을 클릭했을 때 이름 input에 포커스가 잡히게 하겠다. UseRef.js import React..

DOM을 알아보기 전에 웹브라우저는 HTML 문서를 해석하고, 화면을 통해 해석된 결과를 보여준다. 해석한 HTML 코드를 화면을 통해 보여주는 과정을 '렌더링'이라고 한다. 렌더링의 세부 과정 브라우저는 HTML 코드를 해석해서 요소들을 트리 형태로 구조화해 표현하는 문서를 생성한다. 이를 DOM이라고 하며, 브라우저는 DOM을 통해 화면에 웹 콘텐츠들을 렌더링한다. 아래에 있는 사진처럼 트리 형태를 띄우게 된다. DOM의 존재 목적 DOM은 자바스크립트를 사용해서 웹 콘텐츠를 추가, 수정, 삭제하거나 마우스 클릭, 키보드 타이핑 등 이벤트에 대한 처리를 정의할 수 있도록 제공되는 프로그래밍 인터페이스이다.