Redux(리덕스)는 JavaScript(자바스크립트) 상태관리 라이브러리입니다. 보통 리덕스는 리액트에서 가장 사용률이 높은 상태관리 라이브러리로 알려져 있기 때문에 리액트에서만 사용한다고 착각하기 쉽습니다. 하지만 리덕스는 라이브러리이기 때문에 다양한 UI, Library들과 함께 사용이 가능합니다. 즉, 리덕스는 리액트에 종속된 라이브러리가 아닌 어떤 UI에도 구애받지 않고, React, Vue, vanilla JS, Angular 등 어디든 붙여 사용할 수 있을 정도로 유연한 성격을 가지고 있습니다.
리덕스는 전역 상태관리를 위한 도구이자 상태(State)를 효율적으로 관리하고 사용할 수 있도록 도와주는 도구 중 하나입니다. 즉 애플리케이션의 상태를 하나의 중앙 저장소에 저장하고 관리합니다. 이렇게 관리함으로써 상태가 여러 컴포넌트 간에 공유되고, 상태에 대한 업데이트가 일관되게 이루어집니다.
리덕스는 상태의 변화를 예측 가능한 방식으로 관리합니다. 상태의 변경은 오직 액션(Action)이라는 객체를 통해 이루어지기 때문에 애플리케이션의 동작을 예측하기 쉽습니다. 또한 리덕스는 Redux DevTools를 통해 상태 변화를 모니터링하고 디버깅이 가능해지기 때문에 앱의 상태가 언제, 어디서, 어떻게 바뀌었는지 쉽게 추적이 가능합니다.
리액트는 상위 컴포넌트에서 하위 컴포넌트로 전달시키는 구조로 되어 있기 때문에 상위 컴포넌트에서 렌더링이 발생하면 그 자식 컴포넌트들에게도 불필요한 리렌더링이 발생합니다. 또한 프로젝트 규모가 커지고 수많은 컴포넌트 간에 상태값을 공유하거나 변경해야 한다면 작성해야 하는 코드가 늘어나면서 코드의 가독성이 떨어지고 유지보수가 힘들어집니다. 이런 문제들을 개선하기 위해 리덕스를 사용하게 되었습니다.
리덕스는 상태 데이터를 하나의 데이터 저장소인 스토어에 저장하고 그 스토어에서 데이터를 불러오는 방식을 사용합니다. 이러한 방식을 사용하면서 불필요하게 상태를 다른 컴포넌트에 전달시키는 과정이 사라지고 더 효율적인 관리가 가능해졌습니다.
리덕스를 사용하면 컴포넌트의 상태 업데이트에 관련된 코드를 다른 파일로 분리해서 데이터를 효율적으로 관리할 수 있습니다. 또한, 컴포넌트끼리 똑같은 상태를 공유해야 할 때도 여러 컴포넌트를 거치지 않고 손쉽게 상태 값을 전달하거나 업데이트를 할 수 있습니다. 즉, 컴포넌트 간의 상태를 전달하는 과정이 간소화됩니다.
리덕스 사용 시, 리액트의 단점이었던 수많은 상태 변경과 상태 전달 과정을 간편화할 수 있으며, 상태 관리의 번거로움을 줄여줄 수 있습니다.
애플리케이션의 상태가 여러 컴포넌트 간에 공유되고, 상태 업데이트를 하는 로직이 복잡한 경우 리덕스가 유용합니다. 특히, 상태가 다수의 컴포넌트에 걸쳐 있거나 깊은 중첩구조를 가지는 경우에 많이 활용됩니다.