This webinar provided an overview of hybrid mobile application development using WaveMaker Studio. It discussed how hybrid mobile apps are built using HTML5, JavaScript, and Cordova/PhoneGap plugins to access device capabilities from within a web view. WaveMaker Studio is a visual RAD tool that allows developing these hybrid mobile apps visually without needing to write code. It generates the frontend code along with backend REST APIs and handles platform-specific packaging and deployment to create installers for iOS and Android. The webinar concluded with a live demo of building a sample mobile app using WaveMaker Studio.

1. WEBINAR / WAVEMAKER RAD

2. INTRODUCTIONS
Mayur Shah
Customer Success
Enterprise (Asia)
WaveMaker, Inc.
Headquartered in Mountain View, CA
Enterprise Software Platform for Custom App Delivery
Role: Customer Success and Product Marketing
Specialty: Enterprise Middleware and Application Integration
Past Experience: BEA Systems, Cisco Systems, Informatica

3. AGENDA
Overview
Mobile Hybrid App Development
WaveMaker Solution Architecture
Live Demo
Summary
Q&A

4. Overview of Pramati Technologies
Parent company of WaveMaker Inc.
Serving Enterprise
Customers since 1998
– Global offices (US, UK & India)
– 1200+ employees
– Over a 1,000 Enterprise customers
including 70+ from Fortune 500
– Recognized leader in Enterprise products;
First J2EE certified App Server
– Deloitte Fast 500
Visionary. 10 years.
Acquired 2012 by

5. Mobile Application Development
Mobile
Responsive
• Built With HTML5, JavaScript
• Viewed using Browser as URL
Native
Mobile App
• Built using Device Specific Programming Language
• Native Client Application on Device
Hybrid
Mobile App
• Built using HTML5, JavaScript, Cordova/Phone Gap
• Launched as Native App within WebView of device Browser
Gartner predicts that by 2016, 50% of mobile apps will be hybrid
mobile apps.

6. What is Hybrid Mobile App?
Mobile Operating System
Mobile Installer
Cordova Plugins
Web View
App built using HTML,
CSS, JavaScript
MOBILE APP
• UI and interaction, built using HTML and
JavaScript (using framework like Angular)
• Allows re-use of existing components, including UI
& services integration
WEB VIEW
Browser Component with a HTML rendering engine &
JavaScript engine run in full-screen mode within
mobile
CORDOVA PLUGINS
Access to device capabilities like Camera, Geo-
Location, Contacts etc. using JavaScript based
Cordova plugins
INSTALLER
Cross-platform installer built using Cordova build tools
using Android, IOS SDKs
Hybrid
Mobile App
Barcode
Scanner
Geo-
Location
Calendar Network Local
Storage
Camera

7. Comparison of 3 Approaches

8. What is WaveMaker Studio?

9. Visual RAD for Hybrid Mobile

10. Enterprise Needs - Mobile Applications
Security Cross Platform API and Business Logic
Data Management Standards Based Easy Maintenance

11. Device Operating
System
Cordova Plugins
Web View
App built using Angular,
Bootstrap & HTML5
Barcode
Scanner
Geo-
Location
Calendar Network Local
Storage
Camera
Hybrid Mobile App - WaveMaker
11
Backend
REST API
Web Server
Security REST API Authentication & Role-
based security
Data Model
Optimized for mobile app
consumption
Services
Highly scalable for
enterprise apps
REST API integration to
Server-side
components
Pages built with
device interaction
Build platform
installer for IOS or
Android
Build and deploy Server-
side components
(packaged as WAR) using
standards based OSS
technologies
WAR File
APK/IPA Device
Installer
Mobile Front-end
Back-end infrastructure
Hybrid
Mobile App

12. Native Look-n-feel
12
Page title for
Android
Android IOS
Tabs
Segmented
Control
Centered
Page title for
IOS
• Mobile Themes give native look-n-feel for the same page based on the
Platform (IOS, Android etc.)
• Most importantly themes adhere to design guidelines of the Platform
Search
Android
IOS
Dashboard
Search term
Dashboard
Dashboard
Search

13. Platform Specific Installer
13
Mobile Operating
System
Cordova ZIP
App built using
Web frameworks
Native Wrapper with
Cordova
Packaged Frontend
artefacts including
Cordova JS Plugins
Android APK or IOS
IPA
Create cross-platform
installer, signing with
Developer or Enterprise
Certificates
Mobile
App
Mobile
App
Mobile
App
Android
SDK Tools
IOS
SDK
XCode
Barcode
Scanner
Geo-
Location
Calendar NetworkCamera

14. WaveMaker RAD –
Develop Enterprise Apps in Days
Page Layouts
and Templates
Application
Themes
Custom Styles
Visual RAD
Automatic
Responsive
Multi Device
Standards Based
Web App
Mobile Hybrid
Enterprise
Developer
Network
Project
Collaboration
Share And
Discover APIs
Database
Designer
Web Services
Prefabs
One-Click Test
and Deploy
Auto-Publish
REST APIs
On-Prem, Private
or Public
Continuous
Integration
Release
Management
Leading Open Standards, Rapid App Development Platform
Journey of Your Application – Turbocharged

15. Live Demo!

16. WaveMaker – Product Offering
WaveMaker Enterprise
(WME)
WaveMaker Online
(WMO)

17. 17
DeploymentHorizontal scalability. Security and
use of enterprise data.
WaveMaker Cloud
Development
Component assembly
Rapid app development
Tooling to support all phases
WaveMaker Studio
IntegrationAPI-led Integration
Integration with Legacy Apps
WaveMaker Gateway
Management
Configuration, Administration and
Monitoring
WaveMaker LaunchPad
Collaboration
Increase efficiency of Application
Delivery
Enterprise Developer Network
Purpose WaveMaker Module
WaveMaker Enterprise –
Putting it all together
Enterprise Innovation Infrastructure

18. Get WaveMaker!
Sign up on WMO for FREE Trial
www.wavemakeronline.com
Request Demo of WaveMaker
www.wavemaker.com/request-demo
Request On Premise Trial :
www.wavemaker.com/request-trial

19. Q&A