[React] 리액트란?

2022. 2. 8. 16:36·React/이론
목차
  1. 1. 리액트?
  2. 2. 특징
  3.  
반응형

1. 리액트?

리액트는 facebook에서 제공해주는 웹과 앱의 View를 개발할 수 있는 프런트엔드 라이브러리이다. 

 

여기서 React가 프레임워크인지 라이브러리인지 많은 논란이 있다. 

프레임워크란 원하는 기능 구현에 집중하여 개발할 수 있도록 필요한 기능을 갖추고 있는 것이다. 

라이브러리는 활용 가능한 도구들의 집합이다. 

 

이 둘의 차이점은 제어 흐름에 대한 주도성이 누구에게 그리고 어디에 있는가에 있다. 

 

프레임워크는 자신이란 틀에 맞게 사용자가 필요한 기능을 입력하는 것이고, 

라이브러리는 개발자가 필요한 기능을 원할 때 입력한다. 

 

리액트는 필요로 할때 useEffect() 같은 함수를 사용해서 특정한 동작을 할 수 있게 해 주기 때문에 라이브러리라고 한다.

2. 특징

  • Virtual DOM을 사용한다.
    • DOM ? Document Object Model의 약자 → 객체로 문서 구조(head, body)를 표현
    • 웹 브라우저에서 DOM의 변화가 일어나면 웹이 다시 CSS를 다시 연산하고, 레이아웃을 구성하고, 페이지를 리 페인트 하는데 시간을 허비한다.
    • Virtual DOM을 사용하면 실제 DOM에 접근하여 조작하는 대신, 추상화한 자바스크립트 객체를 구성하여 사용한다.
  • 진행 단계 
    1. 데이터를 업데이트하면 전체 UI를 Virtual DOM에 리렌더링 한다.
    2. 이전 Virtual DOM에 있던 내용과 현재 내용을 비교한다.
    3. 바뀐 부분만 실제 DOM에 적용한다.

 

 

반응형

'React > 이론' 카테고리의 다른 글

[React] Hook  (0) 2022.02.08
[React] React-lifecycle  (0) 2022.02.08
[React] JSX란?  (0) 2022.02.08
[React] SPA(Single Page Application)란?  (1) 2022.02.08
[React] 컴포넌트란?  (0) 2022.02.08
  1. 1. 리액트?
  2. 2. 특징
  3.  
'React/이론' 카테고리의 다른 글
  • [React] React-lifecycle
  • [React] JSX란?
  • [React] SPA(Single Page Application)란?
  • [React] 컴포넌트란?
잉여개발자
잉여개발자
풀스택 개발자를 목표로 잉여롭게 개발 공부도 하면서 다양한 취미 생활도 즐기고 있는 잉여 개발자입니다.
  • 잉여개발자
    잉여로운 개발일지
    잉여개발자
    • 분류 전체보기 (789)
      • 개발정보 (36)
      • 개발환경 (7)
      • 개발생활 (19)
      • React (141)
        • 이론 (23)
        • 기능 (12)
        • 실험실 (88)
        • 버그 (6)
        • 패스트캠퍼스 (9)
        • Npm (3)
      • React Native (28)
        • 공통 (6)
        • TypeScript (3)
        • JavaScript (18)
        • 버그 (1)
      • Next.js (30)
        • 이론 (13)
        • 실험실 (13)
        • 버그 (3)
      • Web (35)
      • 알고리즘 (202)
        • 풀이 힌트 (39)
      • JavaScript (47)
      • TypeScript (29)
        • 기초 (27)
        • 실험실 (2)
      • Node.js (13)
        • 이론 (0)
        • 기능 (3)
        • 실험실 (9)
        • 버그 (1)
      • 도커 (4)
      • CCNA (22)
        • 이론 (4)
        • 문제 (18)
      • 취미생활 (167)
        • 잉여로운 칵테일 (2)
        • 잉여의 식물키우기 (130)
        • 잉여로운 여행기 (11)
        • 잉여의 제2외국어 (21)
        • 잉여로운 책장 (2)
      • Java (1)
        • Java의 정석 (1)
      • 꿀팁 공유 (3)
  • 태그

    덤프
    javascript
    바질 키우기
    ReactNative
    Babel
    리얼클래스
    네이버 부스트캠프
    자바스크립트
    ChatGPT
    프로그래머스
    네트워크
    식물
    다이소
    redux
    typescript
    타입스크립트
    타일러영어
    CSS
    알고리즘
    Node.js
    CCNA
    next.js
    바질
    영어회화
    리액트
    리얼학습일기
    react
    영어독학
    Docker
    webpack
  • hELLO· Designed By정상우.v4.10.1
잉여개발자
[React] 리액트란?

개인정보

  • 티스토리 홈
  • 포럼
  • 로그인
상단으로

티스토리툴바

단축키

내 블로그

내 블로그 - 관리자 홈 전환
Q
Q
새 글 쓰기
W
W

블로그 게시글

글 수정 (권한 있는 경우)
E
E
댓글 영역으로 이동
C
C

모든 영역

이 페이지의 URL 복사
S
S
맨 위로 이동
T
T
티스토리 홈 이동
H
H
단축키 안내
Shift + /
⇧ + /

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.