Create general structure

In this section, you will learn how to create an application, which serves as a foundation for most applications.

Prerequisites

Procedure

  1. On the side menu, click Designer.

  2. On the component library, open sap.m > Application or search for app.

    You can also add components by right-clicking the component and selecting + Add.
    app from scratch quick add

  3. Drag and drop the App (sap.m.App) component onto the HTML5 Document component in the application tree.

  4. Drag and drop the Page (sap.m.Page) component into the App component in the application tree.

    app designer app structure

    Result: You have created the general structure of your application.

  5. Select the Page component and, on the UI object pane, change the Name.

  6. On the properties pane, scroll to the title attribute and enter a title you wish.

  7. On the shell bar, click Save and Activate.

From this point onward, you have set up a foundation for the application. Now, you can incorporate any available component from the component library.

Adding resources

In the component library, expanding the Resources will display all the available components that you can add to your application, including scripts, data models, and more.

Read App Designer Resource Components for more information regarding these components.

Results

  • You have created a general structure for your application.

  • You have added an app and a page to your application.

Next steps