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.
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?
- Code once and generate installables for multiple platforms
- Millions of plugin support available
- Dependent on other web platform services to release new version updates
- 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
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.
Step by Step Tutorials on SAPUI5
- Journey to SAPUI5
- SAPUI5 Tutorial with WebIDE. Part I. How to Consume Custom OData in SAPUI5 Application
- SAPUI5 Tutorial with WebIDE. Part II. Routing and Navigation in SAPUI5 Application
- SAPUI5 Tutorial with WebIDE. Part III. Drop Down in SAPUI5 Applications (2 Methods)
- SAPUI5 Tutorial. Part IV with WebIDE. Routers and Routing in SAPUI5
- SAPUI5 Tutorial with WebIDE. Part V. Navigation in SAPUI5 without Routers
- SAPUI5 Tutorial with WebIDE. Part VI. Using Fragments in SAPUI5 Fiori Applications
- SAPUI5 Tutorial with WebIDE. Part VII. An ABAPer’s First SAPUI5 App in SAP WebIDE
- SAPUI5 Tutorial with WebIDE. Part VIII. Deploy my First SAPUI5 App in WebIDE
- SAPUI5 Tutorial with WebIDE. Part IX. Alternative to oModel.setSizeLimit()
- SAPUI5 Tutorial with WebIDE. Part X. Using Media Queries in UI5 Application
- SAPUI5 Tutorial with WebIDE. Part XI. An ABAPer’s Second SAPUI5 App
- SAPUI5 Tutorial with WebIDE. Part XII. SAPUI5 Basic Debugging for Beginners
- Routing and Navigation in SAP UI5 – Theoretical Explanation Part 1
- Routing and Navigation in SAP UI5 – Theoretical Explanation Part 2
- Add Delete & Save Multiple Records in SAPUI5. Part 1 – ADD
- Add Delete & Save Multiple Records in SAPUI5. Part 2 – DELETE
- Add Delete & Save Multiple Records in SAPUI5. Part 3 – SAVE
- Modularization and Large Scale Architecture in SAPUI5
- Use of Third Party (or) External Resources in SAPUI5. Part I – Overview
- Use of Third Party (or) External Resources in SAPUI5. Part II – Practical with Gauges
- SAPUI5 For ABAPers – Component Reuse with Real Time Example
- SAPUI5 for ABAPers – Consuming OData Service from SAPUI5 Application – CRUD Operations
- Trick to Send QR code or Barcode Data Remotely from Android to PC for SAPUI5 App
- Push Notification in SAP – ABAP Push Channel, ABAP Messaging Channel in SAPUI5 – a Real Time Interaction
- How to send e-mail in SAPUI5 Hybrid App?
- How to Get Weight from the Weigh Scale/Weigh Bridge Bluetooth Device using SAPUI5 Hybrid App?
- SAPUI5 – How to Change the Master List Item Selection Based on Changes in Hash Tag URL?
- SAPUI5 – How to Load a Full Screen and Navigate to Master-Detail Application? Approach 1
- SAPUI5 – How to Load a Full Screen and Navigate to Master-Detail Application – Approach 2
- SAPUI5 – How to change the background color of sap.m.Table’s cells of each row based on specific condition?
- SAPUI5 Binding Part 1- Aggregation Binding in Table Control
- SAPUI5 Binding Part 2 – Element Binding Approach 1
- SAPUI5 Binding Part 3 – Element Binding Approach 2
- SAPUI5 Binding Part 4 – Expression Binding Approach 1
- SAPUI5 Binding Part 5 – Expression Binding Approach 2
- Expression Binding Overview in SAPUI5
- SAPUI5 – Factory Functions for Beginners
- SAPUI5 – List Control Using Formatters
- SAPUI5 – How to Apply CSS in UI5 Apps?
- SAPUI5 – Hybrid App Tutorial
- SAPUI5 – Offline Application in 8 Steps
- SAPUI5 – Use of Formatter Function
- SAPUI5 – Voice Recognition
- SAPUI5 – Resource Model for Freshers