Skip to Content

Creating and deploying SAP Fiori app with SAP Web IDE – DC Exercise (part 3 of 3)

This is the continuation of the blog presented here.

This blog has been split in 3 parts:

Link Content
Part1 Creating a new application with SAP Web IDE – Adding a new ObjectAttribute to the Detail view
Part2 Running the application with mock data – Creating run configurations
Part3 Deploying the app to HANA Cloud Platform – Deploying the app to SAP Fiori Launchpad (optional)

In this third part we are going to see how to deploy the application to the HANA Cloud Platform. As an optional step I’ll show you how to deploy the app to SAP Fiori Launchpad.


In this part of the exercise you will learn how to take the application you have built so far and deploy to the HCP. After deployment you can even run the app from HCP.

1. As a first step, since the HCP requires an index.html file to start an application, we need to create a file like this. So right click on the webapp folder inside your project and create a new file named index.html


2. Paste the following code inside the new file and save it. Just pay attention to the lines 13 and 23 where you need to properly specify the namespace (in this case “”) used for the project




  <meta http-equiv=”X-UA-Compatible” content=”IE=edge” />

  <meta charset=”UTF-8″>


  <script id=”sap-ui-bootstrap”





  data-sap-ui-resourceroots='{“”: “../webapp/”}’>


  <link rel=”stylesheet” type=”text/css” href=”css/style.css”>


  sap.ui.getCore().attachInit(function() {

  new sap.m.Shell({

  app: new sap.ui.core.ComponentContainer({

  height : “100%”,

  name : “”






  <body class=”sapUiBody” id=”content”>



3. Open the neo-app.json file and add the line

"welcomeFile": "/webapp/index.html",

just after the first line so that, when the application is launched, it knows which is the file to execute first.


4. You can even select the index.html file and click on the Run button in the top toolbar to see if the application runs fine: this means that the file is correct.

5. Select the name of the project, right click on it and choose Deploy –> Application status. We are starting from this point so that you verify that so far we have never deployed to HCP


6. Enter your HCP password and click on Login

7. As you can see here, so far we have not yet deployed the app to HCP. So, since we want to do it right now, click on Deploy


8. Here you can enter the application name, its version and you can decide if you want to activate this version automatically as soon as the application has been deployed. All the fields come pre-filled. Leave all as by default and click on Deploy


9. The application has been deployed to HPC and the first version has been created. Now you can do two things: the first one is to Open the active version of the application


10. Enter again the credentials for the ES1 system, if required, and click on Log In

11. The application is running directly on your HANA Platform. Notice the application’s URL, which is no longer tied to the SAP Web IDE tool


12. Alternatively, according to the screen shown at step 9, you can Open the application’s page in the SAP HANA Cloud Platform cockpit

13. In this case the following page is opened. Here you can administer your HANA applications. For example, here you can check the application’s URL and verify that the application is started


14. When finished, click on the Versioning tab. Here you can check all the versions that have been pushed to the HANA repository. You can activate or deactivate a specific version and do a lot of other administrative functions. You can now close this page


15. Once back here to this message you can click on the Close button. At moment we are not going yet to register the app to SAP Fiori Launchpad because we’ll do it in the next chapter


16. Refresh the SAP Web IDE tool


17. Now you can see some new fancy symbols on the left of each folder or file in the project explorer. In this case the green ball means that the file/folder has been committed and it is up to date with the one on HCP


18. If you search in the documentation you should be able to find a description for all the available decorations



Finally, you can deploy your SAP Fiori application to the SAP Fiori Launchpad in order to be consumed by users. Please ensure that you have properly subscribed to the Fiori Launchpad Portal in the Trial Landscape as described in the Prerequisites chapter on the first part of this blog.

1. Select your project in the Project Explorer, right click on it and select Deploy –> Register to SAP Fiori Launchpad


2. Enter your SCN password if required

3. Enter a description for this new application and click on Next


4. Enter a Title and a Subtitle for your tile in the FLP and click on the Browse button to choose an icon for your app


5. Type “e-learn” in the search box, select the e-learning icon and click on OK


6. The new icon is assigned to the tile. Click on Next


7. Choose the Catalog and the Group for this application. The first two selections are made automatically by the system because they are mandatory. For the third you can choose the Sample Group and click on Next


8. Click on Finish

9. Your application has been successfully registered to FLP. Now you can open the registered application in your browser


10. The application is running fine. You might need to enter the ES4 credentials again

11. Alternatively, you can open your SAP Fiori Launchpad in another browser tab


12. This is how the tile for your app looks like. By clicking on this tile you can run your application


13. Congratulations! You have successfully deployed your first app to SAP Fiori Launchpad!

You must be Logged on to comment or reply to a post.
  • Hi,

    I have been able to register my App on the trial FLP. But the thing is that although I am able to run the App using Mock data from WebIDe, I am not able to run with data OR no data comes up if I run the App from Fiori LaunchPad. Any idea what step am I missing?

    I have already configured project settings and Mock data settings.



  • Hi,

    in point 2 you write Paste the following code to the index.html.

    But I can't find a screenshot or something else with the code fro index.html.

    Can you add?



  • Hi Mounika,

    without getting more information regarding your problem it would be difficult to help you.

    I would suggest you to open a new thread in this community and mark it as a question so that you can receive a better assistance to your problem. Please also document your issue with some screenshots or logs if any.



  • Hi,

    thank you for your post, when i deploy an app on sapui5 repository, it doesn't work when i test it there. Are there any other changes that i should make in my hana app, in order to work on sapui5 repository once i test it ?

  • Hi, Simmaco,

    When i try to deploy the application by using Deploy->Register to SAP Fiori Launchpad

    Last option of part 3 excerise(1.5 Deploying the app to sap Fiori Launchpad(optional step)).

    I am getting error. "The account must have a subscription to SAP Fiori Launchpad to proceed."

    Provider Account * is disable.

    Please Suggest.

    SAP Fiori Launchpad error.JPG


    Ashok Kumar

    SAP Fiori Launchpad error.JPG
    • You need this subscription for the FLP. You can add it by using the button "New Subscription" in the HANA Cloud Platform Cockpit



      • Hi,

        Thanks. problem solved. but i stuck at another point. When registering for the SAP Fiori Launchpad, then in Assignment section, We have to give site name and this field is disable with error message "There are no sites available".

        Please suggest how to proceed.

        SAP Fiori Launchpad error.JPG


        Ashok Kumar

        SAP Fiori Launchpad error.JPG
        • 1 - Go on the FLP with the URL https://flpportal-<your_HCP_account> where <your_HCP_account> must be replaced with your account on HANA Cloud Platform

          2 - From the top right menu choose "Manage Site".

          3 - You have to create at least one Catalog and one Tile Group.

          I suggest you to carefully read the FLP documentation at:

          SAP Fiori Launchpad CPv2



          • Hi,

            Thanks. its working.

            I have just started Web IDE. Sorry for asking questions on a document blog. i will start new Discussion on this issue.

            Deeply regretted 🙁 .


            Ashok Kumar

        • Unless you are asking for clarification/correction of some part of the Document, please create a new Discussion marked as a Question.  The Comments section of a Blog (or Document) is not the right vehicle for asking questions as the results are not easily searchable.  Once your issue is solved, a Discussion with the solution (and marked with Correct Answer) makes the results visible to others experiencing a similar problem.  If a blog or document is related, put in a link.  Read the Getting Started documents (link at the top right) including the Rules of Engagement. 

          NOTE: Getting the link is easy enough for both the author and Blog.  Simply MouseOver the item, Right Click, and select Copy Shortcut.  Paste it into your Discussion.  You can also click on the url after pasting.  Click on the A to expand the options and select T (on the right) to Auto-Title the url.

          Thanks, Mike (Moderator)

          SAP Technology RIG

  • Sorry for the trouble . Was able to proceed .
    1 - Enable the Fiori Services (HANA Trial Account -> Services -> Enabled Fiori Mobile and Portal Service) .
    2 - after Step 1 , Provider Account got filled in automatically .
    3 - Also , https://flpportal-<my_account> was enabled , I was able to create the Catalog which was mandatory for the next step of deploying it to FLP .

    Many thanks Simmaco for the excellent blog .

    Rahul .