Step 1: Create account in SAP Cloud platform by registering in the following link https://account.hanatrial.ondemand.com/#/home/welcome
Skip the above step, if you already have an account.
Step2: Enable the Portal and Fiori mobile service
In the cockpit, go to Services in the left Pane and search for Fiori Mobile, Enable the service if it’s not already enabled.
Similarly, search for Portal and enable it.
Step3: Configure the Fiori Launch Pad (FLP)
Go inside the portal service and click on Go to service to open the adminspace of Fiori launch pad.
Click on Create a new site button
Enter Site name as ESPM
Select the FIORI Launchpad template
Click on the Create button. This will open the FIORI configuration cockpit
In the Site directory browser tab, hover over the ESPM tile. In the Edit drop-down, click on Publish
Click on Publish button
Hover over the ESPM tile and from the Edit dropdown, click Set as Default.
Step 4: Configure Fiori Mobile Admin console with Signing profiles
Go inside Fiori mobile service in the SAP cloud platform cockpit and click on Go to Admin Console.
In the left pane, go to Applications > Manage Signing Profiles
Click on add New Profile button
In case of Android, you can directly generate the signing profiles, and in case of iOS you need to upload the signing certificate and provisioning profiles. Here we shall showcase for the Android platform
Fill in the form fields and click on Generate button
The Profile should be created successfully.
Also, make sure whether the Fiori server is available by clicking Account > Fiori Mobile in the left pane
Step 5: Enable Hybrid App Toolkit in SAP WebIDE
Open the SAP WebIDE from the SAP Cloud platform Cockpit (Services > SAP Web IDE)
Click on the link Go to Service
In the left pane, go to Preferences > Plugins. Search for Hybrid App Toolkit and Enable it.
Refresh the webIDE for the changes to effect.
Step1: Clone ESPM mobile app (webshop) in the WebIDE
In the left pane of SAP Web IDE, choose the Development icon
Clone the ESPM project from the github https://github.com/SAP/cloud-espm-v2 From the Menu bar, select File > Git > Clone Repository
Enter url https://github.com/SAP/cloud-espm-v2.git When the "Git ignore System files" notification popups up, click the button "Do it later"
Step2: Switch to HTML5-Webshop branch
In the right pane, select Git Pane. Click on the + button to switch branch
Select HTML5-Webshop from the dropdown and click on OK button.
Click on Reset & Checkout from the notification.
In the confirmation needed screen, click on the OK button Now, we have the ESPM Mobile (webshop) in our SAP web IDE
Step3: Deploy the application to SAP Cloud Platform
Right click the project and select Deploy > Deploy to SAP Cloud Platform
In case you get the popup to enter the login credentials for SAP Cloud platform, please fill in the details and click Login button
Select Deploy new application, Enter the Application name and Click Deploy button.
Step4: Register to Fiori Launchpad
Once successfully deployed to SAP cloud platform, notification box will give option to Register to the Fiori Launchpad
In case, if you closed it Right click the project and select Deploy > Register to SAP Fiori Launchpad
In the next popup, give application name and click next button
In the Tile configuration, choose the type static and enter Title and Subtitle for the tile and click Next button.
In the assignment, choose the Site, that you have created and published in the portal service. Click next button
Click Finish. Now you have successfully, registered to the Fiori Launch Pad. Click on OK button.
Step5: Creating Destination in the SAP Cloud platform
By following the previous steps, we have setup the ESPM front-end UI, now we need to connect this with the backend service through the Destinations Open SAP Cloud Platform Cockpit. In the left pane, select connectivity > Destinations
Export the destination from the SAP Web IDE ESPM project to your local system
Click on Import Destination in the cockpit and browse for the ESPM destination file
Replace the URL with the ESPM java application url that is running in your SAP cloud platform account and click on Save
Demo URL for test purpose – https://espmrefapps.hana.ondemand.com
For more details refer the Week 3 section of openSAP course "Developing Java-Based Apps on SAP Cloud Platform" – https://open.sap.com/courses/hcp2-1
In brief, we need to clone/download the master branch from the github (https://github.com/SAP/cloud-espm-v2), build the app with Apache Maven (mvn clean install) and deploy as Java application in SAP cloud platform by uploading the espm-cloud-web.war file that will be located in the espm-cloud-web/target folder
Click on the Check connection button to make sure whether the destination works.
Step 6: Enable Subscription for the application
In SAP Cloud Platform Cockpit, In the left pane, select Applications > Subscriptions
Under Subscribed HTML5 applications, click New subscription button.
Select provider account to the account name in which we have deployed the application.
Select Application (webshop) from the dropdown.
Give subscription name by adding sub at the end of the application name (webshopsub).
Click Save button.
Step 7: Build packaged app (APK(Android build), IPA(iOS build) for the ESPM application
In SAP Web IDE, right click the project and select Fiori Mobile > Build Packaged app
