1. React란?
사용자 인터페이스를 만들기 위한 Javasccript 라이브러리 (SPA 라이브러리)
*SPA (Single Page Application)
html을 한 번만 받아와서 웹 애플리케이션을 실행시킨 후, 이후에는 필요한 데이터만 받아와 화면에 업데이트하는 것
*MPA(멀티 페이지 애플리케이션)
페이지를 이동할 때마다 서버에서 새로운 HTML을 받아오고, 필요한 CSS, JS, 이미지 파일 등을 로딩하여 화면을 구성하는 방식이다.
-> 서버 자원을 많이 사용하고, 로딩 속도가 느릴 수 있다.
*프레임워크 : 개발을 위한 기본 틀 ex) 리액트, 스프링부트, 플러터
*라이브러리 : 특정 기능을 수행하는 코드 모음 ex) jQuery(js)
2. React 특징
1) Component 기반
컴포넌트 = 웹 페이지를 구성하는 요소
- 의미 단위로 구성
- 재사용성 및 유지보수성 증가
2) Virtual DOM 기반
실제 DOM의 복사본으로, SPA에서의 동적인 변화를 효율적으로 관리하기 위해 사용
가상돔을 기반으로 UI를 빠르게 렌더링(동기화)한다
- 효율적
- 빠른 렌더링 : DOM 전체를 업데이트하지 않고 필요한 부분만 업데이트함
*DOM (Document Object Model) : 웹 페이지의 구조를 표현하는 방식. HTML 코드를 트리 형태로 변환한 것
3) CSR (Client-Side Rendering)
클라이언트(브라우저)에서 화면 렌더링을 처리하는 방식