1. 컴포넌트별로 따로 분리되어 있어서 재사용이 용이하고 유지보수가 가능하다.
2. JSX라는 자바스크립트의 확장문법이 HTML 문법과 사용이 비슷하여 예측가능한 개발이 가능하다.
3. Virtual DOM이 바뀐 부분만 새로 데이터를 로드해서 효율적인 DOM 제어가 가능하다.
4. 서버사이드 렌더링을 지원한다.
5. ES6 지원
----------------------------------------------------------------------------------------------------
★ 컴포넌트란?
-> 기능을 단위별로 캡슐화하는 리액트의 기본 단위
★ Props란?
★ State란?
★ render란?
★ 모듈(라이브러리)이란? 함수 또는 특정기능을 온전히 수행할 수 있도록 기능별로 묶은 단위
★ DOM이란? Document Object Model로 문서객체모델이다.
작성한 소스코드가 브라우저에의해 파싱되면 DOM이 된다.
★ HTML 문서의 태그들을 자바스크립트가 이용할 수 있는 객체로 만들고
웹 브라우가 그것을 인식하는 방식을 말한다.
★ Virtual DOM을 왜 쓰는가?
DOM 조작이 많이 발생하면 그 변화를 적용하기 위해 브라우저가 연산을 해야하고
그로인해 프로세스를 비효율적으로 만든다
-> View에 변화가 있으면 그 변화를 가상 DOM에 먼저 적용시키고
그 결과를 실제 DOM에게 전달해주면 브라우저 내의 연산의 양을 줄이고 성능이 개선된다.
★ 렌더링이란? 웹 페이지 접속 시, 그 페이지를 화면에 그려주는 것
★ 서버사이드 렌더링이란? View에 어떻게 보여줘야될지 서버에서 해석하는것
★ 클라이언트 렌더링이란? 빈페이지를 서버에서 제공, 클라이언트에서 자바스크립트를 통해 렌더링
★ 리액트를 써서 서버사이드 렌더링을 해야하는 이유
-> SEO (Search Engine Optimization) 검색엔진 최적화
클라이언트 렌더링을 하는 경우 View 생성전까지 HTML 내용을 알 수 없기 때문에 제대로 된 검색 수행이 불가
★ 리액트 JS는 서버와 클라이언트가 같은 코드를 사용한다는 (Isomorphic Javascript)동적 자바스크립트의 형태를 띈다
★자바스크립트란? 웹 페이지에 동적인 요소를 구현하기 위해 발명
★ ES6를 사용하는 이유: ECMA Script는 스크립트 언어의 표준 : 스크립트언어가 널리퍼지면서 호환성 이상없이 구동되기 위한 규격이 필요했다. 기존버전과 호환성 문제등
'React' 카테고리의 다른 글
React 태그 안에 style 속성 넣기 (0) | 2020.04.29 |
---|---|
React Fragment 란? (2) | 2020.04.29 |
React 개발환경 구축하기 (0) | 2020.02.05 |
React Component , props , state 란? (0) | 2020.02.05 |
React 소스 코드 분석 (0) | 2020.02.04 |