What you will learn:

Creating a Single Page Application with ojModule and oj.router

How to use this sample:

1. Open the sample.

2. Look at the 'header' and 'footer' modules and notice how they're loaded in the index.html:

<header data-bind="ojModule: {name:'header'}"></header>

<footer data-bind="ojModule: {name:'footer'}"></footer>

3. Look again at the index.html file and notice that a router handles loading of modules.

Look at the two modules 'home' and 'people'. 

In index.html, examine the need to add a router configuration between the header and footer:

<div data-bind="ojModule: { name: router.stateId()}"></div>

Open main.js, and notice the code defining the router in the 'require' block.

4. Examine the need to add a navigation component.

Learn about needing an Oracle JET component to let the user control the router.

Open 'header.js' and 'header.html' and look at the ojNavigationList component.