반응형
React 정의
- Meta 에서 만든 자바스크립트 라이브러리의 하나로서 사용자 인터페이스를 만들기 위해 사용
- 컴포넌트라고 불리는 작고 고립된 코드의 파편을 이용하여 복잡한 UI를 구성하도록 도움
React 특징
- 새로고침 없이 다른 페이지 이동가능
- JSX 사용
- Component이 조합 구성 - 재사용성 향상으로 개발 기간 단축, 유지보수 용이
- Virtual DOM 사용하여 DOM 업데이트를 추상화 함으로 처리 횟수를 최소화하여 효율적으로 관리하여 빠른 처리가 가능
- React Native를 활용하여 앱 개발 가능
- 지속적인 버전 업데이트 및 라이브러리로 인한 방대한 학습 진행과 상태 관리(state)가 복잡한 단점이 있음
리액트 DOM 업데이트 과정
- 데이터를 업데이트하면 전체 UI를 Virtual DOM에 Rerendering
- 이전 Virtual DOM과 비교
- 바뀐 부분만 실제 DOM에 적용
React 클래스
클래스 구성요소는 render()를 포함해야 하며, return은 반드시 하나의 상위요소만 반환 가능
class Exam extenns Component {
render(){
return (
)
}
}
render 메서드
- 화면에 뭔가를 출력하기 위해 반드시 필요한 기본 메서드
- 초기 렌더링으로 컴포넌트가 어떻게 작동하는지에 대한 정보를 지닌 객체를 반환
- 반드시 단 하나의 리액트 요소를 리턴해야 함
초기 렌더링 과정
- 최상위 컴포넌트 렌더링 작업 수행
- HTML마크업 생성
- 정한 실제 페이지의 DOM 요소 안에 주립
반응형
'React' 카테고리의 다른 글
[React] React Props (1) | 2023.10.20 |
---|---|
[React] React Hook (0) | 2023.10.18 |
[React] React Component (2) | 2023.10.15 |
[React] React Element (0) | 2023.10.15 |
[React] JSX (0) | 2023.10.13 |