Problems with setting up a basic Ember app

I am starting out with Ember. I installed as per the documentation. When I go to http://my-app:4200 I get 'My Application' to show. However, when I go to http://my-app:4200/boxes the view doesn't show the contents of the boxes.hbs template ("Hello there from the boxes template!") - any ideas why not (files below)?

app/router.js:

    import Ember from 'ember';
    import config from './config/environment';

    var Router = Ember.Router.extend({
      location: config.locationType
    });

    export default Ember.Router.extend().map(function(){

    });

    Router.map(function() {
      this.route('boxes', { path: '/boxes' });
    });

app/routes/application.js:

export default Ember.Route.extend({
  setupController: function(controller) {
    controller.set('title', "My Application");
  }
});

app/templates/application.hbs :

<h2>{{title}}</h2>
<div class="main">
  {{outlet}}
</div>

app/templates/boxes.hbs :

<p>Hello there from the boxes template!</p>