React Native 앱에서 state를 어떻게 관리하나요?

Question

Accepted Answer

React Native(React와 마찬가지로)의 state 관리는 로컬 컴포넌트 state(useState)부터 **Context**를 통한 공유/전역 state, 또는 **Redux**, **Zustand** 같은 라이브러리까지 다양합니다. 앱이 커짐에 따라 옵션과 각각의 사용 시점을 이해하는 것이 중요합니다.

## 로컬 state와 state 끌어올리기

```text
useState → 로컬 컴포넌트 state (간단, 하나의 component용)
LIFTING STATE UP → 공유 state를 공통 부모로 올리고 props로 전달
  → 적당한 공유에는 동작하나, "PROP DRILLING" (여러 계층을 거쳐 전달)은 고통스러움
```

## Context API — 내장 공유 state

```jsx
// Context는 prop drilling 없이 트리 전체에서 state 공유 (React 내장)
const ThemeContext = createContext();
// 트리 상단에서 제공; 아래 어디서든 useContext로 소비
const theme = useContext(ThemeContext);
// → 저빈도 전역 데이터에 적합 (테마, 인증, 사용자); 과용하면 재렌더링 유발 가능
```

## state 관리 라이브러리

```text
복잡한/전역 state에는 라이브러리가 도움:
  REDUX (+ Redux Toolkit) → 예측 가능한 중앙 집중 store; 구조화됨; 대형 앱에 인기;
    더 많은 boilerplate (RTK가 줄여줌)
  ZUSTAND → 최소한의, 단순한, hook 기반 store — 인기 있는 최신 경량 선택지
  Jotai / Recoil → atomic state; MobX → observable state
  React Query / TanStack Query → SERVER state용 (캐싱, 가져오기) — 함께 자주 사용
    (API 데이터, 로딩, 캐싱 처리)
```

## 선택

```text
간단/로컬 → useState; 적당한 공유 → 끌어올리기 / Context
복잡한 전역 앱 state → Redux Toolkit 또는 Zustand (선호/복잡도에 따라)
서버/API 데이터 → React Query (캐싱, 동기화) — 클라이언트 state와 구별됨
→ 과도하게 설계하지 말 것; 앱 복잡도에 솔루션을 맞출 것.
```

## 왜 중요한가

state 관리를 이해하는 것은 중요한데, **앱이 state를 관리하고 공유하는 방식은 앱 복잡도에 따라 커지는 중요한 아키텍처 관심사**이므로 실제 React Native 앱 개발에 가치 있는 지식입니다.

React Native의 state 관리는 React처럼 동작하며 간단한 것부터 정교한 것까지 다양합니다.

**로컬 state**(useState)와 **state 끌어올리기**(공유 state를 공통 부모로 이동)를 이해하면 기본 요구를 다룰 수 있고, **prop drilling 문제**(state를 여러 계층을 거쳐 전달하는 것이 고통스러워짐)를 인식하면 더 나은 솔루션의 필요성을 느끼게 됩니다.

**Context API**(prop drilling 없이 트리 전체에서 state를 공유하는 React의 내장 방법)는 저빈도 전역 데이터(테마, 인증, 현재 사용자)에 적합하지만 과용하면 재렌더링을 유발할 수 있습니다.

복잡한/전역 state를 위한 **state 관리 라이브러리** — **Redux**(Redux Toolkit과 함께, 예측 가능한 중앙 집중 store, 구조화되고 대형 앱에 인기), **Zustand**(최소한의, 단순한, hook 기반, 인기 있는 최신 경량 선택지), 기타(Jotai, MobX) — 를 이해하면 중요한 앱 state를 관리하는 옵션을 갖추게 됩니다.

중요한 점은 **서버 state를 위한 React Query/TanStack Query**(클라이언트 state와 구별되는 API 데이터 캐싱 및 동기화)를 이해하는 것이 **서버 state와 클라이언트 state가 다른 관심사**(캐싱/가져오기가 있는 API 데이터는 종종 별도로 처리하는 것이 최선)라는 최신 인식을 반영한다는 것입니다 — 가치 있고 점점 더 중요해지는 구별입니다.

**선택** 방법(로컬은 useState, 적당한 공유는 Context, 복잡한 전역 state는 Redux Toolkit 또는 Zustand, 서버 데이터는 React Query, 과도한 설계 없이)을 이해하는 것은 복잡도에 솔루션을 맞추는 건전한 판단을 반영합니다.

state 관리는 유지보수성에 영향을 미치고 앱 복잡도에 따라 확장되는 중요한 아키텍처 관심사이며, 스펙트럼(로컬 state, Context, 라이브러리, 서버 vs 클라이언트 state 구별)을 이해하고 적절히 선택하는 것이 실제 앱 개발에 중요하므로, React Native에서 state 관리를 이해하는 것은 가치 있고 실용적으로 관련된 지식입니다 — 유지보수 가능하고 확장 가능한 React Native 앱을 만드는 핵심 아키텍처 영역이며, 옵션들과 클라이언트/서버 state 구별이 건전한 state 아키텍처에 중요합니다.