Skip to Content

Deploy Your First SAPUI5 App to Cloud Foundry

0 %
Deploy Your First SAPUI5 App to Cloud Foundry

Deploy Your First SAPUI5 App to Cloud Foundry

Create, build and deploy a MTA project with an integrated SAPUI5 module.

You will learn

  • How to create a MTA archive
  • Why there are modules belonging to a MTA archive
  • How to add a UI module to an archive
  • How to build a project for Cloud Foundry
  • How to deploy a project to Cloud Foundry

Step 1: Create a new multi-target application

An MTA project is a wrapper for all modules (microservices) which are part of a Cloud Foundry application.

  1. Click on the tile New Project From Template to open the wizard.

  2. Select Multi-Target Application and click Next.

  3. Choose tutorial as the project name and click Next.

  4. Keep the default values on the next screen and click Finish to confirm.

Log on to answer question
Step 2: Add an HTML5 module
  1. Right-click on the newly created project and select and select New -> HTLM5 Module to create a new module.

  2. Go with the plain SAPUI5 Application and click Next.

  3. Name the module ui, the namespace and go to the Next screen.

  4. Keep the default values on this screen and close the creation of the module with Finish.

Log on to answer question
Step 3: Adjust the quota of the HTML5 module

The mta.yaml file is the descriptor of each Cloud Foundry Project. The definition of the microservices and their runtime can be found in this descriptor. It also declares used backing services and binds them to the microservices.
Make sure the UI modules has been created properly and the quota for disk and memory are set to at least 512M.

Log on to answer question
Step 4: Build the application

Build (aka package) the project to a mtar archive to be able to deploy it to Cloud Foundry.

  1. Right-click on the project and select Build and Build with Cloud MTA Build Tool (recommended) to trigger this process.

  2. Check the console output to make sure the process started.

  3. Once the build is complete, you can see a message in the log. You should also see the generated mtar archive in the project tree.

Log on to answer question
Step 5: Deploy the archive to Cloud Foundry

Now that you created a mtar archive, you are all set to deploy the application.

  1. Right-click on the project and select Deploy and Deploy to SAP Cloud Platform.

  2. Select the proper your Cloud Foundry API Endpoint. This endpoint varies with the region you selected for your sub-account. The down-down options for Organization and Space should be populated automatically then.

  3. You will see a success message and the URL of the app in the log once the deployment finished. Open this URL in your browser to start the application.

Log on to answer question
Step 6: Login to the application

Click Open in the popup (top-right corner) to start your application.

You can also see and open running Cloud Foundry application in the SAP Cloud Platform Cloud Cockpit when you navigate to your Sub-account -> Space -> Applications.

You might need to login with the credentials of your SAP ID (the same credentials you use for the SAP Cloud Platform Cockpit and the Web IDE).


This sample application consist of a header and an empty page only. So you should see something like this:


Enter the URL of your running application:


Next Steps

Back to top