React 데이터 흐름[2021.09.06]

김정훈·2021년 9월 6일

React

목록 보기
4/8

1. React 데이터 흐름

React 개발 방식의 가장 큰 특징은 페이지 단위가 아닌, 컴포넌트 단위로 시작
한다는 점이 가장 큰 특징


페이지를 만들기 전에 컴포넌트를 먼저 만들고 조립 즉 상향식으로 앱을 만든다.
이것의 가장 큰 장점은 테스트가 쉽고 확장성이 좋다. 
하나의 컴포넌트는 한가지 일만 한다!


컴포넌트는 컴포넌트 바깥에서 props를 이용하여 데이터를 인자 또는 속성처럼 전달
받을 수 있다. 데이터를 전달하는 주체는 부모 컴포넌트가 되며 이는 데이터 흐름이
하향식임을 의미
* 단방향 데이터 흐름(one-way data flow)
  - react의 대표적인 특성 중 하나
  - 부모로부터 자식으로만 데이터가 전달이 가능
  - DOM을 갱신 할 때 큰 장점(데이터의 갱신에 반응하여 뷰 또한 갱신)
  - 단순한 데이터 흐름은 이해하기 쉽고 관리하기에 좋다.
  
  
하위 컴포넌트에서의 이벤트가 부모의 상태를 바꾸어야 하는 상황에서는 
"state 끌어올리기"를 통해 해결!!
  - 상태를 변경시키는 함수를 하위 컴포넌트에 props로 전달하여 해결할 수 있다.
    이는 마치 콜백 함수를 사용하는 방법과 유사



profile
프론트엔드 개발자를 꿈꾸고 있습니다!

0개의 댓글