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

2022. 2. 9. 08:50공부/패스트캠퍼스

수강 인증샷


패스트캠퍼스 챌린지란?

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


17일차

 17일차에는 Part 1. React 기초 Ch 01. React 맛보기 챕터에서 27. 상태 끌어올리기 강의 내용에 대해 기록하려 한다.

 Part 1. React 기초 Ch 01. React 맛보기 챕터에서 27. 상태 끌어올리기 강의에서 부모 - 자식 간 컴포넌트에서 자식의 상태를 부모 컴포넌트에서 알 필요가 있을 때 하는 것을 상태 끌어올리기라고 표현한다. 공식 문서에 따르면, '종종 동일한 데이터에 대한 변경사항을 여러 컴포넌트에 반영해야 할 필요가 있습니다. 이럴 때는 가장 가까운 공통 조상으로 state를 끌어올리는 것이 좋습니다'라고 하는데 형제 컴포넌트의 상태들이 궁금하고 필요한 경우에 이 형제 컴포넌트들을 아우르는 공통 부모 컴포넌트로 state로 끌어올린다는 표현이다. 강의에서는 예시를 로그인을 통해 진행한다. 예를 들어, 사용자가 로그인을 진행하려고 할 때 ID와 Password를 모두 입력하지 않았을 때 로그인 버튼이 disabled 되어야 하는 상황이 있다고 가정해보자. 이때, ID와 Password를 각각의 컴포넌트로 분류하고 부모 App 컴포넌트에서 사용한다고 가정하면, ID의 글자 수가 0이 아니고 Password의 글자 수가 0 이 아니어야 한다. 하지만, 자식 컴포넌트인 ID와 Password를 부모 컴포넌트인 App에서 상태를 알 수 있는 방법이 없기에 상태 끌어올리기를 이용해 ID와 Password의 상태를 부모 컴포넌트인 App 컴포넌트에 가져오고 필요한 props만 ID와 Password에게 전달한다.


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

 


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