늘 겸손하게

React - 프러젠테이셔널 컴포넌트 & 컨테이너 컴포넌트 본문

Programming/React

React - 프러젠테이셔널 컴포넌트 & 컨테이너 컴포넌트

besforyou999 2023. 6. 12. 22:06

컴포넌트 중에서 실행할 작업(로직)과 출력을 같이 포함하는 컴포넌트가 존재한다.

 

React를 사용하는 중요한 이유 중 하나는 컴포넌트의 높은 재사용성인데 이러한 컴포넌트는 로직과 출력이 한 컴포넌트에 묶여있기 때문에 재사용성이 떨어진다. 

 

그렇기 때문에 데이터에 종속되지 않고 순수하게 출력 역할을 담당하는 프레젠테이셔널(presentational) 컴포넌트와 데이터를 처리하고 사용자와 상호작용을 처리하는 컨테이너(container) 컴포넌트로 나누어 재사용성을 높이는것이 좋다.

 

이러한 분할과정을 디커플링(decoupling)이라고 한다.

'Programming > React' 카테고리의 다른 글

React - React에 Redux 설치 & 초기 설정  (0) 2023.07.27
React - React Hook & 장점  (0) 2023.06.29
React - shouldComponentUpdate()  (0) 2022.08.22
React - Prop Drilling & Context API v.s Redux  (0) 2022.08.17
Redux - Redux 장단점  (0) 2022.08.17