A complete list of RxJS 5 operators with easy to understand explanations and runnable examples.
react + redux + RR
It uses https://gist.github.com/iNikNik/3c1b870f63dc0de67c38 for stores and actions.
1) create redux
const redux = createRedux(state);
2) get requireAccess func => bindCheckAuth to redux
// getComponent is a function that returns a promise for a component | |
// It will not be called until the first mount | |
function asyncComponent(getComponent) { | |
return class AsyncComponent extends React.Component { | |
static Component = null; | |
state = { Component: AsyncComponent.Component }; | |
componentWillMount() { | |
if (!this.state.Component) { | |
getComponent().then(Component => { |
import { combineReducers } from 'redux'; | |
import users from './reducers/users'; | |
import posts from './reducers/posts'; | |
export default function createReducer(asyncReducers) { | |
return combineReducers({ | |
users, | |
posts, | |
...asyncReducers | |
}); |
// Central xhr progress tracker. Used for both a global | |
// activity indicator as well as granular spinners within in a page. | |
var Progress$ = new Rx.Subject(); | |
// Make an xhr call and make a tag to track the progress ticks. | |
var users$ = Rx.DOM.ajax({ | |
method: 'GET', | |
url: 'https://api.github.com/users', | |
responseType: 'json', | |
progressObserver: Rx.Observer.create( |
Can't share the complete code because the app's closed source and still in stealth mode, but here's how I'm using React Router and Redux in a large app with server rendering and code splitting on routes.
- Wildcard Express route configures a Redux store for each request and makes
an
addReducers()
callback available to thegetComponents()
method of each React Router route. Each route is responsible for adding any Redux reducers it needs when it's loaded. (This isn't really necessary on the
I'm looking for some awesome people to join me in working on some of the Cycle.js projects I've released. Have a look at the list. If you're unsure about anything (such as wanting to help but being unsure if you're able/welcome) please contact me!
tricycle (difficulty: beginner-advanced)
Tricycle lets you try out Cycle.js in your browser. Try it out here.
Tricycle has lots of opportunities to help out and improvements would make a big difference to the community as for a lot of beginners Tricycle is their first introduction to writing Cycle code.