https://github.com/alexeyraspopov/retransmitter
Async-friendly stateful React containers
https://github.com/alexeyraspopov/retransmitter
Last synced: 3 months ago
JSON representation
Async-friendly stateful React containers
- Host: GitHub
- URL: https://github.com/alexeyraspopov/retransmitter
- Owner: alexeyraspopov
- License: mit
- Created: 2015-10-18T13:30:05.000Z (about 10 years ago)
- Default Branch: master
- Last Pushed: 2016-02-07T01:31:24.000Z (over 9 years ago)
- Last Synced: 2024-12-01T03:34:16.790Z (11 months ago)
- Language: JavaScript
- Homepage:
- Size: 163 KB
- Stars: 12
- Watchers: 2
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Transmitter
Async data fetching from different sources for React components made easy.
The project is under heavy development and the API can be changed.
Inspired by [Relay](https://facebook.github.io/relay). An attempt to create unified container solution.
***NB***: Transmitter depends on [Rx](https://github.com/Reactive-Extensions/RxJS) (used as peer dependency).
## Quick Look
```javascript
import AsyncComponent from 'retransmitter/lib/AsyncComponent';
// this component will be used for react-router
// like
export default AsyncComponent(UserInfoPage);
async function UserInfoPage({params: {userId}}) {
const user = await UsersAPI.find({id: userId});
return ;
}
```
```javascript
import Container from 'retransmitter/lib/Container';
import fromStore from 'retransmitter/lib/fromStore';
class TodosListContainer extends Container {
observe() {
return {
todos: TodosAPI.getAll(),
query: fromStore(TheStore).map(state => state.query),
};
}
render() {
const {status, todos, query} = this.state;
switch (status) {
case 'success':
return ;
case 'failure':
return ;
case 'pending':
return ;
}
}
}
```
## Introduction
Read more [in docs](docs/Introduction.md)
## Installation
Install via NPM:
```bash
npm install --save retransmitter
```
Require the lib in your code:
```javascript
import Transmitter from 'retransmitter';
```
Also you can require particular components:
```javascript
import AsyncComponent from 'retransmitter/lib/AsyncComponent';
import Container from 'retransmitter/lib/Container';
import fromStore from 'retransmitter/lib/fromStore';
```
Still using that old syntax?
```javascript
var Transmitter = require('retransmitter');
```
***NB***: If you're NPM3 user please make sure you have [these dependencies](https://github.com/alexeyraspopov/retransmitter/blob/85b82a768725f78db3750a7916690b3b483a4e23/package.json#L33-L34) installed. I'll make these dependencies as own dependencies after NPM3 will be used widely.
## Support
- [x] Promises
- [x] Observables
- [x] Falcor (since it uses Promises and Observables)
- [x] Stores (Flux, Redux)
- [ ] CSP channels
- [ ] Relay