본문 바로가기
반응형

상태 관리 라이브러리3

17. 상태 관리 라이브러리 - 3 Context API를 이용한 간단한 상태 관리 방법 React의 Context API는 컴포넌트 간에 전역적으로 상태를 공유할 수 있는 방법을 제공합니다. 이번 글에서는 Context API를 활용하여 간단한 상태 관리 방법을 소개하겠습니다. Context API 소개 Context API는 React 애플리케이션에서 전역적으로 상태를 관리하기 위한 방법을 제공합니다. 이를 통해 프로퍼티 체인을 피하고 상태를 직접 전달할 필요 없이 컴포넌트 간에 데이터를 공유할 수 있습니다. 간단한 상태 관리 예제 import React, { createContext, useContext, useState } from 'react'; // Context 생성 const ThemeContext = createContex.. 2024. 2. 19.
16. 상태 관리 라이브러리 - 2 MobX 소개와 기본 개념 MobX는 React 애플리케이션의 상태 관리를 위한 간단하고 강력한 상태 관리 라이브러리입니다. 이번 글에서는 MobX의 기본 개념과 주요 요소에 대해 알아보겠습니다. MobX의 기본 개념 관찰 가능한 상태 (Observable State): MobX는 상태를 관찰 가능한 객체로 정의합니다. 이는 상태 변경이 발생할 때 자동으로 관련된 컴포넌트에 업데이트를 푸시할 수 있게 해줍니다. 컴퓨티드 값 (Computed Values): MobX는 자동으로 의존성을 추적하고 필요한 경우 자동으로 다시 계산하는 컴퓨티드 값 개념을 제공합니다. 이를 통해 복잡한 데이터 변환 및 유도를 쉽게 처리할 수 있습니다. 액션 (Actions): 상태를 변경하는 작업을 의미하며, MobX에서는 액션.. 2024. 2. 18.
15. 상태 관리 라이브러리 - 1 Redux 소개와 기본 개념 Redux는 React 애플리케이션의 상태 관리를 위한 예측 가능한 상태 컨테이너 라이브러리입니다. 이번 글에서는 Redux의 기본 개념과 주요 요소에 대해 알아보겠습니다. Redux의 기본 개념 단일 소스 관리 (Single Source of Truth): Redux는 애플리케이션의 상태를 하나의 JavaScript 객체로 관리합니다. 이를 통해 애플리케이션의 전체 상태를 예측 가능하고 중앙에서 효과적으로 관리할 수 있습니다. 불변성 (Immutability): Redux는 불변성을 유지하는 것을 권장합니다. 상태를 변경할 때는 기존 상태를 변경하지 않고 새로운 상태를 반환하는 방식으로 작업해야 합니다. 액션 (Actions): 상태 변경을 위한 특정 이벤트를 의미하며, J.. 2024. 2. 18.
반응형