Time for action – bind data to the UI components

We will set the third and fourth step in the application overview checklist as in progress, as part of this exercise. We will see these steps in detail in Chapter 3, Understanding the Model Layer and Chapter 7, Working with Navigation Flows.

We will skip section 5.1 from the Show Overview page detailing Design Pages, and revisit this in the later chapters.

To expose the data to the UI layer, you need to create a page where you will bind the data from the data control that is exposed from the model layer.

1. In the Create Page section, click on Create JSF Page. This will open a Select a Project for Action pop-up window, that will ask you to select the project where you want to create the page. Click on OK to proceed.

2. The Create JSF Page pop-up window opens up to create the page.

3. Provide the name of the file as index.jspx.

4. The directory is defaulted to the public_html folder in your ViewController project directory—this is the place where you store...