Skip to Content
Author's profile photo Giel Janssen Lok

Hybrid App Cloud Build: Walkthrough + Findings

Introduction

Last oktober SAP announced that the Hybrid App Toolkit (HAT) was incorporated in the Fiori Mobile Service in SAP Hana Cloud Platform (HCP):

Starting with the October release (on or about October 9th), things start to get interesting, with the incorporation of the Hybrid Application Toolkit into the Fiori mobile service.  But it’s way more than that.  With the October release SAP will integrate Fiori mobile experience into Web IDE, with the goal of providing  simple, cloud only solution for delivering an optimized mobile experience for Fiori apps.

Especially the “Cloud Build Service” part got my attention. This service now can be used to build Hybrid Kapsel/Fiori apps in the cloud. Which sounds GREAT! ( I’m using the HAT for some time now, i’ve spent hours, if not days and dozens GB of disk space for configuring and updating my local development environment to be able to build Hybrid Fiori/Kapsel apps.)

In this blog I will try out these new features documenting the steps as a walk through and write down my findings.

Walk through – Prerequisites

The service is available in the Hana Cloud Platform Trial. This is available at https://hanatrial.ondemand.com.The Cloud Build service has dependencies with multiple HCP Services.

Activate the following Services under the Services tab in your trial account cockpit

  • Fiori Mobile
  • Development & Operations
  • Portal Service


Some of the following  stept are setup automatically when activating the services on HCP Trial Accounts. For productive tennants of HCP this may be need

Setup Fiori Mobile
1. Open the Services Page of your HCP Cockpit
2. Go to Service Configuration > Configure Fiori Mobile

3. Assign the Following Roles: Account Admin, App Catalog Admin, App Catalog Publisher, Mobile Place User by clicking on a role and then assign a user.

Check/configure roles of other Services

The following steps are executed in the same way as the previous step:

  • Make Sure you assign your s-number to the Administrator Role of the Mobile Packager Service
  • Make Sure you assign your s-number to the Administrator Role for the Development and Operations Service
  • Make Sure you assign your s-number to the TENANT_ADMIN Role for the Portal Service

Check Destination

Make Sure If the destination “mobileservices” is automatically created or add one manually (for productive HCP Accounts). You can use the following settings under Connectivity > Destinations :

Create A Portal Site ( Fiori Launchpad )

1. Open the Services Page of your HCP Cockpit.

2. Click on Create new site.

3. Enter a name and select SAP Fiori Launchpad and click Create.

4 In the Site overview click on edit, and then Publish. After it has been published set is as default.

Enable HAT
In WEB IDE Enable the Hybrid App Toolkit Plugin

1. Go to SAP Web IDE
2. Go to Tools > Preferences > Plugins
3. Enable hybrid app toolkit plugin

4. Click Save

Aquire or create Signing profile /certificate

To Build iOS apps you need to acquire your apple signing certificate.
For Android apps you can to create a signing profile using the Java keytool.

1. Open terminal

2. Use the following command:
keytool -genkey -v -keystore [your Appname].keystore -alias [your Appname Alias] -keyalg RSA -keysize 2048 -validity 10000

3. Hit enter and follow instructions. Here you have to enter your certificate details like City, Country, Organisation etc

Write down the password and keystore alias, these are needed later.

Walk through – Executing a build

Now the prerequisites are complete, we can start using the Cloud Build Service.
Keep in mind that the Cloud Build Service currently only works with a web IDE project that’s built using one of the following WEB IDE templates:

  • SAP Fiori Master-Detail Application
  • SAPUI5 Application
  • CRUD Master-Detail Application
  • SAP Fiori Worklist Application

1. Right click your project and Select Fiori Build Service > Build packaged app

2. If not done before you have to Deploy the app to HCP. Name your app and app version and click Deploy.

3. The app then needs to be Registered to the Fiori Launchpad (the portal site created previously) Click Register to SAP Fiori Launchpad and follow the steps of the wizard. (Tile Configuration and assignment)


And click on finish.

The app is now deployed to HCP and registered on the Fiori Launchpad.

4. Again Right click project and Select Fiori Build Service > Build packaged app.

Now the Configure Fiori Mobile Build Settings wizard starst.

4.1 Enter an app name (or it is automatically filled using the WEB IDE project settings parameters)
4.2 An App Icon can be selected or uploaded (this is the app icon shown on the homescreen of your phone)
4.3 Click Next

5. Select platform (1) and Signing profile (2) or create a new signing profile (3)

A new Android Signing Profile can be entered. Name the Profile (1) and use the keystorefile (2), password (3) and Alias (4) created earlier.

Click on OK. and then on Build to trigger the build proces.
The Status and logs of the build can be seen in the console. This is available in WEB IDE by clicking on the log button on the bottom right.

If the build is complete after a while, you receive an email confirmation with a downloadlink. WEB IDE wil show you a QR code that you can use to download the hybrid app to the mobile device.

You can then manage your builds in the Fiori Mobile Admin Console. (HCP Cockpit > Services > Fiori mobile > Go to Admin Console. This admin Console can be used to configure and manage SAP Mobile Place. This is the end  end user portal. It is aan Enterprise App store that can be used to browse and download Mobile apps.

The Enterprise App store (SAP Mobile Place) can be reached by going to https://trial-[YOUR Number]trial.sapmobileplace.com. (scanning the QR code wil bring you to the specific app in SAP Mobile Place.)

  

After installing the app, enter your HCP credentials to log in.


After that the app runs on your android device as a Hybrid Fiori Mobile App.

Findings

+  The integration between SAP Web IDE, and SAP Mobile Secure is great. After configuring all the prerequisites it’s easy to build a project and then download, install and run it on a device.
+   Also the integration with Mobile Place is very useful in the development proces. It’s possible to publish the app in “trial mode” to make an app available to a specific set of test users.
+   Mobile Place works great as an internal app distribution platform without the need of an Mobile Device Management platform. Apps can be downloaded to non-managed devices as well.

–  The Fiori mobile service Build Feature is only available for a couple of Web IDE templates and the app needs to be running on HCP and added to the Fiori Launchpad.
  An important feature that i’m missing is the use of Kapsel plugins. The Hybrid App Toolkit is turned off by default, but it looks like it’s still mandatory for building Kapsel Apps as it seems like it is not possible to build a Hybrid Kapsel app in Web IDE using the Cloud Build Service. There is a possibility to add plugins to your Hybrid app, but Kapsel plugins are missing.

Assigned Tags

      10 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Johannes Alberti
      Johannes Alberti

      Hi! Thanks for the great blog! Regarding your last comments on the use of Kapsel Plugins, please check the apps build and also check out the blogs here https://blogs.sap.com/tag/fiori-mobile/, the Kapsel Plugins are pre-selected based on the needs of the apps that you are building, let me know if there is a particular plugin missing and we will check this out! Regards, Johannes

      Author's profile photo Giel Janssen Lok
      Giel Janssen Lok
      Blog Post Author

      What I'm missing is the Kapsel Login pluging for the scenario where you want to build a Kapsel App that connects via SMP on-premise.

      Author's profile photo Johannes Alberti
      Johannes Alberti

      Hi Giel! Thanks for your follow-up, I understand your request now better. Building apps in the cloud that can then deployed on-premise without having a need to leverage SAP's HCP. You can build today the SAP Fiori Client itself in the cloud if you need to connect directly to on-premise from the Fiori Mobile Admin cockpit, not from within the Web IDE though. I'll note your comment definitely.

      Author's profile photo Ludo Noens
      Ludo Noens

      Hallo Giel,

      As indicated by Johannes, a number of Kapsel plugins are added to the app by default when using the cloud build service. I think most of the Kapsel plugins you can select in Device Configuration for the HAT local build are already included.

      I do think we need to make this visible in some way.

      Groeten,
      Ludo

      Author's profile photo Britt Womelsdorf
      Britt Womelsdorf

      Giel - Agreed - this is a great blog, and I appreciate you taking the time to document the steps and provide feedback.  Regarding one of the "less attractive features" you mentioned is the requirement to have the app deployed to HCP and registered to the Fiori launchpad.  Obviously this is a different approach to what the local add-on does, and I agree it would make a valuable improvement to the product.  Many of the "setup" steps you mentioned are automatically performed when you enable the Fiori mobile service (enabling this service also will enable the dev & ops service if not already enabled).  But you're correct that these steps (and maybe even a couple additional steps) will have to be followed for a productive account.  Thanks so much for your valuable feedback.

      Author's profile photo Prabh Simran Kaur
      Prabh Simran Kaur

      Hi,

      Thanks for sharing information for Fiori Mobile Applications using Hybrid App Toolkit. Does it also work with Kapsel Offline and offline capabilities of mobile apps.

      Author's profile photo Johannes Alberti
      Johannes Alberti

      Hi Prabh, absolutely, the idea here is that you can build SAP Fiori apps that can be packaged and run offline or online, just depending on the needs of the customer and the deployment option chosen. Thanks so much for your question!

      Author's profile photo Sanjoy Saha
      Sanjoy Saha

      Hi Johannes, We can package apps and those can work offline. But is there any way we can open those apps from SAP Fiori client? I tried to open client offine, but gives error.

      Regards,

      Sanjoy

      Author's profile photo Karunaharan V
      Karunaharan V

      Giel - Wonderful blog ! I just wanted to give you a quick update.

      There is a new update with HAT - Generating a new Android signing profile.

      Users need not upload the keystore file anymore. HAT has a new provision to automatically generate android signing profiles. Please look into this help doc: https://help.hana.ondemand.com/webide_hat/frameset.htm?4519a29aa8cc4f049692d4c10ddc6099.html

      May be you can update the blog with this enhancement.

      Keep blogging

      Author's profile photo Former Member
      Former Member

      Hi, Thanks the great blog. We are currently developing a Fiori app that will run in Windows tablet. Do you know if Windows OS is now being supported by SAP Web IDE? If yes, could you please provide step by step on how to integrate Fiori app?

       

      Thanks in advance!