JSFiddle - React, Tailwind, and code Playground

by Abdull

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.0.0-rc.3/handlebars.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ember.js/1.0.0-rc.2/ember.js"></script>
<script src="https://s3.amazonaws.com/builds.emberjs.com/ember-data-latest.js"></script>
<body>
    <!-- Also OK: <script type="text/x-handlebars"> -->
    <script type="text/x-handlebars" id="application">
        This is the application template.<br/>
        {{outlet}}
    </script>
    <script type="text/x-handlebars" id="index">
        This is the index template. {{title}}<br/>
        {{#each person in model}}
        {{person.firstName}} {{person.lastName}}<br/>
        {{/each}}
    </script>    
</body>

JavaScript

Ember.LOG_BINDINGS = true;
App = Ember.Application.create({
    LOG_TRANSITIONS: true
});

App.Store = DS.Store.extend({
	revision: 12,
	adapter: "DS.FixtureAdapter"
});

App.Router.map(function () {
    this.resource("about", function () {
        this.resource("deeper");
    });
});

App.IndexRoute = Ember.Route.extend({
    model: function() {
        return App.User.find();
    },
    
    setupController: function(controller) {
        controller.set("title", "hello there!");
    }
});
App.User = DS.Model.extend({
    firstName: DS.attr("string"),
    lastName: DS.attr("string")
});
App.User.FIXTURES = [{
    id: 1,
    firstName: "Ren",
    lastName: "Hoek"
}, {
    id: 2,
    firstName: "Stimpy",
    lastName: "Cat"
}];