mjackson

var Firebase = require('firebase');
var baseRef = new Firebase('https://my-firebase.firebaseio.com');

function getSnapshotValue(snapshot) {
  return snapshot.val();
}

/**
 * A mixin for components that want to bind the value of a state variable
 * to the value at a Firebase ref.

jimfb

If you've reached this page, it's probably because your "parent-based and owner-based contexts differ".

As we've been iterating on React's "context" feature, we've discovered that the parent-based relationship is more useful than the owner-based relationship, so we're migrating to use a parent-based hierarchy.

In short, the owner of a component is whomever creates the component, while the parent of a component is whomever would be the containing ancestor in the DOM hierarchy. To learn more about the owner relationship, see the docs here: http://facebook.github.io/react/docs/multiple-components.html

In many cases, the owner and the parent are the same node, in which case, no further action is necessary.

wincent

2015-01-29 Unofficial Relay FAQ

Compilation of questions and answers about Relay from React.js Conf.

Disclaimer: I work on Relay at Facebook. Relay is a complex system on which we're iterating aggressively. I'll do my best here to provide accurate, useful answers, but the details are subject to change. I may also be wrong. Feedback and additional questions are welcome.

What is Relay?

Relay is a new framework from Facebook that provides data-fetching functionality for React applications. It was announced at React.js Conf (January 2015).

kugaevsky

$ cd /usr/local
$ git checkout b64d9b9c431642a7dd8d85c8de5a530f2c79d924 Library/Formula/node.rb
$ brew unlink node
$ brew install node
$ npm install -g npm@latest

sebmarkbage

var Bar1 = base => class extends base {
  componentWillMount(){
    super.componentWillMount();
    console.log('Bar1');
  }
};

var Bar2 = base => class extends base {
  componentWillMount(){
    super.componentWillMount();

sebmarkbage

import { Component } from "React";

export var Enhance = ComposedComponent => class extends Component {
  constructor() {
    this.state = { data: null };
  }
  componentDidMount() {
    this.setState({ data: 'Hello' });
  }
  render() {

ryanflorence

var pureRender = (Component) => {
  Object.assign(Component.prototype, {
    shouldComponentUpdate (nextProps, nextState) {
      return !shallowEqual(this.props, nextProps) ||
             !shallowEqual(this.state, nextState);
    }
  });
};

module.exports = pureRender;

zxbodya

Observable React elements with RxJS

Note: if you want to skip history behind this, and just looking for final result see: rx-react-container

When I just started using RxJS with React, I was subscribing to observables in componentDidMount and disposing subscriptions at componentWillUnmount.

But, soon I realised that it is not fun to do all that subscriptions(that are just updating property in component state) manually, and written mixin for this...

Later I have rewritten it as "high order component" and added possibility to pass also obsarvers that will receive events from component.

nolanlawson

// Promise.all is good for executing many promises at once
Promise.all([
  promise1,
  promise2
]);

// Promise.resolve is good for wrapping synchronous code
Promise.resolve().then(function () {
  if (somethingIsNotRight()) {
    throw new Error("I will be rejected asynchronously!");

gaearon

import React, { Component } from 'react';
import { createStore, combineReducers, applyMiddleware, bindActionCreators } from 'redux';
import { provide, connect } from 'react-redux';
import thunk from 'redux-thunk';

const AVAILABLE_SUBREDDITS = ['apple', 'pics'];

// ------------
// reducers
// ------------