부트캠프 49일차 (상태 관리)

 

오늘의 생각

오늘은 상태(State) 관리에 대해 배우고 페어 과제를 진행했다. 

 

기존에 공부했던 CDD에 더해 State 관리와 더불어 신뢰할 수 있는 단일 출처 원칙에 대해 배웠는데, 생각보다 잘 진행해서 꽤 뿌듯했다.

 

처음에는 빈 탬플릿에 어떤 부분을 더하고 빼야할지 감이 잘 오지 않았다. "단일 출처 원칙을 지키면서 여러가지 컴포넌트에 State 공유를 하는 법"이라는 게 잘 와닿지 않았는데, 과제를 진행하면서 어떤 컴포넌트에 어떤 State를 공유하고 관리를 해야하는지 알아내는 것이 가장 어려웠던 것 같다.

 

아쉬웠던 점으로 좀 더 자세히 데이터 구조를 분석하고 단순히 어디에 State가 필요한지를 넘어 어떤 식으로 관리를 하면 좋을지 미리 생각하지 못했다는 생각이 들었다.

 

 

그래도 기본적인 다이어그램을 만들고, 각 js파일에 해당하는 컴포넌트 분석을 한 덕분에 페어 과제를 진행하는데는 어려움이 없었던 것 같다.

 

특히 구현 목표를 통해 기본적으로 주어진 탬플릿이 어떤 식으로 진행 됐는지 파악하고 필요로 하는 State가 무엇인지 생각하고 접근할 수 있어서 이 부분은 꽤 뿌듯했다.

---

오늘의 키워드

State, Side Effect, 로컬 상태, 전역 상태, Single source of truth(신뢰할 수 있는 단일 출처) 원칙, props drilling

---

오늘의 학습내용

• 상태State와 Side Effect, 'React로 생각하기' 복습
• 로컬 상태와 전역 상태의 정의 및 차이점
• 상태 관리가 필요한 이유
• Props Drilling의 정의와 그로 인해 발생하는 문제점

---

어려웠던 keyword / 활용한 질문

 

Q. Props Drilling을 설명하고 왜 상태관리 라이브러리를 써야하는지 설명하세요.

 

A. Props Drilling이란 상위 컴포넌트의 state를 통해 전달하고자 하는 하위 컴포넌트 사이에 있는 컴포넌트들을 걸쳐 비효율적으로 데이터를 전달하는 현상을 의미합니다. 이러한 현상의 문제점으로 규모가 커졌을 때 코드의 가독성이 나빠지고, 유지보수가 어려워지며, 해당 state 변경시 전달 과정에서 불필요한 리렌더링이 발생해 웹성능을 저하시킬 수 있습니다. 따라서 이를 보완하기 위해 상태관리 라이브러리를 통해 하나의 저장소에 데이터를 보관하고 props drilling 현상을 예방해야 합니다.