React Base Fiddle (JSX)

Starting point for creating JSFiddles with React. This uses React with Addons.

HTML

<script src="http://fb.me/JSXTransformer-0.12.1.js"></script>
<script src="http://fb.me/react-with-addons-0.12.1.js"></script>
<script src="http://facebook.github.io/react/js/jsfiddle-integration.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/react-router/0.12.4/ReactRouter.js"></script>

JavaScript 1.7

var App = React.createClass({
    render: function() {
        return (
            <div>
                <ul>
                    <li>
                        <ReactRouter.Link to="root">Home</ReactRouter.Link>
                    </li>
                    <li>
                        <ReactRouter.Link to="tabs">Tabs</ReactRouter.Link>
                    </li>
                </ul>
                
                <ReactRouter.RouteHandler />
            </div>
        );
    }
});

var Home = React.createClass({
    render: function() {
        return (
            <div>
                <h1>Home</h1>
                
            </div>
        );
    }
});

var Tabs = React.createClass({
    render: function() {
        return (
            <div>
                <ul>
                    <li style={{float: 'left', marginRight: 40}}>
                        <ReactRouter.Link to="tab1">Tab 1</ReactRouter.Link>
                    </li>
                    <li>
                        <ReactRouter.Link to="tab2">Tab 2</ReactRouter.Link>
                    </li>
                </ul>
                <ReactRouter.RouteHandler />
            </div>
        );
    }
});

var Tab1 = React.createClass({
    render: function() {
        return (
            <div>
                Tab 1 Content
            </div>
        );
    }
});

var Tab2 = React.createClass({
    render: function() {
        return (
            <div>
                Tab 2 Content
            </div>
        );
    }
});

var routes = [
    <ReactRouter.Route name="root" path="/" handler={App}>
        <ReactRouter.DefaultRoute handler={Home} />
        <ReactRouter.Route name="tabs" path="tab1" handler={Tabs}>
            <ReactRouter.DefaultRoute name="tab1" handler={Tab1} />
            <ReactRouter.Route name="tab2" path="/tab2" handler={Tab2} />
        </ReactRouter.Route>
    </ReactRouter.Route>
];

ReactRouter.run(routes, function(Handler) {
    React.render(<Handler />, document.body);
});