/React-Practice

React.js 공부✏✨

Primary LanguageJavaScript

React.js

Facebook에서 제공하는 UI를 작업하기 위한 자바스크립트 기반 라이브러리

리액트의 특징

  • Component를 사용하여 가독성이 높고 유지보수가 용이하며 재사용성이 가능
  • Virtual DOM은 실제 DOM에 대한 조작을 최소화 하기 위해 현재의 내용과 전체 UI를 비교하여 바뀐 부분만 실제 DOM에 적용함으로써 빠른 속도도 렌더링 가능
  • 리액트 네이티브를 활용하여 앱 개발 가능
  • 생태계가 넓고, 다양한 라이브러리 사용 가능
  • UI에 집중한 라이브러리
  • 단방향 데이터 바인딩

① Virtual DOM

실제 DOM의 가벼운 사본과 비슷한 것
실제 DOM에 접근하여 조작하는 대신, 이를 추상화한 자바스크립트 객체를 구성하여 사용한다.

  1. 전체 UI를 Virtual DOM에 리렌더링
  2. 이전 내용과 현재 내용을 비교
  3. 바뀐 부분만 실제 DOM에 적용

② JSX

JavaScript + xml, HTML처럼 보이는 코드를 쓸 수 있는 자바스크립트 구문의 확장자

③ Component

리액트는 재사용이 가능한 컴포넌트를 만들고, 이 컴포넌트들이 모여 웹사이트를 구성하게 된다.
이 컴포넌트들은 결국 자바스크립트 함수(또는 객체)이다.