Store abstraction based on immer and Context APIs.
In our app, we think Redux is too general and we want a more specific solution for our own case:
- we want all data wrapped by immer, and in a simpler syntax.
- better support for TypeScript.
- since we are manipulating data in a mutating syntax, actions looks redundant so we discourage using it, instead we use mutation functions directly.
Rex prefers MVC pattern from early React apps. There might be performance issues since
useContext API is used and we need further investigation.
Notice: you might not need Rex when Hooks APIs is enough for reusing states. you might need Redux or some other libraries if you apps grow really complicated.
npm install @jimengio/rex
Read runnable app example at https://github.com/minimal-xyz/minimal-rex/tree/master/src .
Basically, a Rex app is an MVC app:
First step is to provide th context in root component:
To read data in child components, use function
Notice that it rerenders on every change, so there might be performance issues when data is large.
For class-based components, use
// "Clojure Atom"-like state management;;/* get latest state */;/* get latest state with a getter function */;
Rex added a log even in release mode for debugging, add run this to turn on:
windowREX_DEV_LOG = true;