gocreating/.js

## .js
// flux.js

var Alt = require('alt');

export default class Flux extends Alt {
  constructor() {
    super();

    this.addActions('ActionCreators', require('./actions/TodoActions'));
    this.addStore('TodoStore', require('./stores/TodoStore'));
  }
}


// routes.js

require('babel/register');

import React from 'react';
import {Route, DefaultRoute} from 'react-router';
var MainLayout = require('../views/layout/main.jsx');
var Home = require('../views/general/home.jsx');
var About = require('../views/general/about.jsx');
var Todo = require('../views/general/todo.jsx');

export default (
  <Route name="top" handler={MainLayout} path="/">
    <Route name="about" handler={About} path="about" />
    <Route name="todo" handler={Todo} path="todo" />
    <DefaultRoute handler={Home} />
  </Route>
);


// server.js (partial)

require('babel/register');
import errors from '../errors/';
import React from 'react';
import Router from 'react-router';
import routes from './routes';

let alt = require('../alt');
let Flux = require('../flux');

export default (app) => {
  app.use((req, res) => {
    Router.run(routes, req.path, (Handler, state) => {
      var flux = new Flux();
      var f = flux.flush();
      console.log(f);
      var element = React.createElement(Handler, {flux: flux});
      var html = React.renderToString(element);
      res.send('<!DOCTYPE html>' + html);
    });
  });

  // 404 page not found
  app.use((req, res, next) => {
    next(new errors.pageNotFound());
  });
};


// todo.jsx

import React from 'react';
import TodoStore from '../../stores/TodoStore';

export default class TodoView extends React.Component {
  static getStores() {
    return [TodoStore];
  }

  static getPropsFromStores() {
    return TodoStore.getState();
  }

  getDefaultProps() {
    return {
      todos: TodoStore.todos,
    };
  }

  render() {
    return (
      <div>
        <ul>
          {this.props.todos.map((todo) => {
            return (
              <li key={todo.id}>{todo.text}</li>
            );
          })}
        </ul>
      </div>
    );
  }
}


// TodoActions.js

import alt from '../alt';

class TodoActions {
  updateTodo(id, text) {
    return { id, text };
  }
}

export default alt.createActions(TodoActions);


// TodoStore.js

import alt from '../alt';
import TodoActions from '../actions/TodoActions'

class TodoStore {
  constructor() {
    this.bindListeners({
      updateTodo: TodoActions.updateTodo,
    });

    this.state = {
      todos: [
        {id: 1, text: 'haha'},
      ],
    };
  }

  updateTodo(todo) {
    this.setState({ todos: this.state.todos.concat(todo) });
  }
}

export default alt.createStore(TodoStore, 'TodoStore');
	// flux.js

	var Alt = require('alt');

	export default class Flux extends Alt {
	constructor() {
	super();

	this.addActions('ActionCreators', require('./actions/TodoActions'));
	this.addStore('TodoStore', require('./stores/TodoStore'));
	}
	}



	// routes.js

	require('babel/register');

	import React from 'react';
	import {Route, DefaultRoute} from 'react-router';
	var MainLayout = require('../views/layout/main.jsx');
	var Home = require('../views/general/home.jsx');
	var About = require('../views/general/about.jsx');
	var Todo = require('../views/general/todo.jsx');

	export default (
	<Route name="top" handler={MainLayout} path="/">
	<Route name="about" handler={About} path="about" />
	<Route name="todo" handler={Todo} path="todo" />
	<DefaultRoute handler={Home} />
	</Route>
	);



	// server.js (partial)

	require('babel/register');
	import errors from '../errors/';
	import React from 'react';
	import Router from 'react-router';
	import routes from './routes';

	let alt = require('../alt');
	let Flux = require('../flux');

	export default (app) => {
	app.use((req, res) => {
	Router.run(routes, req.path, (Handler, state) => {
	var flux = new Flux();
	var f = flux.flush();
	console.log(f);
	var element = React.createElement(Handler, {flux: flux});
	var html = React.renderToString(element);
	res.send('<!DOCTYPE html>' + html);
	});
	});

	// 404 page not found
	app.use((req, res, next) => {
	next(new errors.pageNotFound());
	});
	};



	// todo.jsx

	import React from 'react';
	import TodoStore from '../../stores/TodoStore';

	export default class TodoView extends React.Component {
	static getStores() {
	return [TodoStore];
	}

	static getPropsFromStores() {
	return TodoStore.getState();
	}

	getDefaultProps() {
	return {
	todos: TodoStore.todos,
	};
	}

	render() {
	return (
	<div>
	<ul>
	{this.props.todos.map((todo) => {
	return (
	<li key={todo.id}>{todo.text}</li>
	);
	})}
	</ul>
	</div>
	);
	}
	}



	// TodoActions.js

	import alt from '../alt';

	class TodoActions {
	updateTodo(id, text) {
	return { id, text };
	}
	}

	export default alt.createActions(TodoActions);



	// TodoStore.js

	import alt from '../alt';
	import TodoActions from '../actions/TodoActions'

	class TodoStore {
	constructor() {
	this.bindListeners({
	updateTodo: TodoActions.updateTodo,
	});

	this.state = {
	todos: [
	{id: 1, text: 'haha'},
	],
	};
	}

	updateTodo(todo) {
	this.setState({ todos: this.state.todos.concat(todo) });
	}
	}

	export default alt.createStore(TodoStore, 'TodoStore');