Skip to Content
Author's profile photo Former Member

Create and access Your First Fiori Application On Cloud

Fiori Launchpad on HCP (HANA Cloud Platform) you can consume Fiori applications developed by SAP, custom UI5 applications, and custom developed apps developed with SAP Web IDE, & established UIs.

Steps to be done to consume the Fiori application build in Web IDE – – Register and logon

After login to cockpit, the URL seems something like this-

Follow the steps Develop, Deploy, Configure, and Consume application on the Launchpad –

  • UI Development:

Develop the Fiori UI on top of HCP as an “HTML5 application”.

We recommand using the Web IDE’s templates for Fiori applications.

  • OData/Gateway

You need to have an on premise Gateway system either connected to the cloud with a cloud connector or exposed outside the Firewall.

First, create your trial account on cloud from the URL – -Register & logon.

Once you logon, you can see the cockpit-


To create a small Fiori application and try launching on to the cloud follow the following steps-

  • Now open the web ide to create your HTML5 application. First go to the subscription, and you will find the subscription link for web ide. Clicking on which you will be able to load the web ide.
  • Subscriptions->click on Web ide link. An application URL is displayed click on that to open web ide.

If you want to use source control in your SAP Web IDE project, your user name and email, address must be set for your Git account.

  • Open SAP Web IDE in one of the supported browsers using the subscription URL.
  • Choose preference.PNG (Preferences) and select Git Settings.
  • Enter your email address and name.
  • Choose SAVE.

Now create you application in web ide, or use an existing template application.

    • File->New->Project from sample application->create one template application(select Basic SAPUI5 project from drop down) ->View(Xml)->Save
  • Add the code in the view and controller. For simple button to be presented in your application, add the following code in the view.

<Button text=”SUMAN” press=”doListen”/> in between the content tag.

  • Run the application to find it working.

Now Deploy your application on GIT the cloud repository. For that clone the repository and push your code into the repository.

    • Clone repository
  • Go back to cockpit, select HTML5 application->New Application, give the application name and click on the edit online icon. Now you can see directly the URL fields are filled to clone it.
  • Give out the user name, password (SCN credentials) and click “Ok”.



Result: It shows a clone is completed.

  • Now PUSH the code to the repository you created now-
    • File-> GIT->Push.

Create a version of the pushed code and activate it.

    • Click on the icon under action to create a VERSION.
    • Give the version name and SAVE. Click the icon at the same place to ACTIVATE.



To open the application created.

  • In SAP HANA Cloud Platform cockpit. Choose the HTML5 Applications
  • Select your application. Choose the Versioning
  • To display the Hello World HTML5 application, click the link in the Commit-> Message

For now building and deployment is done now it is time to configure your Launchpad, means FLP on Cloud.

            First, add subscription for the flpportal,

  • Launch the FLP configuration page to configure.

To do so – click on the Subscription in cockpit->New Subscription->Select the trial flpportal->Save.

  • Go to Trust->Edit->Principal Propagation->Enable->Save.

In the Cockpit, Click on the HTML5 Application and go to Roles. Add “TENANT_ADMIN” role by clicking on “New Role”. In addition, assign the user for the role by clicking on Assign and give the User ID (ID with which the cloud trial account is created.

  • GO to Services-> In the SAP HANA Cloud Portal-> Click on Enable. And click on “Go to Service”.
  • Create a Launchpad site. Clicking on the “Go to Service” will open the cloud portal.


  • Under tab Site Directory, Click on the
  • Enter a name and description for the site, and click Create and Open.


Now Launchpad is open where App configuration, App Assignment etc. tiles are present. To configure your application and to get it into the Launchpad, follow the steps-

     1. Click on “App Configure” –click on edit name, change type to “URL” (example URL Give Tile name in Tile icon.

     2. Content Packages- Click on the add button to add a content package-

    • Under properties tab give a name.
    • Under App tab, assign an app by clicking on, a popup occurs with all the apps. Check the check box for the app your adding to the Launchpad.
    • In the Sites tab, assign the site for the app. By clicking on the
    • In addition, in the roles tab, Assign the roles.Now click on save.

     3. Click on “Categories” tile– Assign the Category. To do that,

Go to Categories-> click on to Add new category. In Properties, give out Name and click on Apps and assign app to it, by clicking on + and check the check box of the app created and save.

Now go to App assignment and check in the Content Package and Categories, as to check the package and category is assigned.

Now go to site preview and Click on the “Show/Hide group Panel”, Click on “Tile Catalog”-> Click on + to add tile to the groups.

From the site preview, you can see your application that you configured on the Launchpad.


Final step, go to the app site and Publish it so others can use the application URL to access the application you created 🙂

Assigned Tags

      Be the first to leave a comment
      You must be Logged on to comment or reply to a post.