JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://cdnjs.cloudflare.com/ajax/libs/moment.js/2.5.1/moment.min.js"></script>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.1.0/handlebars.js"></script>
<script src="http://builds.emberjs.com/release/ember.js"></script>
<script src="http://builds.emberjs.com/beta/ember-data.js"></script>
<script type="text/x-handlebars">
        <nav class="navbar navbar-default" role="navigation">
            <div class="navbar-header">
                {{#link-to "index" classNames="navbar-brand"}}
                    Emberoverflow
                {{/link-to}}
            </div>

            <ul class="nav navbar-nav">
                {{#if userSignedIn}}
                    <li>
                        {{#link-to "ask-question"}}
                            Ask Question
                        {{/link-to}}
                    </li>
                {{/if}}

                <li>
                    {{#link-to "about"}}
                        About site
                    {{/link-to}}
                </li>
            </ul>

            <ul class="nav navbar-nav">
                {{#if userSignedIn}}
                    <li>
                        <a href="#" {{action "signOut"}}>
                            Welcome, {{signedInUser.fullname}} - Sign out
                        </a>
                    </li>
                {{else}}
                    <li>
                        {{#link-to "sign-in"}}Sign In{{/link-to}}
                    </li>
                {{/if}}
            </ul>
        </nav>

        {{outlet}}
    </script>

    <script type="text/x-handlebars" id="questions">
        <div class="row">
            <div class="col-md-6">
                <h2>{{siteTitle}}</h2>
                <p>It is {{currentDate "LL"}}</p>

               ...

CSS

/*! normalize.css v2.1.3 | MIT License | git.io/normalize */

/* ==========================================================================
   HTML5 display definitions
   ========================================================================== */

/**
 * Correct `block` display not defined in IE 8/9.
 */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
    display: block;
}

/**
 * Correct `inline-block` display not defined in IE 8/9.
 */

audio,
canvas,
video {
    display: inline-block;
}

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */

audio:not([controls]) {
    display: none;
    height: 0;
}

/**
 * Address `[hidden]` styling not present in IE 8/9.
 * Hide the `template` element in IE, Safari, and Firefox < 22.
 */

[hidden],
template {
    display: none;
}

/* ==========================================================================
   Base
   ========================================================================== */

/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */

html {
    font-family: sans-serif; /* 1 */
    -ms-text-size-adjust: 100%; /* 2 */
    -webkit-text-size-adjust: 100%; /* 2 */
}

/**
 * Remove default margin.
 */

body {
    margin: 0;
}

/* ==========================================================================
   Links
   ========================================================================== */

/**
 * Remove the gray background color from active links in IE 10.
 */

a {
    background: transparent;
}

/**
 * Address `outline` inconsistency between Chrome and other browsers.
 */

a:focus {
    outline: thin dotted;
}

/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */

a:active,
a:hover {
    outline: 0;
}

/*...

JavaScript

App = Ember.Application.create({
    currentUser : localStorage.currentUser
});

App.ApplicationStore = DS.Store.extend({
    adapter : DS.FixtureAdapter
});

App.Router.map(function() {
    this.route('about');
    this.route('sign-in');

    this.route('ask-question');

    this.resource('questions', function() {
        this.resource('question', { path : '/:question_id' });
    });
});

App.Question = DS.Model.extend({
    title : DS.attr('string'),
    question : DS.attr('string'),
    date : DS.attr('date'),
    author : DS.belongsTo('user', { async : true }),
    answers : DS.hasMany('answer', { async : true })
});
App.User = DS.Model.extend({
    fullname : DS.attr('string'),
    email : DS.attr('string'),
    questions : DS.hasMany('question', { async : true })
});
App.Answer = DS.Model.extend({
    answer : DS.attr("string"),
    date : DS.attr("date"),
    author : DS.belongsTo("user", { async : true })
});

App.Answer.FIXTURES = [
    {
        id : 301,
        answer : "You can feed them from a bowl!",
        date : "2013-01-01T12:00:00",
        author : 203
    },
    {
        id : 302,
        answer : "What about a steak in a bowl?",
        date : "2013-02-02T12:00:00",
        author : 202
    }
];
App.User.FIXTURES = [
    {
        id : 201,
        fullname : "Tom Dale",
        email : "[email protected]",
        questions : [ 101 ]
    },
    {
        id : 202,
        fullname : "Tomster the Hamster",
        email : "[email protected]",
        questions : [ 102 ]
    },
    {
        id : 203,
        fullname : "Random Guy",
        email : "[email protected]"
    }
];
App.Question.FIXTURES = [
    {
        id : 101,
        title : 'How do I feed hamsters?',
        author : 201,
        date : '2013-01-01T12:00:00',
        question : 'Tomster cant eat using knife and a fork because his hands are too small. We are looking for a way to feed him. Any ideas?',
        answers : [301, 302]
    },
    {
        id : 102,
        title :...