리액트 | 리액트란?

1. 리액트란?

- 리액트는 자바스크립트 라이브러리입니다.

- 구조가 MVC, MVVM과 같은 다른 프레임워크등과는 다르게 오직 View만 처리하는 라이브러리 입니다.

* 프레임워크 : 뼈대, 라이브러리의 모음집

* api : 라이브러리의 사용방법

SPA란?

- Single Page Application의 줄임말 입니다.

: 기본적으로 화면을 하나만 가지고 만들어낸다는 뜻입니다.

- index.html하나만 로드하고 실행시키는 구조입니다.

어떻게?

번들러(Webpack)가 이 모든것을 해줍니다. 노트js에서 자동구성

Webpack이란 어플리케이션을 동작시키는데 필요한 자원(JS파일들, CSS, Image 등)을 하나로 묶어서 조합하여 경량화 하여 결과물을 만들어 주는 도구입니다.

번들러는 node.JS를 통해 직접 설정 할 수 있지만, 리액트 프로젝트를 생성시 자동으로 포함됩니다.

DOM (Document Object Model) 이란?

- HTML을 이해하기 쉽도록 트리 구조로 만들어진 태그(객체)들 입니다

리액트의 Virtual DOM 이란?

HTML에서 DOM을 조작하여 처리할 때, DOM핸들링 자체는 빠릅니다.

하지만, 웹 브라우저가 DOM의 변화를 감지하고, CSS를 적용하고, 처리하는 과정에서 시간이 많이 소요됩니다.

리액트의 Virtual DOM은, 이를 추상화시킨 자바스크립트 객체를 이용해서, 바뀐 부분만 부분적으로 리렌더링 하여 사용 하는 방법입니다. (화면 이동없이(리렌더링없이) 하나의 바뀐 부분만 바꿔준다.