Skip to Content
Technical Articles
Author's profile photo Prashil Wasnik

Deploying UI5 Apps from SAP Business Application Studio

Hi All,

I have gone through many blog posts which explains developing SAPUI5 Application but lacking details about how to deploy the application to SAP Cloud Platform (SCP).

I struggled and learned it after lots of reading.

I would like to detail out on deploying SAPUI5 application from SAP Business Application Studio.

First thing, we have to make sure the application to test the application from SAP Business Application Studio.

To test your application, you need to make “run configuration”, switch to “Run Configuration”

Click on “Add Button” to add a new configuration

Once “Add Button” is clicked, the command pallet should bring the list of all available applications

Select the application for which you would like to test

It will create a new run configuration as shown below

Run%20Configuration

Run Configuration

Next is to click on the “Run” button, this should launch a debug console and expose some ports

There might two different ports exposed, one for the listener and for the app

Make sure you click on Open tab on “Expose and Open”

This should launch a new tab which will run the application

Please note the URL of the test application, it should look like:

https://<cloud-test-url>/<name space><module name>/index.html

https://<>/comtestprashilHTML5Module/index.html

If all works fine and you are ready for deployment on SCP, first connect to your SCP account, subaccount, and space.

Login%20to%20CF%20command%20pallet

Login to CF command pallet

There is also an alternative to login to Cloud Found using the terminal: Open the terminal and type

cf login

 

Once logged in and Org and Space are set, let’s build and deploy.

The SCP requires a Multi-Target Application Archive (*.mtar), this will be generated as an artifact of the build process and can be selected to deploy. You have to open the terminal and navigate to your project. Once there, you can run the command:

mbt build -p=cf

build%20step

 

If the build is successful, you’ll see the path of the .mtar file which is ready for deployment.

In the deployment logs, look for application host

Application xxxxxx-approuter” started and available at “xxxxxxxx-approuter.cfapps.sap.hana.ondemand.com”

Now, you can launch your application using the url as:

xxxxxxx-approuter.cfapps.sap.hana.ondemand.com/<name space><module name>/index.html

I would like to highlight that you have to modify the URL with the name space and module name to launch the index file.

Thanks

Prashil Wasnik

Assigned Tags

      8 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Raz Korn
      Raz Korn

      Hi Prashil Wasnik ,

      Excellent blog. Thanks for sharing the information.

      There are various sources of information where one can learn more on SAP Business Application Studio (SAP AppStudio).

      The first one I’d like to mention is SAP AppStudio homepage, where news and expert content are available.

      An additional source of information that provides step-by-step guidance for key scenarios is SAP tutorials. You can filter the tutorials based on topic, product, and more. A tutorial on developing SAP Fiori apps using SAP AppStudio, including build and deploy can be found here.

      Keep sharing the knowledge!

      Regards – Raz

      Author's profile photo VM Kumar
      VM Kumar

      Hi Prashil,

       

      Do you have any blog where we can build the HTML5 Module for the Services/DB created in SAP Business Application Studio, as in mine I could not fined the HTML5 folder like in this blog, if I create using YO. Please help

      Author's profile photo Søren Hansen
      Søren Hansen

      Hi Prashil

      Thanks for your blog - it saved my day.

      I realized, after reading your blog, that the URL for the local test version (via Run Configuration) actually also includes this part of the URL, which can just be copied to construct the URL for the deployed version.

      <name space><module name>/index.html

      Thanks again.

      Brgds, Søren Hansen

      Author's profile photo Prashil Wasnik
      Prashil Wasnik
      Blog Post Author

      Thanks Søren,

      I am glad that my blog has helped in some way. You are indeed correct that during local test, it does have the name space and module name and copied over.

      Warm regards,

      Prashil

      Author's profile photo Mamatha Majji
      Mamatha Majji

      Hello Prashil,

      I tried same what you mentioned in blog, but I am to unable to open the app after modifying the URL like you mentioned.

      xxxxxxx-approuter.cfapps.sap.hana.ondemand.com/<name space><module name>/index.html

      It shows like below , modified the URL according to my application after deploying app to CF it shows like this

      Could you please help me out with this issue.

      Regards,

      Mamatha M

      Author's profile photo Gnana Deepika Kadapa
      Gnana Deepika Kadapa

      Did you find any solution for this issue?

      Author's profile photo Mamatha Majji
      Mamatha Majji

      No I tried a lot, after deploying the app to open the with generated  URL in BTP Application routes.

      Author's profile photo Yergali Yertuganov
      Yergali Yertuganov

      Thanks Prashil, very helpful, seems like simple issue but without this little change can create lots of headache