Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/talkingdata/rxloop
rxloop = Redux + redux-observable (Inspired by dva)
https://github.com/talkingdata/rxloop
flux-architecture redux redux-observable rx rxjs rxloop
Last synced: 3 months ago
JSON representation
rxloop = Redux + redux-observable (Inspired by dva)
- Host: GitHub
- URL: https://github.com/talkingdata/rxloop
- Owner: TalkingData
- License: mit
- Created: 2018-05-04T10:46:54.000Z (almost 7 years ago)
- Default Branch: master
- Last Pushed: 2019-10-25T19:13:18.000Z (over 5 years ago)
- Last Synced: 2024-10-28T22:14:55.600Z (3 months ago)
- Topics: flux-architecture, redux, redux-observable, rx, rxjs, rxloop
- Language: JavaScript
- Homepage: https://talkingdata.github.io/rxloop
- Size: 980 KB
- Stars: 10
- Watchers: 10
- Forks: 2
- Open Issues: 2
-
Metadata Files:
- Readme: README-en_US.md
- Changelog: CHANGELOG.md
- Contributing: .github/contributing.md
- License: LICENSE
Awesome Lists containing this project
README
# rxloop
[![NPM version][npm-image]][npm-url]
[![npm download][download-image]][download-url]
[npm-image]: https://img.shields.io/npm/v/@rxloop/core.svg?style=flat-square
[npm-url]: https://npmjs.org/package/@rxloop/core
[download-image]: https://img.shields.io/npm/dm/@rxloop/core.svg?style=flat-square
[download-url]: https://npmjs.org/package/@rxloop/core
[δΈζ README](README-zh_CN.md)
> rxloop = Redux + redux-observable.
RxJS-based predictable state management container, ultra-lightweight "Redux + redux-observable" architecture.
## Features
* Facilitate the abstract front-end domain model, free choice of multi-state or single state tree;
* Easy to learn and use: Only four apis, friendly to Redux and RxJS;
* Isolation side effects: using the asynchronous processing capabilities of RxJS, free combination, cancel AJAX and other asynchronous calls in the Pipes;
* Extensions RxJS: rxloop can be cascaded into RxJS data pipelines, eventually distributing multiple data pipes.
## Installation
Via npm:
```bash
$ npm install @rxloop/core
```
Or yarn
```bash
$ yarn add @rxloop/core
```
Or introduced through CDN
```html
var app = rxloopCore();
app.model({
name: 'user',
state: { name: 'wxnet' }
});
```
## Hello rxloop
```javascript
import rxloop from '@rxloop/core';
// Create a globally unique app in one application
const app = rxloop();
// In the application,
// you can create multiple business models,
// such as the following user and counter models
app.model({
name: 'user',
state: { name: 'wxnet' }
});
app.model({
name: 'counter',
state: {
counter: 0,
},
reducers: {
inc(state) {
return {
...state,
counter: state.counter + 1
};
},
dec(state) {
return {
...state,
counter: state.counter - 1
};
},
},
});
// Subscribe to the status of the counter model at the View level,
// When the model state changes,
// use View layer framework-related methods to synchronize View updates,
// such as React's setState method
app.stream('counter').subscribe((state) => {
// this.setState(state);
});
// In the view layer,
// you can dispatch an action via the dispatch method
// Action updates the model state via pipes or reducers
app.dispatch({
type: 'counter/inc',
});
app.dispatch({
type: 'counter/inc',
});
app.dispatch({
type: 'counter/dec',
});
```
For more features such as asynchronous requests, cancellation requests, etc.,
you can read through the documentation π.
## Documentation
1. [Quick start](https://talkingdata.github.io/rxloop/#/basics/getting-started)
2. [Error handling](https://talkingdata.github.io/rxloop/#/basics/error-handler)
3. [Integration with RxJS](https://talkingdata.github.io/rxloop/#/advanced/integration-with-rxjs)
4. [Multi-state and single-state trees](https://talkingdata.github.io/rxloop/#/advanced/multi-state-and-single-state)
## Examples
1. [counter-basic](https://github.com/TalkingData/rxloop/tree/master/examples/counter-basic)
2. [ajax-cancel](https://github.com/TalkingData/rxloop/tree/master/examples/ajax-cancel)
3. [error-handler](https://github.com/TalkingData/rxloop/tree/master/examples/error-handler)
4. [React todolist app with rxloop](https://github.com/TalkingData/rxloop-react-todos)
## License
MIT