Basic examples of using the ember router from the Ember.js Guides.
JavaScript CoffeeScript
Switch branches/tags
Nothing to show
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.

#Ember Router Basics Ember Icon

What is it?

Ember.js is a great Client Side MVC framework.

They are quickly reaching release 1.0 which means there are constant changes. Recently one fantastic addition is the Router which allows you to easily define the multiple states of your app.

This project is meant to help fill in the blanks on how to quickly get moving at creating an Ember app utilizing the router. The JS code is written in Coffee.


This code is built based on the guide located at Ember Application Structure.

The code is as minimal as possible in order to help the ease of setup and isolation. In order to run the examples you need Coffeescript on your machine. Once installed you can run coffee -cw js from within the root of the project. This will compile the coffee files to JS each time they change.

At that point you can open an example file in any browser which supports Ember to play around with the code.


Each example is as self contained as possible even though it requires duplicating code. All the html files have a corresponding coffee/js file.

Remember to run coffee -c js/*.coffee before attempting to use the examples.

  1. Basic-1 [html | js] The most basic use of the router with the ability to go from an index route (state) to a list of posts and finally to an individual post.
  2. Basic-2 [html | js] A slightly more sophisticated version with the ability to show Trackbacks and Comments.
  3. Basic-3 [html | js] Includes ember-data for the models.
  4. Basic-4 [html | js] Includes some form editing and submissions.

Questions, Comments

If you need help or have improvements please don't hesitate to contact me (or pull request). I am as new to Ember as most people so I don't pretend to know it all.