Standard service - a fixed amount of work that is performed at a fixed price.  Post Service


Thursday, 13 June 2019 02:43

SAPUI5 – Hybrid App Tutorial

Written by
Rate this item
(0 votes)

There are enough tutorials flooded in the internet about SAPUI5. But in that crowded articles, it is very difficult to find a good one on Hybrid App. Hopefully,

this article would give you a good overview to kick start your Hybrid App development journey.

Pre-requite :- Cordova to be installed in your system.

Check this or this to learn “How to install the Cordova on Windows”. If you need any help in installing Cordova. Please let us know in the comments section. We can dedicate a whole new article on it.

Question 1:- We have a Fiori client; what is the use of the Hybrid App?

Answer:- Hybrid Apps can be used to connect various rest services (out of the box SAP implementation). Use SAPUI5 as front end and get data from the different services and hardware.

Question 2:- Does it run on multiple platforms?

Answer:- Code once in WebIDE and deploy it to any android, ios or windows os mobiles.

Question 3:- Advantages and Disadvantages?


  1. Code once and generate installables for multiple platforms
  2. Millions of plugin support available


  1. Dependent on other web platform services to release new version updates
  2. Need to re-import and change the code, say version 1 to 1.2 with bugs fix and deploy again to web platform services to distribute to end users

Also Read:How to send e-mail in SAPUI5 Hybrid App?

Question 4:- How to Create a Hybrid Application?

Step1:- Open WebIDE and create a sample application displaying Hello world and export it as a zip file.

Step2:- Run the following commands

Also Read:Bluetooth Device using SAPUI5 Hybrid App?

Step3:- Extract the web app content which you zipped from WebIDE in step 1 to www folder in you local machine.

Download the “resources” from tools.hand.ondemand on paste it in the www folder created above.

Step4:- Copy all content from above www folder to the android/platform_www and run the below command

Also Read:End to End ABAP on HANA Tutorials

Step5: Distribute the Installer to any web platform distributors after signing.

Once the App is installed, it would look like below.

And when you open the app, it would welcome you with Helloworld. ?

I know, it is too basic an app. But we need to learn the walk before we plan to sprint. So, play around. Try to put some more features in the app and see how it looks in the mobile device. The more you tinker with your custom Hybrid SAPUI5 app, the more you would learn.

Feel free to write your questions, feedback in the comment section below. We reply to each and every feedback.

If you want to have real time discussions and resolutions, do join our SAP Technical Telegram Group where we have more than 5000+ active SAP consultants from 6 Continents.

Please Note: You need to install Telegram App on your mobile first and then you can join the group using the above link.

Please SUBSCRIBE to SAPYard’s Youtube Channel for Free End to End SAP Video Course and Training.

Step by Step Tutorials on SAPUI5

Read 225 times

Leave a comment

Make sure you enter all the required information, indicated by an asterisk (*). HTML code is not allowed.