Building Timesheet SPA with DurandalJS
Now that we have seen which tool we can use, we can start analyzing the project and how we can build it with DurandalJS.
Before looking at the routes and the components we should update the loading text we get when we load the application.
Update index.html, changing the title from Durandal to Timesheet SPA, and the message from Durandal Starter Kit to Timesheet SPA.
Then update main.js, changing the app.title value into Timesheet SPA.
Now the title of the starting page will be Welcome | Timesheet SPA.
Components of this project
To build an SPA, we have to decide which routes we will use and what we serve for each route.
Let's list the routes with a short description:
/: This is the main page for the Employee./login: This is the login page./team: This is the main page for the Team Manager
We update app/viewmodels/shell.js to put these routes; substitute the activate function into this one:
activate: function() {
router.map([
{route: "",...
