JSFiddle - React, Tailwind, and code Playground

by Abdull

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.0/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.0.0-rc.3/handlebars.js"></script>
<script src="https://s3.amazonaws.com/builds.emberjs.com/ember-latest.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/>
        {{#linkTo "longlist"}}Go to "longlist" route destination with scrolling to "someAnchor"{{/linkTo}}<br/>
        ------------------------------------------<br/>
        {{outlet}}
    </script>
    <script type="text/x-handlebars" id="index">
        This is the index template.<br/>
        {{#each person in model}}
        {{person.firstName}} {{person.lastName}}<br/>
        {{/each}}
    </script>
    <script type="text/x-handlebars" id="longlist">
        This is a long list with lots of breaks. Scroll down.
        <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
        <a name="someAnchor">We want to jump here.</a>
    </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("longlist");
});

App.IndexRoute = Ember.Route.extend({
    model: function() {
        return App.User.find();
    }
});

App.LonglistRoute = Ember.Route.extend({
    model: function() {
        return App.User.find();
    }
});

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"
}, {
    id: 3,
    firstName: "Mister",
    lastName: "Horse"
}];