https://github.com/mariuslundgard/opstore
An immutable operator-based state container for JavaScript.
https://github.com/mariuslundgard/opstore
immutable-datastructures javascript state-management store
Last synced: 10 months ago
JSON representation
An immutable operator-based state container for JavaScript.
- Host: GitHub
- URL: https://github.com/mariuslundgard/opstore
- Owner: mariuslundgard
- License: mit
- Created: 2017-04-09T09:10:37.000Z (about 9 years ago)
- Default Branch: master
- Last Pushed: 2019-05-31T23:21:32.000Z (almost 7 years ago)
- Last Synced: 2024-09-24T05:18:15.809Z (over 1 year ago)
- Topics: immutable-datastructures, javascript, state-management, store
- Language: TypeScript
- Homepage:
- Size: 189 KB
- Stars: 4
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# opstore
An immutable operator-based state container for JavaScript.
```sh
npm install opstore
```
[](https://travis-ci.org/mariuslundgard/opstore)
[](https://coveralls.io/github/mariuslundgard/opstore?branch=master)
[](https://www.npmjs.com/package/opstore)
## Features
* **Single source of truth.** Data is stored in a single, immutable atom.
* **Composable.** Keep sizes small and roll your own store by only bundling the operators you need.
* **Extensible.** Add your own operators and middleware.
* **Observable.** Subscribe to partial and/or every state change.
* **Message-driven.** Every operation is dispatched internally as a message, which enables such things as logging and
event sourcing by way of middleware.
* **Typed.** Written in TypeScript.
## Motivation
`opstore` was built to make it easier to build “vanilla” web apps. Being able to listen to state changes in certain part
of the state tree, makes it possible to create tiny render cycles that are simple to reason about and perform well.
This project is based on ideas from [Redux](http://redux.js.org/), [Redis](https://redis.io/),
[Firebase](https://firebase.google.com/) and [Yr](https://www.yr.no/en)’s source code.
## Usage
### Out of the box
```js
import {createStore} from 'opstore'
const store = createStore({count: 0})
const countRef = store.ref('count')
countRef.subscribe(count => console.log(count))
console.log(countRef.get()) // 0
countRef.incr() // 1
countRef.incr() // 2
countRef.decr() // 1
countRef.decr() // 0
```
### Composing a store
```js
import {createFactory, lpush, lremi} from 'opstore'
const createStore = createFactory({lpush, lremi})
const store = createStore({
todos: []
})
const todosRef = store.ref('todos')
todosRef.subscribe(todos => console.log(JSON.stringify(todos)))
console.log(JSON.stringify(store.get())) // []
todosRef.lpush({title: 'A'}) // [{"title":"A"}]
todosRef.lpush({title: 'B'}) // [{"title":"A"},{"title":"B"}]
todosRef.lremi(0) // [{"title":"B"}]
```
## Documentation
See [API Documentation](API.md).
## License
MIT © [Marius Lundgård](https://mariuslundgard.com)