implement routing, and first route

assets/js/app.js

@@ -4,6 +4,21 @@ ContactManager.addRegions({
   mainRegion: "#main-region"
 });
 
+ContactManager.navigate = function(route,  options){
+  options || (options = {});
+  Backbone.history.navigate(route, options);
+};
+
+ContactManager.getCurrentRoute = function(){
+  return Backbone.history.fragment
+};
+
 ContactManager.on("initialize:after", function(){
-  ContactManager.ContactsApp.List.Controller.listContacts();
+  if(Backbone.history){
+    Backbone.history.start();
+
+    if(this.getCurrentRoute() === ""){
+      ContactManager.trigger("contacts:list");
+    }
+  }
 });

assets/js/apps/contacts/contacts_app.js

@@ -0,0 +1,24 @@
+ContactManager.module("ContactsApp", function(ContactsApp, ContactManager, Backbone, Marionette, $, _){
+  ContactsApp.Router = Marionette.AppRouter.extend({
+    appRoutes: {
+      "contacts": "listContacts"
+    }
+  });
+
+  var API = {
+    listContacts: function(){
+      ContactsApp.List.Controller.listContacts();
+    }
+  };
+
+  ContactManager.on("contacts:list", function(){
+    ContactManager.navigate("contacts");
+    API.listContacts();
+  });
+
+  ContactManager.addInitializer(function(){
+    new ContactsApp.Router({
+      controller: API
+    });
+  });
+});

index.html

@@ -61,6 +61,8 @@ <h1><%= firstName %> <%= lastName %></h1>
 
     <script src="./assets/js/app.js"></script>
     <script src="./assets/js/entities/contact.js"></script>
+
+    <script src="./assets/js/apps/contacts/contacts_app.js"></script>
     <script src="./assets/js/apps/contacts/list/list_view.js"></script>
     <script src="./assets/js/apps/contacts/list/list_controller.js"></script>
     <script src="./assets/js/apps/contacts/show/show_view.js"></script>