🌊 211010 WIL

벌써 4주차...! 시간이 정말 빠르게 간다. 미니 프로젝트를 앞두고 React의 전체적인 개념도 다룰 겸 복습 중이었는데, 마침 WIL 키워드가 주어져서 간단하게 남겨본다.

React와 전역 상태 관리

React 기반의 웹 페이지는 하나의 HTML 파일 안에 여러 개의 Components로 구성된다. 작게 쪼개진 컴포넌트들은 중첩되기 마련인데, 서비스의 규모가 커질 수록 그 수는 증가한다. 이 때, 각 컴포넌트 간의 state(변수) 관리 문제가 발생한다. 상위 컴포넌트에 선언된 state는 props를 통해 하위 컴포넌트로 전해주지 않으면 하위 컴포넌트에서 사용이 불가능하다. 만약 컴포넌트 A에 선언된 state = a;를 A안에 중첩 된 수 많은 하위 컴포넌트 중 A-9에서만 사용한다고 가정하면, A-1부터 A-8까지는 a를 사용하지도 않는데 A-9에서 a를 사용하게 하기 위해 수 많은 props 문법을 사용해야한다. 귀찮을 뿐더러 기능 면에서 효율적이지도 않다. 이럴 때 Redux 라이브러리를 사용하여 React의 상태 관리를 보다 편하게 할 수 있다. Redux를 사용하게되면 state를 저장하는 파일을 하나 생성할 수 있다. Redux를 이용해 저장된 state에는 모든 컴포넌트에서 접근이 가능하기 때문에 props 중첩을 통한 접근이 없이 바로 각 컴포넌트에서 사용이 가능하다.