Quick Start

Check the key points of the Getting Started page with a working example all at once.

1. Install

@byeolnaerim/global-rx-stateuses React hooks and RxJS BehaviorSubjectSo the app needs to have react, rxjstogether.

bash

2. Share store with the same name

Named mode is designed for easy calls within components. Calling with the same name createRxStatereturns the same global store. If the next value depends on the previous value, setValue((prev) => next) use a functional setter in the form of.

tsx

3. Use createRxStateTuple if a runtime key is needed

when the name is determined at runtime, such as workspace id received from the server, route parameters, or the name of the tab clicked by the user, createRxStateTuplethis is natural. The example below uses different draft stores for each tab.

tsx

4. Gather change rules in the reducer

Simple values are sufficient with a setter, but if the state changes based on multiple actions or values depend on each other, createRxReducerit's safer to gather change rules in one place.

tsx