IT/React
[React] 리액트 작동원리
HJ::
2023. 9. 14. 19:39
리액트(React)는 사용자 인터페이스(UI) 개발을 위한 JavaScript 라이브러리입니다.
리액트의 핵심 아이디어 중 하나는 가상 DOM입니다. 이것은 실제 DOM의 가벼운 복제본으로, 웹 페이지의 UI를 표현하는 데 사용됩니다.
재조정
- 리액트는 가상 DOM을 사용하여 이전 버전과 현재 버전의 UI를 비교하고 변경된 부분을 실제 DOM에 반영합니다. 이 과정을 "재조정"이라고 합니다.
- 재조정은 효율적으로 이루어지며, 변경된 부분만을 업데이트하여 불필요한 DOM 조작을 최소화합니다.
상태관리
리액트 컴포넌트는 상태(state)를 가질 수 있습니다. 상태는 컴포넌트의 데이터를 나타내며,
상태가 변경되면 UI가 다시 렌더링됩니다.
바벨과 웹팩
리액트로 개발을 할 때는 JSX로 코딩하고,
여기 저기서 모듈들을 export, import 해서 불러옵니다.
Babel, WebPack은
1) Babel 이 JSX를 React.createElement() 로 변환해준다.
2) WebPack이 JS, CSS 파일을 번링하여 모듈화해준다.