JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://github.com/downloads/wycats/handlebars.js/handlebars-1.0.0.beta.6.js"></script>
<script src="https://github.com/downloads/emberjs/ember.js/ember-1.0.pre.js"></script>
<script type="text/x-handlebars" data-template-name="application">
    <h2>App</h2>

    <p>Choose a project, then a post, then refresh.</p>    
    
    {{outlet}}
</script>

<script type="text/x-handlebars" data-template-name="projects">
    <h3>Projects</h3>
    {{#each project in controller}}
      <h4><a {{action showProject project href=true}}>{{project.title}}</a></h4>
    {{/each}}
</script>

<script type="text/x-handlebars" data-template-name="project">
    <a {{action goBack this href=true}}>back</a>
    <h3>Project:</h3>
    <p>
        {{title}}
    </p>
    {{#each post in posts}}
      <h4><a {{action showPost post href=true}}>{{post.title}}</a></h4>
    {{/each}}
    
    {{outlet}}
</script>

<script type="text/x-handlebars" data-template-name="post">
    Post Selected: {{title}}
</script>

JavaScript

App = Ember.Application.create({});

App.Project = Ember.Object.extend({});
App.Post = Ember.Object.extend({});

App.Router = Ember.Router.extend({
    root: Ember.Route.extend({
        index: Ember.Route.extend({
            route: '/',
            redirectsTo: 'projects'
        }),
        projects: Ember.Route.extend({
            route: '/projects',
            showProject: Ember.Route.transitionTo('project.show'),
        }),
        project: Ember.Route.extend({
            route: '/projects/:project_id',
            showPost: Ember.Route.transitionTo('post'),
            goBack: Ember.Route.transitionTo('projects'),
            
            deserialize: function(router, params) {
                // or ajax to /projects/#{project_id}
                return router.get("projectsController").findProperty("id", params.project_id);
            },
            
            connectOutlets: function(router, project) {
               router.get('applicationController').connectOutlet('project', project);
            },
            
            show: Ember.Route.extend({
                route: '/'
            }),
            
            post: Ember.Route.extend({
                route: '/posts/:post_id',
                deserialize: function(router, params) {
                    // or ajax to /projects/#{project_id}/posts/#{post_id}
                    // but we don't have the project / project_id here yet as connectOutlets hasn't been called
                    // yet on the parent state
                    console.info(router.get("projectController.content")); // -> null
                },
                connectOutlets: function(router, post) {
                    router.get('projectController').connectOutlet('post', post);
                }
            })
        })
    })
});

App.ApplicationController = Ember.Controller.extend({});
App.ApplicationView = Ember.View.extend({
    templateName: 'application'
});

App.ProjectsController =...