prop-drilling 코드 Context API로 리팩토링 하기 작업중인 팬 레터 사이트 프로젝트의 컴포넌트와 전달받는 props들을 도식으로 정리해보았다. 프로젝트 구조를 살펴보면 Home과 Detail 페이지에서는 단순히 프롭스를 받아서 하위 컴포넌트로 전달하는 역할만을 수행하고 있다. 이를 해결하기 위해 context를 통해 state를 전역에서 관리하도록 수정하였다. 최상위 컴포넌트인 router.js 에서 편지를 저장하는 state를 정의하였고, 선택 캐릭터 정보는 Home컴포넌트에서만 쓰이기 때문에 Home 컴포넌트에서 정의하여 context로 관리하였다. 트러블 슈팅 - 초기 렌더링 시 undefined 오류 및 useEffect로 발생하는 렌더링 문제 문제 상황 페이지가 불러와지면 한 ..
