Book Image

Phonegap Essentials

By : Ivan Turkovic
Book Image

Phonegap Essentials

By: Ivan Turkovic

Overview of this book

Table of Contents (15 chapters)

What is PhoneGap?


In short, PhoneGap (http://www.phonegap.com/) is a distribution of Cordova. Cordova is an open source mobile framework that gives an alternative to native development and the existing application is reusable on other platforms with little or no modification to the code.

To be more precise, PhoneGap is an application framework that is capable of developing, and later building, native applications that can be deployed across different mobile platforms, thus simplifying the process and saving a lot of time. PhoneGap gives you the ability to use a single programming language—JavaScript together with HTML and CSS—to build the user interface.

With PhoneGap, any web developer can start developing mobile applications with no need to learn additional skills, apart from learning about PhoneGap's command-line interface (CLI) commands and PhoneGap's API. In a matter of hours, you can create a working prototype that can be tested directly on the user's smartphone, or built and deployed to the app store as a normal native application in all major application stores (iTunes app store, Android Apps on Google Play, Amazon Appstore, and Windows Store).

PhoneGap can be used to target support for multiple platforms from day one without needing to have another developer for another technology stack. Currently it supports the following major platforms:

PhoneGap's basic philosophy is to use the feature of the operating system that enables communication with the native code directly from the JavaScript inside the device's web browser, which is also being used as a UI rendering engine. There is no defined standard for UI rendering, so it can be developed to look like a regular page since we are defining the whole UI interface with HTML and CSS; or we can use available solutions that were specially built for the size of the screen on mobile devices.

Where can it be used?

As PhoneGap is already a stable framework and is constantly evolving, there are a lot of features that were previously available only for native applications but that can be used now inside PhoneGap. Let's list some of the major features that are being supported by the latest PhoneGap version:

  • Camera

  • Capture photos

  • Compass

  • Connection status

  • Contact list

  • Device details

  • Events sent from the native environment

  • File management

  • Geolocation

  • Multi-language support and localization

  • In AppBrowser, the ability to run another browser view inside the PhoneGap application

  • Media

  • Storage

Most of these features are available through calling native methods, but as HTML5 is progressing, many of these features are available through native web view HTML5 method calls, thus removing dependency on the native code. If you want to see what features are supported with HTML5, you can take a look at this page (http://html5please.com/). It shows support for the various mobile browsers.

What PhoneGap is not

It is not a solution that fits all needs. It depends on the features and utility of the application, which can determine if PhoneGap is fit for its needs. If you are looking to develop a graphic-intensive 3D game or application that needs to use all the processing power the device has, then probably it is not the best choice to start with. PhoneGap can easily be used for all applications that do not involve a lot of animations or complicated transitions that are not easily achieved inside the HTML and CSS environment.

There is another misconception: many developers think that PhoneGap compiles JavaScript code into native binary code, which is not true; it only packages the JavaScript, HTML, and CSS into a wrapper that runs the content inside a sandboxed web page.

Competition

There are a lot of alternatives with differing perspectives, ranging from using the web page shortcut on the home screen as an icon, to emulating the application feel, running a regular web page like an application or even building the JavaScript source code to a real native application.

Here we will take a look at four different solutions that all have advantages and disadvantages:

  • jQuery Mobile (http://jquerymobile.com/)

    Advantages

    Disadvantages

    Popular as a mobile page

    Could be too heavy for some smartphones

    A lot of plugin support

    No official paid support

    Based on jQuery

     

    Great tools, such as Theme Roller and Codiqa UI builder

     

    It is used only as the visual part of the application; it can be used with multiple JavaScript frameworks

     
  • Sencha Touch (http://www.sencha.com/products/touch/)

    Advantages

    Disadvantages

    Based on ExtJS

    Sometimes slow (client-side DOM generation)

    Full MVC framework

    No native controls

    Official paid support

    Few customization options

    Sencha Architect

    Performance

  • Titanium (http://www.appcelerator.com/titanium/)

    Advantages

    Disadvantages

    Rapid prototyping

    Increased complexity and costs

    Native UI

    Flexibility limitations

    Web oriented

    Native UI can be limiting sometimes

    Cross-platform support

     
  • PhoneGap (http://www.phonegap.com)

    Advantages

    Disadvantages

    Single code base for all platforms

    PhoneGap can be a complex framework if not understood well, thus making it less responsive

    Rapid deployment

    No default UI

    Access to native functions

    Limited access to more advanced features without additional plugins

    Offline usage

    Complex business logic

PhoneGap or Cordova?

It seems that there is a lot of confusion between these two because they share the same history and their paths diverged only recently. From the beginning the project was called PhoneGap, but once Adobe bought the company behind it, it decided to open source the majority of the code while keeping the name for its use and giving a new name (Cordova) to the open source project.

Since then, PhoneGap has been built on top of the Cordova project with some additional libraries and tighter integration with other PhoneGap tools and services; the most prominent for PhoneGap developers is PhoneGap Build, which we will go into in greater detail in the next chapter.

There is not much difference for the beginner between PhoneGap and Cordova, apart from the ability to build native applications for all major platforms from any operating system with the help of PhoneGap Build. This makes it more useful in some cases since the majority of people do not like switching from their favorite operating system.