Mobx란?

·2024년 10월 3일

애석하게도 MobX 대신 reducx 사용경험만 있는 관계로 Mobx의 개념 정리를 위한 시간을 가져 보았다.

🟠 MobX란?

MobX상태 관리 라이브러리로, 리액트 애플리케이션에서 간단하고 효율적인 상태 관리를 가능하게 합니다. MobX는 리액티브 프로그래밍에 기반한 상태 관리 도구로, 상태가 변화하면 그와 연결된 UI가 자동으로 업데이트되는 구조입니다.

상태는 불변성을 유지하며 명령형 방식의 상태 관리를 지원하는 Redux와는 달리, 선언적이고 반응형인 방식으로 작동합니다.


🟠 MobX의 상태 관리 흐름

  1. 상태 : MobX에서 관리할 상태는 observable 로 정의합니다. 이는 MobX가 해당 상태를 관찰하고 변경 사항을 추적할 수 있게 해줍니다.

  2. 동작 : 상태는 action으로 정의된 함수에서만 변경할 수 있습니다. 이 방식은 상태 변경을 추적하고, 예측 가능하게 만듭니다.

  3. 파생 (=리액티브 업데이트): MobX는 상태가 변경되면 이를 감지하고, 그에 반응하여 자동으로 UI를 업데이트합니다. 리액트 컴포넌트는 observer로 감싸져 MobX 상태 변화에 반응하게 됩니다.


리액티브 프로그래밍이란?

리액티브 프로그래밍은 데이터 흐름을 자동으로 반응하게 만드는 프로그래밍 패러다임입니다. 데이터의 변경이 발생하면 그에 자동으로 반응하여 업데이트가 이루어집니다. MobX는 이러한 리액티브 프로그래밍을 기반으로 작동하며, 상태가 변화하면 그 상태와 연결된 UI가 자동으로 반응하여 업데이트됩니다


🔎 MobX 와 Redux

  • MobX간결함자동성을 강조하며, 리액티브 프로그래밍을 지원하는 상태 관리 도구입니다. 보일러플레이트 코드가 적고, 상태 변경이 유연합니다.

  • Redux명령형 상태 관리로, 상태 변화의 흐름이 명확하고 예측 가능해야 할 때 유용합니다. 대규모 프로젝트에서 상태 관리가 복잡해질 때도 구조적인 장점이 있습니다.

용어 정리

  • 불변성(immutability)이란 한 번 생성된 객체나 데이터를 변경할 수 없도록 하는 성질

  • 보일러플레이트(boilerplate)란, 기본적으로 필요한 코드를 반복해서 작성해야 하는 부분을 의미합니다

profile
묵묵하게 나아가기

0개의 댓글