공부하자

DOM이란? Document Object Model의 약자이고, 웹 페이지를 이루는 태그들을 자바스크립트가 이용할 수 있게끔 브라우저가 트리구조로 만든 객체 모델을 의미한다. 즉, HTML과 스크립팅 언어(javascript)를 서로 이어주는 역할을 한다. DOM을 문서 객체 모델이라고 하는데 여기서 문서 객체란 html, head, body와 같은 태그들을 javascript가 이용할 수 있는(메모리에 보관할 수 있는) 객체를 의미한다. [ Virtual DOM을 사용하는 이유 ] 큰 규모의 웹 어플리케이션은 수많은 데이터가 로딩된다. 데이터가 로딩될때마다 수많은 요소들이 DOM에 직접 접근하여 변화를 주다 보면 로딩 속도가 느려질 가능성이 크다. 이는 DOM 자체가 느려지는 걸 의미하는 게 아니다. ..

리액트를 사용해 프로젝트를 하다보면 라이프 사이클에 대해 알고 적절히 활용을 해야합니다. 그래서 이 글에서는 라이프 사이클, 라이프 사이클 메서드, 그리고 많이 사용되는 Hook에 대해 정리를 해보았습니다. 라이프 사이클이란 무엇인가? 모든 리액트 컴포넌트는 라이프 사이클이 존재합니다. 컴포넌트는 생성(mounting) => 업데이트(updating) => 제거(unmounting)의 생명주기를 갖는데, 이 생명주기를 활용해서 필요한 작업들을 적절한 시기에 지정해줘야 불필요한 업데이트를 방지할 수 있습니다. [ React 17이상 버전 생명주기 ] 출처 : http://projects.wojtekmaj.pl/react-lifecycle-methods-diagram/ React Lifecycle Metho..