패스트캠퍼스 챌린지 35일차 - 한 번에 끝내는 React의 모든 것 초격차 패키지 Online

2022. 2. 27. 17:25공부/패스트캠퍼스

수강 인증샷

 


패스트캠퍼스 챌린지란?

 패스트캠퍼스에서 진행하는 '50일 공부 루틴 챌린지' 행사로 50일 동안 매일 수강 인증샷과 함께 학습 기록을 게시글로 남기는 행사다.


35일차

 35일차에는 Part 1. React 기초 Ch 03. React 공식 문서로 디테일잡기(고급) 챕터에서 05. Composition 1 강의와 06. Composition 2 강의 내용에 대해 기록하려 한다.

 Part 1. React 기초 Ch 03. React 공식 문서로 디테일잡기(고급) 챕터에 05. Composition 1 강의에서는 합성 개념에 대해 공부한다. React 공식 문서에 따르면, React는 강력한 합성 모델을 가지고 있으며, 상속 대신 합성을 사용하여 컴포넌트트 간에 코드를 재사용하는 것이 좋다고 권장한다. 상속 대신 합성을 사용하는 것을 권장하는 이유는 어떤 컴포넌트에 어떤 자식 엘리먼트가 들어올지 미리 예상 못하는 경우가 있는데 이러한 컴포넌트에서는 children prop을 사용하여 자식 엘리먼트를 출력에 그대로 전달하는 것이 좋다. 또한, 어떠한 컴포넌트의 특수한 경우인 컴포넌트를 고려해야 하는 경우에도 이 역시 React는 합성을 통해 해결할 수 있다고 말한다. 더 구체적인 컴포넌트가 일반적인 컴포넌트를 렌더링하고 props를 통해 내용을 구성할 수 있기 때문이다. 또한, Facebook에서는 수천 개의 컴포넌트를 사용함에도 불구하고 컴포넌트를 상속 계층 구조로 작성할 것을 권장할 만한 사례를 찾지 못했으며 props와 합성은 명시적이며 안전한 방법으로 컴포넌트의 모양과 동작을 커스터마이징 하는데 필요한 모든 유연성을 제공한다. 컴포넌트는 원시의 값, React 엘리먼트 혹은 함수 등 어떠한 props도 받을 수 있다. 추가로 UI가 아닌 기능을 여러 컴포넌트에서 재사용하기를 원한다면, 별도의 JavaScript 모듈로 분리하는 것이 좋다. 컴포넌트에서 상속받을 필요 없이 함수, 객체, 클래스 등을 import 하여 사용할 수 있기 때문이다.


본 게시글은 이벤트 참여를 위해 작성된 게시글입니다.

 


패스트캠퍼스 공식 홈페이지 : https://bit.ly/37BpXiC