리액트2 [React] React Hooks 1. React Hooks 란? 리액트 컴포넌트는 함수형 컴포넌트(Functional Component)와 클래스형 컴포넌트(Class Component)로 나뉜다.리액트 초기에는 일반적으로 함수형 컴포넌트를 사용하였으나, 값의 상태를 관리하거나 Life Cycle Method를 사용해야 할 때 클래스형 컴포넌트를 사용하였다. 하지만 클래스형 컴포넌트의 경우 아래와 같은 단점이 있었다. 컴포넌트 사이에서 상태 로직을 재사용하기 어렵다.복잡한 컴포넌트들을 이해하기 어렵다.Class는 사람과 기계를 혼동시킨다(this 키워드 등)이와 같은 문제를 해결하기 위해 리액트는 Hook을 도입하여 class를 작성하지 않고 State와 다양한 React의 기능들을 함수형 컴포넌트에서도 사용 가능하게 만든 기능이다.즉.. 2024. 2. 14. [React] React의 특징 V-DOM(Virtual DOM) 1. DOM 이란?DOM은 Document Object Model(문서 객체 모델)의 약자로, 웹 브라우저 안에서 HTML 문서에 "html 태그"들을 JavaScript가 접근과 조작할 수 있도록 메모리에 보관할 수 있는 객체로 만든 것이다. 즉 웹 페이지를 이루는 태그들을 자바스크립트가 이용할 수 있게끔 브라우저가 트리구조로 만든 객체 모델을 의미하며 DOM은 HTML과 자바스크립트를 서로 이어주는 역할을 하고 있다.2. 기존 웹 브라우저 렌더링 방식과 발생할 수 있는 문제점2-1. 기존 브라우저 렌더링 방식DOM Tree 형성 : 서버에서 보낸 HTML 파일을 브라우저가 해석(Parsing)하여 DOM 트리를 만든다.CSSOM Tree 형성 : 서버에서 보낸 CSS 파일을 브라우저가 해석(Par.. 2024. 2. 6. 이전 1 다음
