프로젝트

일반

사용자정보

다운로드 (2.13 KB)

Task #418 » React 관련 용어정리_초안 강현호_수정 송지호.txt

(강현호) 세미나 도중, 제가 궁금해서 기록해놓은 용어에 대한 간략한 내용 정리한 문서 공유드립니다. 세미나 준비 자료 이해에 도움이 되길 바라며 - 중은 정, 2024/09/13 03:16

 
React

> Component
- 리액트로 만들어진 앱을 이루는 최소한의 단위
- 데이터(props)를 입력받아 View(state) 상태에 따라 DOM Node를 출력하는 함수 혹은 Class.
- “props”라고 하는 외부 입력을 받은 후(옵션),
화면에 어떻게 표시되는지를 기술하는 React 엘리먼트를 반환

> 함수 컴포넌트
- ES6 함수 기반

> 클래스 컴포넌트
- ES6 class를 사용하여 컴포넌트를 정의

> react에서는 UI의 데이터는 반드시 props와 state로 관리되어야 함 (context도 존재)
- react life cycle이 props와 state의 변경을 기준으로 화면을 갱신하기 때문 (context의 변화도 감지 가능)

> state
- 일반 JavaScript 객체
- (함수 내에 선언된 변수처럼) 컴포넌트 안에서 관리
- 컴포넌트 내부에서 가지고 있는 값
- 변경할 수 있는 값

> props
- “properties”의 줄임말
- 속성을 나타내는 데이터 (html의 속성으로 생각하시면 좋음)
- (함수 매개변수처럼) 컴포넌트에 전달
- 부모 컴포넌트가 자식 컴포넌트에게 주는 데이터
- 직접적으로 수정할 수 없는 값 (부모의 state를 자식의 props로 전달이 가능하므로, 수정이 불가능하다고는 하기 힘듦)

> DOM
- "Document Object Model"의 약자
- HTML과 XML과 같은 문서구조를 scripts나 프로그래밍 언어로 연결시켜주는 인터페이스

> Virtual DOM
- 실제 DOM 대신 실제 DOM의 사본과 같은 가상의 DOM(Virtual DOM) 개념을 도입

> Real DOM
- 실제 DOM

> Data Binding
- React 는 단방향 데이터 바인딩 사용

> 전역 상태 관리의 필요성
- 일반적으로 React에서는,
데이터는 부모로부터 props를 통해 전달된다.
- 그러나 컴포넌트를 나누다보면,
하나의 어플리케이션 안에 여러 컴포넌트에 전달해줘야 하는 경우,
props-drilling 현상이 나타나기도 한다.
- props로 계속해서 자식 컴포넌트에 전달하면,
코드가 지저분해진다.

> mutable
- 생성된 이후에 상태가 변경될 수 있음

> immutable
- 생성된 이후에 상태가 변경되지 않음
    (1-1/1)