Bobby puppybits

I need to have templates that are stateless for PrefView. This allows the developer to write code faster and the browser can run much faster as well by not having to destory DOM, recreate a string, turn the string into DOM and place it on the document again.

I also want a straight forward way take a value from a backbone model and display something else. The standard use case is for translated text or displaying a date/time in a more readable format. Which option is better?

Template binding

// Model 
Backbone.Model.extend({ date: new Date('01/01/2014') });

	# Installation:
	# pip install selenium && curl -O http://chromedriver.storage.googleapis.com/2.8/chromedriver_mac32.zip && unzip chromedriver_mac32.zip && mv ./chromedriver /usr/local/bin/chromedriver

	# Resources:
	# ChromeDriver: https://code.google.com/p/selenium/wiki/ChromeDriver
	# ChromeDriver Getting Started: https://sites.google.com/a/chromium.org/chromedriver/getting-started
	# Selenium Python: http://selenium-python.readthedocs.org/en/latest/api.html


	from selenium import webdriver

	FROM library/node
	MAINTAINER [email protected]

	RUN mkdir /.npm
	RUN mkdir /app

	# cache (and skip if no changes) to the node_modules
	WORKDIR /.npm
	ADD package.json /.npm/package.json
	# Set the version in the cache folder to 0.

	/* Basic element to show the state of a single bank connection */

	createView({
	contextTypes: {
	triforce: React.PropTypes.object.isRequired
	},
	getDefaultProps: function(){
	return {bank: {}};
	},
	getInitialState: function(){

	<html>
	<body>
	<div id="app"></div>
	<script src="//fb.me/react-0.14.3.js"></script>
	<script src="//fb.me/react-dom-0.14.3.js"></script>
	<script>
	var el = React.createElement;
	var myView = React.createClass({
	render: function(){
	return el('h1', {color:'#F00'}, "Hello React");

	let { Router, Route } = ReactRouter;
	let App = require('App');

	// routes
	var routes = {
	path: '/',
	component: App,
	onEnter: (router, replaceWith) => {
	if (router.location.pathname === '/') {
	replaceWith(null, '/one');

	var globals = {
	React: 'react',
	ReactDom: 'react-dom',
	ReactRouter: 'react-router'
	}
	...

	{
	entry: {
	app: ['./src/bootstrap.js'],

	{
	isomorphic: true, /* Create a version to run server-side. default: false. unless running the npm run render command. */
	embed: true, /* ignore all chunking and include all images, css, JSON, JS and other assests into a single file. Great for CMS */
	bower: true, /* search for bower components as well.*/
	commonsChunk: true, /* Split code in multiple chunks to allow the user to only download code that is used on that page. */
	longTermCaching: false, /* Add a hash to the file name. Unless the hash changes, the browser wont download it again. */
	separateStylesheet: false, /* Separate CSS from JS. default: false. This means less files to download separately and allow hot swapping to work for CSS. */
	minimize: false, /* Minify code. Default for production build is true. */
	devtool: "cheap-module-eval-source-map", /* Create source maps. Dev source maps build only what is needed. Production source maps go into the /build folder by deafult so they are never deployed to the end-users. */
	devServer:

	{
	"universal": true,
	"embed": true,
	"bower": true,
	"commonsChunk": true,
	"longTermCaching": false,
	"separateStylesheet": false,
	"minimize": false,
	"devtool": "cheap-module-eval-source-map",
	"devServer": true,

	const PurchaseComplete = (props) =>
	(<div className="purchase-complete">
	<h2>Thanks!</h2>
	<p>
	Thank you for your purchase of {formatPrice(this.state.total)}.
	We’ll send you a receipt shortly.
	</p>
	<p>
	<button
	className="cta-button outlined-button"