roxanne
roxanne is a simple implementation of the Redux pattern using rxjs while taking advantage of the abilities of typescript. It can be used across any platform, and can be used also in node js apps.
License
MIT License
Installation
roxanne has a peer dependency of rxjs so you will need to install both.
npm install roxanne rxjs
Usage
Demo - angular (Still work in progress)
Let's quickly go over the main concepts:
- State
- Actions
- Reducer
- Store
State
State is an interface representing your store's state.
For example:
Actions
Actions is an interface whose keys are the action's type, and their value is the action's payload.
For example:
Reducer
A reducer is a function which receives 3 arguments:
- state - The current state
- action - The action's name (string)
- payload - The action's payload
and returns the new state.
You may import and use the "Reducer" typescript type, as shown in the example below, in order to use generics, but you don't have to.
For example:
;;; );
Store
The store is the class that manages the app's state. It extends the rxjs' BehaviorSubject class.
Example:
;;; ; ; store.dispatch'setLoading', true;store.dispatch'setLoading', 'not a boolean!' // typescript will show an error // Subscriptions examples (Don't forget to unsubscribe): store.actionOfType'showError' .subscribeconsole.error'An error occured:', payload; store.subscribe;