andrewzey

import React, {Component} from 'react';
import createReactClass from 'create-react-class';
import PropTypes from 'prop-types';

// Problem: When writing React components, ES6 Classes present two annoyances:
//    1. No lexical pre-binding of `this` in class method references.
//      1a. Means we have to manually bind, but if we do that in render, we're
//          creating lots of extraneous anonymous functions every render
//      1b. Alternately, we would have to meticulously "pre-bind" all of our
//          class methods in the constructor (see example `MyES6Component`)

andrewzey

// Without depending on forks of redux-thunk, here's 
// how we would handle FSA actions created with redux-actions 
// using redux-thunk middleware:

import { createAction } from 'redux-actions';

const loginRequest = username => dispatch => {
  dispatch(createAction('LOGIN_REQUEST')());
  return request('/login', { username })
    .then(resp => dispatch(loginSucess(resp)))

andrewzey

// This is what a container component connected to both Reflux and Redux will
// look like as we transition to Redux

import React from 'react';
import PropTypes from 'prop-types';
import {bindActionCreators} from 'redux';
import {connect} from 'react-redux';
import * as userActions '../actions/user';

// Reflux stuff to refactor

andrewzey

import React, { Component } from 'react';

// Class Components
export default class ClassComponent extends Component {
  handleClick(event) {
    event.preventDefault();
    console.log('The link was clicked');
  }

  render() {

andrewzey

/*********************************************************
-------------------------- Haze --------------------------
Design: apopagasm
CSS: Exanurous
Bug Reports: forums.php?action=viewthread&threadid=584
Style derived from Gazelle Postmod
*********************************************************/

@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,bold);
@import url(https://cdn.rawgit.com/exanurous/haze_pth/master/theme-light.css);