1# Adding Pages<a name="EN-US_TOPIC_0000001054607703"></a> 2 3- [Creating the Home Page](#section16935511143715) 4- [Creating the Details Page](#section122131729173819) 5 6## Creating the Home Page<a name="section16935511143715"></a> 7 8Upon creation of the project, the **index** page is automatically generated, which is the home page of AirQuality. [Figure 1](#fig16545205773718) shows the project directory. 9 10**Figure 1** Project directory<a name="fig16545205773718"></a> 11 12 13## Creating the Details Page<a name="section122131729173819"></a> 14 15To the details page, perform the following steps: 16 171. Right-click **pages** and choose **New** \> **JS Page** from the shortcut menu. 18 19 **Figure 2** Adding a page<a name="fig18740145216410"></a> 20  21 222. Enter the page name. 23 24 **Figure 3** Entering the page name<a name="fig48491266714"></a> 25  26 273. Confirm the creation. 28 29 The following figure shows the application project directory after the **detail** page is created. It contains a **.hml** layout file, a **.css** file, and a **.js** file \(containing service logic code\). 30 31 **Figure 4** Complete project directory<a name="fig103015177819"></a> 32  33 34 35
