November 2, 2015

Hybrid mobile app development just got simpler: Part II

This blog post is the second of two-part series on developing hybrid mobile applications. In the first part, we looked at what is a hybrid mobile app and why hybrid mobile applications are very popular within enterprises. In this part, we will see how WaveMaker can simplify hybrid mobile app development using visual RAD methodology.

Let us first understand the overall deployment of a hybrid mobile application when using WaveMaker. This will simplify our understanding of the capabilities of a hybrid mobile application developed using WaveMaker.

The figure below shows the overall deployment of a hybrid mobile application.

The Hybrid Mobile Application consists of 2 parts:

  1. Device-specific application – This part of the application gets provisioned inside the end device as an app. This app can be put on the app store/play store and downloaded on the device. This app mostly consists of HTML, Images, JavaScript, and Apache Cordova file all packaged together. For example, for an Android-based mobile, this would be .apk file.
  2. Backend application - The Server-side portion of the application (REST APIs, Custom Business logic, Database Integration logic as well as any other external service Integration) is packaged into a WAR file. The WAR file is deployed on a Java Application Server. WaveMaker provides the default Cloud to deploy the WAR file automatically.

The Device-specific client application communicates with the Backend application using REST APIs. WaveMaker RAD enabled visual drag and drop development of the entire hybrid mobile application (client and the server part). This model simplifies the process of building, testing and running hybrid applications. WaveMaker RAD takes away the heavy lifting of integrating to databases, custom business logic, legacy systems as well as any cloud service that you may need for your mobile application. You also can easily configure security (authentication, authorization) and backend logic for the mobile application.

Hybrid mobile app development using WaveMaker

To get started, you can choose whether to build a responsive web or hybrid mobile application. The reason they are different is you will get UI layouts, Templates, Widgets, etc. specific to the mobile device. Once you develop the application for one format, you cannot transform to the other.

With WaveMaker 8, now you can apply the same Visual Drag and Drop approach to Hybrid Mobile Application development. You get same the simplicity of drag and drop, readymade HTML5 widgets, device-specific widgets, seamless binding, and a 1-Click device-specific build.

WaveMaker RAD provides many device integrations that make it easier to develop hybrid mobile apps. These are,

  1. Device Widgets: You can just drag and drop these widgets on the Mobile Canvas and you have the ability to integrate device capabilities into your application. Like any other WaveMaker App, you can then associate data to these widgets using the 'Data Binding' concept.
  2. Device Templates: You have now the ability to choose specific templates for the hybrid Application. WaveMaker provides a number of out-of-box mobile templates that you can choose to use. You also can develop your own custom mobile template using the Template Builder provided in the platform. These out-of-box templates are designed with the right layout, pixels, coloring scheme that resembles the mobile device.
  3. Device Variables: In addition to the Device widgets, WaveMaker also has pre-defined device variables that can be used to bind mobile data to widgets. The out-of-box variables provided is for fetching data from,“calendar”, “camera”, “contacts”, “device”, “file” and “scan”. See below the device-specific variables provided for mobile hybrid applications.
  4. Device Themes
    WaveMaker provides Device specific look and feels styling for your apps using Themes. There are Themes specifically for each type of device.

Great, so it is easy to Develop, what about my Device specific Build?

WaveMaker provides the ability to quickly build and download the hybrid application to the target device. A ready-made build infrastructure is automatically provisioned for the developer. The developer just needs to configure the mobile configuration required for the build.

When clicking on the Build button, WaveMaker automatically packages the required HTML, CSS, JS, and Apache Cordova files to create the device-specific App file. In the case of an Android device, this is a .apk file. Once the build is done, an automatic email is sent to the developer, with the link to the device-specific application file (.apk for Android), as shown below.

The developer just needs to download this file on the target device and the application is up and running on the device.

Isn't this great, you now have a full-fledged Visual RAD platform to greatly simplify and speed up Mobile Hybrid Application development and deployment. Log in to wavemaker online and start developing your own Hybrid Mobile App.