상태 관리(State Management) 면접 질문 분석 및 비교

복잡한 애플리케이션에서 상태 관리는 필수적이다. 면접에서도 상태 관리의 필요성과 관련된 질문이 자주 나온다. 이번 글에서는 면접에서 자주 묻는 상태 관리 관련 질문을 분석하고, 핵심 개념들을 비교하며 정리한다.

1. 상태 관리 라이브러리의 역할
   복잡한 애플리케이션에서 상태 관리는 필수적이다. 데이터가 여러 컴포넌트 사이를 이동할 때 비효율이 발생한다. 이 문제를 해결하는 것이 바로 상태 관리 라이브러리다. Redux나 MobX는 상태를 중앙에서 관리하여 데이터 흐름을 일관되게 유지하고, 컴포넌트 간의 상태 공유 문제를 해결해준다.

2. Redux의 주요 개념
   면접에서 자주 묻는 Redux의 핵심 개념으로는 Action, Reducer, Store가 있다. Action은 상태를 변경하는 요청을 나타내고, Reducer는 그 요청에 따라 상태를 업데이트한다. Store는 전역 상태를 저장하는 공간으로, 모든 컴포넌트가 이 상태를 공유하게 된다.

3. Context API와 Redux의 차이점
   Context API와 Redux는 전역 상태를 관리할 수 있지만, 접근 방식이 다르다. Context API는 간단한 상태 공유에 적합하다. 하지만 상태가 복잡해지면 관리가 어려워진다. 반면에 Redux는 미들웨어를 통한 비동기 작업 처리와 상태 관리 흐름을 구조화하여 복잡한 애플리케이션에서도 효과적이다.

4. useReducer 훅의 역할과 사용법
   useReducer 훅은 상태 관리에서 중요한 역할을 한다. 이 훅은 복잡한 상태 로직을 처리하는 데 유용하다. 기본적으로 상태와 상태를 업데이트하는 함수인 reducer를 결합하여 더 구조화된 상태 관리를 가능하게 한다. useReducer는 Redux의 Reducer와 유사하게 동작하며, 다중 상태를 관리하거나 업데이트 로직이 복잡한 경우 사용된다.

5. Redux 미들웨어의 역할 (Redux Thunk, Redux Saga)
   Redux 미들웨어는 Redux의 기본 흐름을 확장하고 비동기 작업을 처리하는 데 사용된다. Redux Thunk는 가장 많이 사용되는 미들웨어로, 액션 크리에이터 안에서 비동기 코드를 실행할 수 있게 한다. 이를 통해 액션이 디스패치되기 전에 비동기 요청을 처리하고 그 결과를 바탕으로 상태를 업데이트할 수 있다.

   Redux Saga는 비동기 작업을 더욱 구조화하고 관리할 수 있도록 돕는 미들웨어다. 제너레이터 함수(generator)를 사용하여 비동기 작업을 처리하며, 보다 복잡한 비동기 흐름이나 여러 작업의 순차 실행, 오류 처리가 필요할 때 유용하다.

6. 상태 관리 없이 복잡한 애플리케이션을 만들 수 있을까?
   상태 관리 없이 복잡한 애플리케이션을 만드는 것은 가능하지만, 그 효율성은 떨어진다. prop drilling으로 컴포넌트 간 데이터를 전달하는 방식은 컴포넌트 구조가 깊어질수록 비효율적이다. 또한, 전역 상태가 필요한 경우에는 상태 관리 라이브러리 없이 전역 변수를 관리하는 데 많은 코드가 필요해진다. 상태 관리 라이브러리를 도입하면 이런 복잡한 구조를 간결하게 유지할 수 있다.

7. React에서 상태를 컴포넌트 간에 어떻게 공유하나?
   React에서 컴포넌트 간 상태를 공유하는 일반적인 방법은 props를 사용하는 것이다. 부모 컴포넌트에서 자식 컴포넌트로 데이터를 전달하는 방식이다. 하지만 여러 컴포넌트가 같은 상태를 공유할 때는 Context API나 전역 상태 관리 라이브러리(Redux, MobX 등)를 사용하는 것이 더 적합하다. Context API는 props 전달 없이 컴포넌트 트리 전체에 상태를 공유할 수 있게 해준다.

8. Redux에서 비동기 액션을 처리하는 방법
   Redux는 기본적으로 비동기 작업을 처리할 수 없다. 이를 해결하기 위해 미들웨어인 Redux Thunk나 Redux Saga를 사용한다. Redux Thunk는 액션 크리에이터 안에서 비동기 작업을 수행할 수 있게 하며, 이를 통해 API 호출과 같은 작업을 처리한 후 상태를 업데이트할 수 있다. Redux Saga는 비동기 작업을 더 구조적으로 처리하는 방식으로, 제너레이터 함수를 통해 복잡한 비동기 흐름을 제어할 수 있다.

9. MobX의 반응형 상태 관리 방식
   MobX는 반응형 상태 관리를 제공한다. 상태를 자동으로 추적하고, 상태가 변경되면 해당 상태를 사용하는 컴포넌트가 자동으로 업데이트된다. 이를 통해 상태 관리가 더 직관적으로 이루어지며, 코드 작성이 간결해진다. MobX는 상태의 변화를 감지하고 필요한 부분만 업데이트하므로, 성능 최적화에도 기여한다.

10. Redux의 connect 함수와 useSelector, useDispatch 훅의 차이점
    connect 함수는 클래스형 컴포넌트에서 Redux 상태와 액션을 연결하는 방식이다. 이를 통해 컴포넌트는 전역 상태를 구독하고, 액션을 디스패치할 수 있다. 반면에 useSelector와 useDispatch 훅은 함수형 컴포넌트에서 사용되며, useSelector는 상태를 구독하고 useDispatch는 액션을 디스패치하는 역할을 한다. useSelector와 useDispatch는 보다 간결한 코드 작성을 가능하게 하며, 함수형 컴포넌트의 장점을 살린다.