Search icon CANCEL
Subscription
0
Cart icon
Your Cart (0 item)
Close icon
You have no products in your basket yet
Save more on your purchases! discount-offer-chevron-icon
Savings automatically calculated. No voucher code required.
Arrow left icon
Explore Products
Best Sellers
New Releases
Books
Videos
Audiobooks
Learning Hub
Free Learning
Arrow right icon
Phonegap Essentials
Phonegap Essentials

Phonegap Essentials: Use PhoneGap to build cross-platform mobile applications quickly and efficiently

Arrow left icon
Profile Icon Ivan Turkovic
Arrow right icon
NZ$51.99
Full star icon Full star icon Full star icon Full star icon Empty star icon 4 (3 Ratings)
Paperback Sep 2015 178 pages 1st Edition
eBook
NZ$14.99 NZ$40.99
Paperback
NZ$51.99
Subscription
Free Trial
Arrow left icon
Profile Icon Ivan Turkovic
Arrow right icon
NZ$51.99
Full star icon Full star icon Full star icon Full star icon Empty star icon 4 (3 Ratings)
Paperback Sep 2015 178 pages 1st Edition
eBook
NZ$14.99 NZ$40.99
Paperback
NZ$51.99
Subscription
Free Trial
eBook
NZ$14.99 NZ$40.99
Paperback
NZ$51.99
Subscription
Free Trial

What do you get with Print?

Product feature icon Instant access to your digital eBook copy whilst your Print order is Shipped
Product feature icon Paperback book shipped to your preferred address
Product feature icon Download this book in EPUB and PDF formats
Product feature icon Access this title in our online reader with advanced features
Product feature icon DRM FREE - Read whenever, wherever and however you want
OR
Modal Close icon
Payment Processing...
tick Completed

Shipping Address

Billing Address

Shipping Methods
Table of content icon View table of contents Preview book icon Preview Book

Phonegap Essentials

Chapter 1. Get up and Running with PhoneGap

PhoneGap has brought a new paradigm to the field of mobile application development since its inception. It has tried to replace the old, fragmented mobile platform development, where each mobile device is developed using different programming languages and software patterns, with simple JavaScript and HTML.

Each new major version has managed to improve the performance and support features that were available only to native devices before. PhoneGap has come so far that most of the basic needs for a mobile application can be achieved with it, without writing a single line of code in the native language.

In this chapter, we will cover the following sections:

  • A brief history
  • What is PhoneGap?
  • Setting up a local development environment

Let's get started with a quick introduction to PhoneGap.

A brief history

In 2007, Apple introduced its first smartphone: the iPhone. It changed the mobile phone industry forever. iPhone was the first smartphone that provided a browsing experience comparable to desktop web browsing. Many web pages were trying to mimic iPhone's look and feel for mobile use. Originally, iPhone didn't support third-party native apps. Many tried to create hybrid applications by hosting them on web servers. The application was running inside the Safari browser.

iPhone's immense success was noticed by competitors, especially Google. Google had planned to introduce Android before iPhone. Android back then was like Blackberry OS and interacted through the keyboard, but, seeing the success of iPhone, they decided to ditch the keyboard and open source it. Android had the ability to develop native applications. Apple allowed the development of native applications with the next version of iPhone. Competing platforms have different development stacks. It requires an extra amount of work to make them work on many popular platforms. This makes even the simplest application development across multiple platforms difficult. After some time, most platforms offered the ability to communicate between inline web browsers and the application's native code. With this, compiled hybrid applications became a reality. You could create the whole application with JavaScript, HTML, and CSS, and access native libraries through native code. It wasn't the best solution, since you needed to write native code that supports it, but that was going to change with the arrival of PhoneGap.

PhoneGap was started as a project at the iPhoneDevCamp event in 2008. It was started by a team of developers wanting to simplify cross-platform mobile development. Until then, it was easy to create applications for a single platform but there was no tool to manage it for multiple platforms. In the beginning, the idea was to create project templates that could be reused inside Xcode for iOS or Eclipse for Android to develop hybrid applications. Shortly afterwards, PhoneGap supported Blackberry OS. The team behind the project was from Nitobi Software company. They started to work on PhoneGap as a more serious tool for development. It began to be used for a full development cycle including preparing builds for deployment to the app stores or for using inside enterprises. PhoneGap won the People's Choice Award at O'Reilly Media's 2009 Web 2.0 Conference. Prior to Apple's developer license agreement version 4.0, the rules for submitting PhoneGap applications to the Apple app store were not clear and many apps were rejected for that reason. After updating the developer license agreement, Apple has confirmed that the framework has been approved for submitting PhoneGap applications.

In 2011, there were two important items of news for PhoneGap development. Adobe decided to acquire Nitobi Software as a part of the strategy for moving away from Adobe Flash on mobile devices. The other news was that they were going to open source PhoneGap and contribute it to the Apache Foundation. Since being contributed to the Apache Foundation, it changed to Apache Callback, Apache DeviceReady, and finally Apache Cordova (http://cordova.apache.org). After Adobe acquired it, the team behind PhoneGap worked full time on the project and the updates are being delivered on a monthly basis.

The PhoneGap brand has been preserved by Adobe. PhoneGap is now a fork of Apache Cordova with some extra features. PhoneGap and Cordova were basically identical until the release of version 2.x. After that, the development went into simplifying project creation. A command-line interface was created for most common actions, and the core features were separated into numerous plugins. The new process simplified the creation and installation of new plugins.

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.

Setting up a local development environment

Since this book covers all major operating system platforms, before we start to learn more about PhoneGap and its useful features we need to prepare the development environment. The PhoneGap website (http://phonegap.com/install/) has instructions on how to install it, which should be fairly easy to achieve. However, in reality, each platform requires us to install additional libraries and simulators to be able to run them for different mobile platforms.

There are two ways to develop PhoneGap applications. Until PhoneGap introduced the command-line interface (CLI), the only way was to develop plugins for the integrated development environment (IDE), such as Xcode or Eclipse. With the introduction of the CLI, it was possible to develop PhoneGap mobile applications with PhoneGap SDK inside your favorite text editor or integrated developer environment. In this book, we are going to use the latter option; since most developers have different opinions about editors, it is better to stay neutral on this topic.

However, for this book I will be using Sublime Text 3 (http://www.sublimetext.com/3), a plain text editor that is one of the most popular choices nowadays and has numerous plugins and extensions to work with. Since it supports Windows, Mac OS, and Linux, it won't be included in the installation process for a specific operating system. On the provided link, you can download the text editor and install it with the provided information. Sublime Text 3 can be used for free for as long as you like (you will be prompted to buy it from time to time); this is a fully working editor without any limits. But I would strongly advise you to get the full version and support the people behind it since they have done a great job and it only costs $70 and doesn't have restrictions on the number of machines for a single user.

There is a great free alternative to Sublime Text called Atom editor, which is open source and available at the following page: https://atom.io/. It will be sufficient to do the work but it doesn't come with lot of plugins like Sublime Text.

In the following pages, there will be instructions on how to cover the installation process for the three most popular operating systems that developers are using: Windows, Mac OS, and Ubuntu. For other Linux distributions, it should not be too hard to adapt the Ubuntu installation process, especially if you are using Debian. Let us get started.

Mac OS

In the beginning, PhoneGap started as a way to create iOS applications with JavaScript and HTML to create a fully functional iOS application without writing a single line of code in Objective-C. To get started for Mac OS, there are few more steps than the instructions on the PhoneGap website (http://phonegap.com/install/) are telling us to perform. We will need to install simulators for supported mobile devices. On this platform, we will install support for iOS and Android development. For installation purposes, it is assumed that this is being installed as a clean installation so, if you already have some of the libraries installed, it is advisable to update them to the latest version to make sure they are working properly. For Mac OS, the latest operating system version (Yosemite) will be used.

The easiest way to install the various Unix tools and open source software onto Mac OS X is via a package manager but unfortunately OS X does not come with one; however, there are some alternatives that we can use instead. We are going to use Homebrew (http://brew.sh/).

If you already have your own package manager preference or you want to compile it from the source code, you are encouraged to use the latest version for the library.

Before installing Homebrew, we need to install Xcode (https://itunes.apple.com/au/app/xcode/id497799835?mt=12) so we can build and run applications in the iOS simulator:

Mac OS

To install the Xcode component, perform the following steps:

  1. Download the image and then drag the Xcode icon into the Applications folder. Before proceeding with the next step, you need to open Xcode and agree to the license, as it needs to install additional components:
    Mac OS
  2. After the components are installed, you need to install the Xcode command line tools with the following command:
    xcode-select —install
    
  3. This will open the following prompt to install the required tools. Select Install to install the required libraries, and wait until everything is successfully installed:
    Mac OS
  4. To download and install Homebrew, run the following installation script on the command line. It will ask you for a few details before proceeding, but you can leave the default values in use, unless you have a specific reason to change them, then wait for the script to finish:
    ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
    
  5. After successful installation of Homebrew, please run the following command to check if the installation was successful:
    brew doctor
    
  6. Before installing any additional libraries through Homebrew, let us run update to get a list of the latest versions of the libraries:
    brew update
    
  7. Since PhoneGap is a Node.js application, we will need to install a working version of Node.js. With Homebrew, the process of installing additional libraries is easy; just run the following command:
    brew install node
    
  8. To be able to build and run applications in the Android simulator, you need to install the full Android software development kit (SDK) by running the following command:
    brew install android-sdk
    
  9. Add the Android SDK path to be used with PhoneGap with the following commands:
    vi ~/.bash_profile
    
  10. At the end of the file, add the following line:
    export ANDROID_HOME=`brew --prefix android`
    
  11. Save and close the file and run the following to reload the newest updates:
    source ~/.bash_profile
    
  12. The following command will launch the Android SDK manager window and you should see the recommended libraries already preselected:
    android sdk
    
    Mac OS
  13. Click the Install 2 packages button and accept all the agreements for the required libraries. Then press the Install button:
    Mac OS
  14. When it's finished, quit the Android SDK Manager application.
  15. Besides Android SDK, we need to install Apache Ant in order to be able to build and run the applications inside Android Simulator. Run the following command:
    brew install ant
    
  16. In order to emulate an Android device, we need to first create a virtual device. Run the following command to set up the default Android virtual device:
    android avd
    
  17. This will launch the Android Virtual Device Manager. Click the Device Definitions tab and select a sample device. From the list select the Nexus 5 profile, and press the Create AVD button as shown in the following screenshot:
    Mac OS
  18. Fill out the device profile and click OK:
    Mac OS
  19. Close the Android Virtual Device Manager window.
  20. Next we need to install the required libraries (to be able to build and run applications in the iOS simulator) by installing the Node.js library to control the iOS simulator directly from the command line:
    sudo npm install -g ios-sim
    
  21. When all the required libraries and tools are installed, install PhoneGap with the following command:
    sudo npm install -g PhoneGap
    
  22. To verify we can build and launch applications in both simulators, let us create and run a quick sample application by running the following command:
    PhoneGap create hello com.example.hello HelloWorld
    cd hello
    
  23. This creates a basic sample application. Next we need to verify it works on the Android and iOS simulator.
  24. For iOS we need to open the iOS simulator and run the application. Run the following command:
    phonegap run ios --emulator
    
    Mac OS
  25. To test if everything is working well on Android, we are going to run the following command, which should run Android Device Simulator as we selected before:
    phonegap run android —emulator
    
    Mac OS

Linux

Linux is well known for having multiple distributions that have different ways of installing new libraries on it. For this book, we are going to use one of the most popular distributions: Ubuntu. Ubuntu is built on top of Debian so installing on both of them shouldn't be much different. As for the other distributions, it shouldn't be too hard to adapt the following commands for these environments. Perform the following steps:

  1. First we need to fully update Ubuntu to avoid any issues while installing the required libraries:
    sudo apt-get update sudo apt-get install build-essential
    
  2. Next we install some libraries that are required to finish the installation:
    sudo apt-get install python-software-properties python g++ make
    
  3. Since PhoneGap is a Node.js application, we will need to install the latest working version of Node.js. Make sure you install Node.js and not node, which is a different library:
    sudo apt-get install nodejs
    
  4. While that's all you need to do to install Node.js, there is a small detail that you need to take care of. When Ubuntu installs the package, it names the Node.js executable nodejs. The problem is that many applications, including PhoneGap, expect the executable to be named node. To fix this inconsistency, simply create a symlink named node that points to Node.js as follows:
    sudo ln -s /usr/bin/nodejs /usr/bin/node
    
  5. Next we need to install additional libraries for Node.js:
    sudo apt-get install npm
    
  6. Finally, we can install the PhoneGap library by running the following command:
    sudo npm install -g phonegap
    
  7. Now we need to install the Ant tool, required to build and run Android applications:
    sudo apt-get install ant
    
  8. Since Android uses the Java language, we will need to install Java JRE and Java JDK, which supports it:
    sudo apt-get install openjdk-7-jre
    sudo apt-get install openjdk-7-jdk
    
  9. Now it is time to install the actual Android SDK. Run the following command:
    wget http://dl.google.com/android/android-sdk_r24.0.2-linux.tgz
    tar zxvf android-sdk_r24.0.2-linux.tgz
    
  10. Let us move the content of the Android SDKs to a more appropriate location:
    sudo mv android-sdk-linux/ /opt/android/
    
  11. Now we need to set up paths to be executable from anywhere inside the terminal. Let us open the vi editor:
    vi ~/.bashrc
    
  12. Enter the following lines at the end of the file:
    export ANDROID_HOME="/usr/local/android-sdk-linux/tools"
    export ANDROID_PLATFORM_TOOLS="/usr/local/android-sdk-linux/platform-tools"
    export PATH="$PATH:$ANDROID_HOME:$ANDROID_PLATFORM_TOOLS"
    
  13. To use the command in the same terminal, you need to run the following command:
    source ~/.bashrc
    
  14. Now that we have set up the Android SDK environment, we need to run the configuration application to download the required libraries and emulators. Run the following command:
    android
    
  15. Execute Android from the shell. This is a good first test to make sure you've done everything right up to now. If you get an error, rerun through the preceding steps and make sure that you've installed all the requirements and added your environment variables correctly.

    If there is no error, you should see that executing Android opens up a kind of package manager that you can use to install different Android components. By default, a certain number of these will be pre-selected for installation. Leave them as is and, in addition, tick the box next to the entry named API 4.4.2 (API 19). Once you've done that, download and install everything by accepting the license, as shown in the following screenshot:

    Linux
  16. Next we need to confirm installation of the requested packages, by clicking on Install:
    Linux
  17. The last step before trying it out is to create an Android emulator that will emulate a working Android device on your computer. By default no emulator is set, so we need to set it manually by running the following command:
    android avd
    
  18. After opening the window, we should see an empty list. Switch to the Device Definitions tab and press Create AVD:
    Linux
  19. For our emulator, we will use the following settings:
    Linux
  20. After we have installed all the required libraries and the emulator required to run the Android app, we can finally create our first test application by running the following command:
    phonegap create hello com.example.hello HelloWorld
    cd hello
    
  21. To verify everything is working fine, you need to run the emulator:
    phonegap run android —emulator
    

Windows

If you want to develop and test applications for Windows phones, you will need to have a working Windows computer to hand because you can only run them there.

There are multiple versions of the Windows operating system but it should be fairly easy to use any of them by carrying out the following instructions, since most of the libraries and applications are available as an installer. Thus, you can simply go ahead with the installation process and the only thing you need to do manually is to set the environment variables to be reachable from any command prompt.

The easiest way is to create a Development directory in your home directory (C:\Users\yourusername\Development). For ease, you might want to drag that folder into the Favorites list in Explorer, too. We will add all the source code we work on to the examples there.

Let us start with the stable Java SE Development Kit. Perform the following steps:

  1. Download the latest available version that works on your computer from http://www.oracle.com/technetwork/java/javase/downloads/index.html.
  2. Run the downloaded file and go through the following steps:
    Windows
  3. You need to make sure that you have the following paths set in your Advanced System Properties Environment Variables.
  4. You need to set the path to be visible so it can be run as a command from the command prompt. Navigate to Control Panel | System and Security | System. There you need to click on the Advanced tab, as shown in the following screenshot:
    Windows

You will need to press the Environment Variables button and update system variables with the following data:

  1. Create a new system variable:

    JAVA_HOME with value: C:\Program Files\Java\jdk1.7.0_75

  2. Next we need to edit an existing variable:

    Path and add the following value ;%JAVA_HOME%\bin

  3. Add the preceding line at the end of the remaining paths and make sure it is preceded by a ; (semicolon). It is important not to forget it:
    Windows
  4. You can test it by running the following command:
    java
    
  5. In the command prompt, if you see the regular Java help text printout response then the Java environment is all set. Close the command prompt.
  6. Next we need to download Android SDK for Windows, which is available as an automated installer. Download the latest SDK version from: https://developer.android.com/sdk/index.html.
  7. Make sure you do not use the default proposed folder since you might have some problems with accessing folder content in the following steps. Instead, set the installation location to C:\Android\android-sdk.
  8. We now need to go back to add an additional environment variable in the Android SDK location as we did before for Java SDK.
  9. First we add a new system variable:

    ANDROID_HOME with value C:\Android\android-sdk

  10. Next we need to edit the existing variable:

    Path and append additional value ;%ANDROID_HOME%\platform-tools;%ANDROID_HOME%\tools

  11. Again, do not forget to add a ; (semicolon) at the beginning.
  12. Next we need to open another command prompt to check whether it is installed properly. Run the following command:
    android
    
  13. This will open the Android SDK Manager, where we will need to select which Android version to download; this is going to be used inside the emulator:
    Windows
  14. After selecting the packages ticked in the screenshot, you need to click Install 7 packages and wait until they are installed.

We need to install the git command (used for many libraries) and later plugins that we will require to make it work with PhoneGap. Perform the following steps:

  1. Download and install the git installer from http://git-scm.com/download/win.
  2. You should open the installer, follow the instructions, and select the predefined values. After installation, repeat the same process with system variables and add the variable GIT_HOME with a value C:\Program Files\git. Add additional information to the existing PATH by appending: ;%GIT_HOME%\bin.
  3. Again, to test whether it is working, run the git command in the newly opened command prompt.
  4. Ant is a tool that is required by Android to build all the code into the Android application package. You need to download and install Ant from: http://www.us.apache.org/dist/ant/binaries/. Select the latest version that has the .zip extension.
  5. Unzip the content into the folder C:\Android\apache-ant-1.9.4.
  6. Again set the system variables with the creation of a new variable ANT_HOME with the value C:\Android\apache-ant-1.9.4. Update the existing Path variable PATH by appending ;%ANT_HOME%\bin.
  7. In the next step, we will install the latest version of Node.js from the http://nodejs.org as an installer. After it is downloaded, run the downloaded file, which will guide you through the process. The Installer should set all the path variables you need to run it. To confirm the installation worked, run the node command in the command prompt. It will open the node console, which you can close by pressing Ctrl + C twice.
  8. The last step is to install the PhoneGap library by running the following command at the command prompt:
    npm install -g phonegap
    
  9. To verify we have installed PhoneGap properly, we simply run the phonegap command at the command prompt; this should return details about PhoneGap.
  10. There is one last thing we need to do before running the test project. We need to create Android Emulator Start by running the following command:
    android avd
    
  11. By default, there are no emulators, so we need to create one before starting. Press Create… which will open a window to create a new emulator. Enter the following settings and press OK:
    Windows
  12. A new emulator should be listed. Close the application.
  13. To verify we can build and launch the application in the simulator, let us create and run a quick sample application by running the following command:
    phonegap create hello com.example.hello HelloWorld
    cd hello
    
  14. This creates a basic sample application, so next we need to run it to verify it works on the Android simulator.
  15. To test that everything is working well, we are going to run the following command that should run Android Device Simulator, as selected before:
    phonegap run android —emulator
    
  16. You should see it running an example.

Summary

In this introductory chapter we covered a lot. We got a quick overview of what, as a framework, PhoneGap is and is not. Before we start to do any real work with PhoneGap, we need to have installed all the required tools that we covered in this chapter in detail, for all three major platforms.

After finishing this chapter, you should have a fully functional setup to start developing PhoneGap applications on your favorite operating system.

In the next chapter, we will cover the support for different platforms and the features that each platform supports. We will come to understand what PhoneGap Build is and how to test usability on native devices.

Left arrow icon Right arrow icon

Description

PhoneGap is an open source framework that allows you to quickly build cross-platform mobile apps using HTML5, JavaScript, and CSS. PhoneGap Build is a cloud service that allows you to quickly develop and compile mobile applications without SDKs, compilers, and hardware. PhoneGap allows you to use its existing plugins or create new ones, as per your requirements, to enhance your mobile applications. Starting by installing PhoneGap, you’ll develop an app that uses various device capabilities through different plugins and learn how to build an app in the cloud with PhoneGap’s Build service. You’ll discover how to use PhoneGap to create an application view, along with how to use a camera, geolocation, and other device capabilities to create engaging apps. Next, you’ll augment applications with PhoneGap's plugins using minimalistic code. You’ll explore the app preparation process to deploy your app to the app store. By the end of the book, you’ll have also learned how to apply hybrid mobile UIs that will work across different platforms and different screen sizes for better user experience.

Who is this book for?

If you are a mobile application developer in iOS or Android, or a web application developer who wants to learn how to make cross-platform mobile applications using PhoneGap, this book is perfect for you. To make the most of this book, it will be helpful if you have prior knowledge of HTML5, CSS, and JavaScript.

What you will learn

  • Get to grips with the fundamentals of PhoneGap to get started
  • Set up a development environment for Linux, Mac OS, and Windows
  • Use Cordova CLI, workflows, and Plugman Plugin manager to create mobile applications efficiently
  • Understand the development workflow to create native crossplatform mobile applications
  • Embed plugin support to transition to PhoneGap or use it to enhance existing applications
  • Improve your mobile development knowledge using objectoriented programming (OOP), reusable components, and AJAX closures
  • Be empowered to build your own mobile apps quickly with ease
  • Discover tips and tricks to make app development fun and easy
Estimated delivery fee Deliver to New Zealand

Standard delivery 10 - 13 business days

NZ$20.95

Premium delivery 5 - 8 business days

NZ$74.95
(Includes tracking information)

Product Details

Country selected
Publication date, Length, Edition, Language, ISBN-13
Publication date : Sep 07, 2015
Length: 178 pages
Edition : 1st
Language : English
ISBN-13 : 9781785284687
Category :
Languages :
Tools :

What do you get with Print?

Product feature icon Instant access to your digital eBook copy whilst your Print order is Shipped
Product feature icon Paperback book shipped to your preferred address
Product feature icon Download this book in EPUB and PDF formats
Product feature icon Access this title in our online reader with advanced features
Product feature icon DRM FREE - Read whenever, wherever and however you want
OR
Modal Close icon
Payment Processing...
tick Completed

Shipping Address

Billing Address

Shipping Methods
Estimated delivery fee Deliver to New Zealand

Standard delivery 10 - 13 business days

NZ$20.95

Premium delivery 5 - 8 business days

NZ$74.95
(Includes tracking information)

Product Details

Publication date : Sep 07, 2015
Length: 178 pages
Edition : 1st
Language : English
ISBN-13 : 9781785284687
Category :
Languages :
Tools :

Packt Subscriptions

See our plans and pricing
Modal Close icon
$19.99 billed monthly
Feature tick icon Unlimited access to Packt's library of 7,000+ practical books and videos
Feature tick icon Constantly refreshed with 50+ new titles a month
Feature tick icon Exclusive Early access to books as they're written
Feature tick icon Solve problems while you work with advanced search and reference features
Feature tick icon Offline reading on the mobile app
Feature tick icon Simple pricing, no contract
$199.99 billed annually
Feature tick icon Unlimited access to Packt's library of 7,000+ practical books and videos
Feature tick icon Constantly refreshed with 50+ new titles a month
Feature tick icon Exclusive Early access to books as they're written
Feature tick icon Solve problems while you work with advanced search and reference features
Feature tick icon Offline reading on the mobile app
Feature tick icon Choose a DRM-free eBook or Video every month to keep
Feature tick icon PLUS own as many other DRM-free eBooks or Videos as you like for just NZ$7 each
Feature tick icon Exclusive print discounts
$279.99 billed in 18 months
Feature tick icon Unlimited access to Packt's library of 7,000+ practical books and videos
Feature tick icon Constantly refreshed with 50+ new titles a month
Feature tick icon Exclusive Early access to books as they're written
Feature tick icon Solve problems while you work with advanced search and reference features
Feature tick icon Offline reading on the mobile app
Feature tick icon Choose a DRM-free eBook or Video every month to keep
Feature tick icon PLUS own as many other DRM-free eBooks or Videos as you like for just NZ$7 each
Feature tick icon Exclusive print discounts

Frequently bought together


Stars icon
Total NZ$ 204.97
PhoneGap By Example
NZ$71.99
PhoneGap 4 Mobile Application Development Cookbook
NZ$80.99
Phonegap Essentials
NZ$51.99
Total NZ$ 204.97 Stars icon
Banner background image

Table of Contents

9 Chapters
1. Get up and Running with PhoneGap Chevron down icon Chevron up icon
2. Mobile Platform Support Chevron down icon Chevron up icon
3. Command-line Interface Chevron down icon Chevron up icon
4. Plugin Support Chevron down icon Chevron up icon
5. First PhoneGap Application Chevron down icon Chevron up icon
6. Accessing Native APIs Chevron down icon Chevron up icon
7. Accessing Media Content Chevron down icon Chevron up icon
8. Application Development Workflow Chevron down icon Chevron up icon
Index Chevron down icon Chevron up icon

Customer reviews

Rating distribution
Full star icon Full star icon Full star icon Full star icon Empty star icon 4
(3 Ratings)
5 star 66.7%
4 star 0%
3 star 0%
2 star 33.3%
1 star 0%
Trejder Nov 02, 2015
Full star icon Full star icon Full star icon Full star icon Full star icon 5
PhoneGap lets you to build extensible, content rich mobile applications and deploy them to many mobile platforms (including iOS, Android, Windows Phone, Amazon and other), from single source code base, with just a snap of your fingers. And "PhoneGap Essentials" by Ivan Turkovic lets you jump into learning and coding process at once and publish your first application in a matter of day or two.There are many books on beginning your journey with PhoneGap and mobile applications developments. All or most of them full with examples, screenshots etc. What I particularly liked the most in "PhoneGap Essentials" are side notes, comments on nifty things, you should pay attention to, and extra information, that is provided by the author. Aside of general information and knowledge of PhoneGap itself and easy to follow examples, I found most interesting one of additional chapters, where Ivan Turkovic is talking about visual frameworks, you can use to enrich look & feel of your PhoneGap applications. And where he lists all pros and cons of these frameworks in an easy to understand, yet very useful advantage-disadvantage list.I'm the reviewer of "PhoneGap Essentials" book and I was responsible to catch all the errors and mistakes found in it during writing process. However, I'm not affiliated in any way with PACKT Publishing (except for being an unpaid reviewer for them) and above review is solely my own point of view.
Amazon Verified review Amazon
Vinay Nov 26, 2015
Full star icon Full star icon Full star icon Full star icon Full star icon 5
Packt has done a wonderful job of publishing this book.
Amazon Verified review Amazon
Stefano Sep 27, 2015
Full star icon Full star icon Empty star icon Empty star icon Empty star icon 2
Letto in un paio di ore. Certo, aiuta ad installare l'intero sistema, e da l'approccio per scrivere alcune semplici app, ma il codice è limitato a semplicissimi esempi sui singoli plugin base. Nessun accenno ai dati, nessun accenno alle UI se non una facciata di riferimento ai framework più usati per costruire UI. Troppo troppo poco per 16 euro.
Amazon Verified review Amazon
Get free access to Packt library with over 7500+ books and video courses for 7 days!
Start Free Trial

FAQs

What is the delivery time and cost of print book? Chevron down icon Chevron up icon

Shipping Details

USA:

'

Economy: Delivery to most addresses in the US within 10-15 business days

Premium: Trackable Delivery to most addresses in the US within 3-8 business days

UK:

Economy: Delivery to most addresses in the U.K. within 7-9 business days.
Shipments are not trackable

Premium: Trackable delivery to most addresses in the U.K. within 3-4 business days!
Add one extra business day for deliveries to Northern Ireland and Scottish Highlands and islands

EU:

Premium: Trackable delivery to most EU destinations within 4-9 business days.

Australia:

Economy: Can deliver to P. O. Boxes and private residences.
Trackable service with delivery to addresses in Australia only.
Delivery time ranges from 7-9 business days for VIC and 8-10 business days for Interstate metro
Delivery time is up to 15 business days for remote areas of WA, NT & QLD.

Premium: Delivery to addresses in Australia only
Trackable delivery to most P. O. Boxes and private residences in Australia within 4-5 days based on the distance to a destination following dispatch.

India:

Premium: Delivery to most Indian addresses within 5-6 business days

Rest of the World:

Premium: Countries in the American continent: Trackable delivery to most countries within 4-7 business days

Asia:

Premium: Delivery to most Asian addresses within 5-9 business days

Disclaimer:
All orders received before 5 PM U.K time would start printing from the next business day. So the estimated delivery times start from the next day as well. Orders received after 5 PM U.K time (in our internal systems) on a business day or anytime on the weekend will begin printing the second to next business day. For example, an order placed at 11 AM today will begin printing tomorrow, whereas an order placed at 9 PM tonight will begin printing the day after tomorrow.


Unfortunately, due to several restrictions, we are unable to ship to the following countries:

  1. Afghanistan
  2. American Samoa
  3. Belarus
  4. Brunei Darussalam
  5. Central African Republic
  6. The Democratic Republic of Congo
  7. Eritrea
  8. Guinea-bissau
  9. Iran
  10. Lebanon
  11. Libiya Arab Jamahriya
  12. Somalia
  13. Sudan
  14. Russian Federation
  15. Syrian Arab Republic
  16. Ukraine
  17. Venezuela
What is custom duty/charge? Chevron down icon Chevron up icon

Customs duty are charges levied on goods when they cross international borders. It is a tax that is imposed on imported goods. These duties are charged by special authorities and bodies created by local governments and are meant to protect local industries, economies, and businesses.

Do I have to pay customs charges for the print book order? Chevron down icon Chevron up icon

The orders shipped to the countries that are listed under EU27 will not bear custom charges. They are paid by Packt as part of the order.

List of EU27 countries: www.gov.uk/eu-eea:

A custom duty or localized taxes may be applicable on the shipment and would be charged by the recipient country outside of the EU27 which should be paid by the customer and these duties are not included in the shipping charges been charged on the order.

How do I know my custom duty charges? Chevron down icon Chevron up icon

The amount of duty payable varies greatly depending on the imported goods, the country of origin and several other factors like the total invoice amount or dimensions like weight, and other such criteria applicable in your country.

For example:

  • If you live in Mexico, and the declared value of your ordered items is over $ 50, for you to receive a package, you will have to pay additional import tax of 19% which will be $ 9.50 to the courier service.
  • Whereas if you live in Turkey, and the declared value of your ordered items is over € 22, for you to receive a package, you will have to pay additional import tax of 18% which will be € 3.96 to the courier service.
How can I cancel my order? Chevron down icon Chevron up icon

Cancellation Policy for Published Printed Books:

You can cancel any order within 1 hour of placing the order. Simply contact customercare@packt.com with your order details or payment transaction id. If your order has already started the shipment process, we will do our best to stop it. However, if it is already on the way to you then when you receive it, you can contact us at customercare@packt.com using the returns and refund process.

Please understand that Packt Publishing cannot provide refunds or cancel any order except for the cases described in our Return Policy (i.e. Packt Publishing agrees to replace your printed book because it arrives damaged or material defect in book), Packt Publishing will not accept returns.

What is your returns and refunds policy? Chevron down icon Chevron up icon

Return Policy:

We want you to be happy with your purchase from Packtpub.com. We will not hassle you with returning print books to us. If the print book you receive from us is incorrect, damaged, doesn't work or is unacceptably late, please contact Customer Relations Team on customercare@packt.com with the order number and issue details as explained below:

  1. If you ordered (eBook, Video or Print Book) incorrectly or accidentally, please contact Customer Relations Team on customercare@packt.com within one hour of placing the order and we will replace/refund you the item cost.
  2. Sadly, if your eBook or Video file is faulty or a fault occurs during the eBook or Video being made available to you, i.e. during download then you should contact Customer Relations Team within 14 days of purchase on customercare@packt.com who will be able to resolve this issue for you.
  3. You will have a choice of replacement or refund of the problem items.(damaged, defective or incorrect)
  4. Once Customer Care Team confirms that you will be refunded, you should receive the refund within 10 to 12 working days.
  5. If you are only requesting a refund of one book from a multiple order, then we will refund you the appropriate single item.
  6. Where the items were shipped under a free shipping offer, there will be no shipping costs to refund.

On the off chance your printed book arrives damaged, with book material defect, contact our Customer Relation Team on customercare@packt.com within 14 days of receipt of the book with appropriate evidence of damage and we will work with you to secure a replacement copy, if necessary. Please note that each printed book you order from us is individually made by Packt's professional book-printing partner which is on a print-on-demand basis.

What tax is charged? Chevron down icon Chevron up icon

Currently, no tax is charged on the purchase of any print book (subject to change based on the laws and regulations). A localized VAT fee is charged only to our European and UK customers on eBooks, Video and subscriptions that they buy. GST is charged to Indian customers for eBooks and video purchases.

What payment methods can I use? Chevron down icon Chevron up icon

You can pay with the following card types:

  1. Visa Debit
  2. Visa Credit
  3. MasterCard
  4. PayPal
What is the delivery time and cost of print books? Chevron down icon Chevron up icon

Shipping Details

USA:

'

Economy: Delivery to most addresses in the US within 10-15 business days

Premium: Trackable Delivery to most addresses in the US within 3-8 business days

UK:

Economy: Delivery to most addresses in the U.K. within 7-9 business days.
Shipments are not trackable

Premium: Trackable delivery to most addresses in the U.K. within 3-4 business days!
Add one extra business day for deliveries to Northern Ireland and Scottish Highlands and islands

EU:

Premium: Trackable delivery to most EU destinations within 4-9 business days.

Australia:

Economy: Can deliver to P. O. Boxes and private residences.
Trackable service with delivery to addresses in Australia only.
Delivery time ranges from 7-9 business days for VIC and 8-10 business days for Interstate metro
Delivery time is up to 15 business days for remote areas of WA, NT & QLD.

Premium: Delivery to addresses in Australia only
Trackable delivery to most P. O. Boxes and private residences in Australia within 4-5 days based on the distance to a destination following dispatch.

India:

Premium: Delivery to most Indian addresses within 5-6 business days

Rest of the World:

Premium: Countries in the American continent: Trackable delivery to most countries within 4-7 business days

Asia:

Premium: Delivery to most Asian addresses within 5-9 business days

Disclaimer:
All orders received before 5 PM U.K time would start printing from the next business day. So the estimated delivery times start from the next day as well. Orders received after 5 PM U.K time (in our internal systems) on a business day or anytime on the weekend will begin printing the second to next business day. For example, an order placed at 11 AM today will begin printing tomorrow, whereas an order placed at 9 PM tonight will begin printing the day after tomorrow.


Unfortunately, due to several restrictions, we are unable to ship to the following countries:

  1. Afghanistan
  2. American Samoa
  3. Belarus
  4. Brunei Darussalam
  5. Central African Republic
  6. The Democratic Republic of Congo
  7. Eritrea
  8. Guinea-bissau
  9. Iran
  10. Lebanon
  11. Libiya Arab Jamahriya
  12. Somalia
  13. Sudan
  14. Russian Federation
  15. Syrian Arab Republic
  16. Ukraine
  17. Venezuela