Search icon CANCEL
Subscription
0
Cart icon
Your Cart (0 item)
Close icon
You have no products in your basket yet
Arrow left icon
Explore Products
Best Sellers
New Releases
Books
Videos
Audiobooks
Learning Hub
Newsletter Hub
Free Learning
Arrow right icon
timer SALE ENDS IN
0 Days
:
00 Hours
:
00 Minutes
:
00 Seconds
PhoneGap By Example
PhoneGap By Example

PhoneGap By Example: Use PhoneGap to apply web development skills and learn variety of cross-platform mobile applications

Arrow left icon
Profile Icon Andrew Kovalenko
Arrow right icon
€20.98 €29.99
eBook Aug 2015 368 pages 1st Edition
eBook
€20.98 €29.99
Paperback
€36.99
Subscription
Free Trial
Renews at €18.99p/m
Arrow left icon
Profile Icon Andrew Kovalenko
Arrow right icon
€20.98 €29.99
eBook Aug 2015 368 pages 1st Edition
eBook
€20.98 €29.99
Paperback
€36.99
Subscription
Free Trial
Renews at €18.99p/m
eBook
€20.98 €29.99
Paperback
€36.99
Subscription
Free Trial
Renews at €18.99p/m

What do you get with eBook?

Product feature icon Instant access to your Digital eBook purchase
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

Billing Address

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

PhoneGap By Example

Chapter 2. Setting Up a Project Structure with Sencha Touch

The biggest misunderstanding with PhoneGap is that it does everything for you.

However, that's not the case. It is just the base for your application. It helps you package your app and access device features, such as the camera. There is nothing in PhoneGap that helps you to organize your app in terms of, for example, MVC. It's not an application framework. You need more. You need help from the PhoneGap ecosystem. By ecosystem, I mean everything that helps us build mobile-ready websites.

You need to spend a lot of time building an app that feels and looks native. It's the details that eat up your budget. Again, it's not PhoneGap's fault. Surely, JavaScript will perform faster on more modern devices soon. Surely, PhoneGap will remain a great service. However, we now need other great tools that can be used with PhoneGap to make HTML5/JS on mobile devices a success.

In this chapter, we will build a...

An introduction to Sencha Touch

In the previous chapter, I decided to select Sencha Touch as a framework for application development. It has been in existence for some years now and is popular among hybrid mobile application developers.

Sencha Touch is a product of Sencha company. It was first released on July 17, 2010. It was the 0.90 beta version. It was formed after other popular frameworks, such as Ext JS, jQTouch, and Raphael. At the time of writing this book, the latest version was 2.4.2.

It allows you to develop mobile applications that would have the same look and feel as a native application. Sencha Touch supports Android, iOS, Windows Phone, Microsoft Surface Pro and RT, and Blackberry devices.

Getting started with Sencha Touch isn't that difficult, but in order to get the best out of Sencha Touch, we need to invest a considerable amount of time in it.

To get a feel of a Sencha Touch app, take a look at the samples provided on its official page at http://www.sencha.com/products...

The installation of Sencha Touch

Download the free Sencha Touch SDK (http://www.sencha.com/products/touch/download/) and Sencha Cmdr. (http://www.sencha.com/products/sencha-cmd/download) from the Sencha website.

The installation of the Sencha Touch SDK

Extract the SDK zip file somewhere you usually place your SDKs. In my case, it is /Development/touch-2.4.1. Now, we will use this folder in the future for our project-generation process.

The installation of Sencha Cmd

To get Sencha Cmd working, you should install Java Runtime Environment (http://www.oracle.com/technetwork/java/javase/downloads/index.html), Ruby, Apple Xcode for iOS packaging, Android SDK, and Android Studio for Android packaging. We got all this packages installed, except Ruby.

Not all OSes have Ruby installed. Here are the OS-specific instructions to download Ruby:

  • Windows: Download Ruby from rubyinstaller.org. Get the .exe file version of the software and install it.
  • Mac OS: Ruby is preinstalled. You can test whether Ruby is...

Sencha Cmd features

The Sencha command-line tool helps us with different aspects in application development.

Sencha Cmd parameters are organized in categories and commands. Let's review some of them that we will use.

Here are the categories that we will use:

  • App: This performs various application build processes
  • Generate: This generates models, controllers, stores, or an entire application
  • Web: We will use this to test our application in a browser; it manages a simple HTTP file server
  • Compass: This wraps the execution of compass for Sass compilation
  • Compile: This compiles sources to produce concatenated output
  • Cordova: This manages Cmd/Cordova integration
  • PhoneGap: This manages Cmd/PhoneGap integration

Here are the commands that we will use:

  • help: This displays help for commands
  • upgrade: This upgrades the Sencha Cmd

Generating the application

Let's try some of the Sencha Cmd features and generate the Travelly application. First of all, we should change our current directory to Sencha Touch SDK and run the Sencha generate command there:

$ cd /Development/touch-2.4.1
$ sencha generate app Travelly ~/Projects/phonegap-by-example/sencha-travelly

The same result can be achieved without changing the directory to the SDK, but passing an additional argument within the command:

$ sencha -sdk /Development/touch-2.4.1 generate app Travelly ~/Projects/phonegap-by-example/sencha-travelly

Where:

  • /Development/touch-2.4.1 is the directory where you unzipped the Touch SDK
  • The generate command is used to generate the appropriate part of the application; in our case, it is entire application
  • Travelly is the name of our application
  • ~/Projects/phonegap-by-example/sencha-travelly is the path where we want our application to be generated

There is a new sencha-travelly folder created with the following file structure:

├...

Understanding the basic application structure

We already looked at the filesystem structure. It is now time to understand how these files are tied together. You also need to understand what an interaction between code parts is.

Understanding the basic application structure

Ext.application is the starting point in our application. As we noted earlier, it might contain the app name, and references to all the models, views, controllers, profiles, and stores. These are explained as follows:

  • Profiles: These allow us to customize the application's UI for handsets and tablets
  • Models: These represent a type of data in our application
  • Views: These actually present data in our application within Sencha Touch components
  • Controllers: These handle interactions with our application by listening for user's taps and swipes
  • Stores: These store our data, which we display in grids and other elements

You can see the single instance of Ext.application in the generated www/app.js file:

Ext.application({
    name: 'Travelly',
    views: [ &apos...

An introduction to Sencha Touch


In the previous chapter, I decided to select Sencha Touch as a framework for application development. It has been in existence for some years now and is popular among hybrid mobile application developers.

Sencha Touch is a product of Sencha company. It was first released on July 17, 2010. It was the 0.90 beta version. It was formed after other popular frameworks, such as Ext JS, jQTouch, and Raphael. At the time of writing this book, the latest version was 2.4.2.

It allows you to develop mobile applications that would have the same look and feel as a native application. Sencha Touch supports Android, iOS, Windows Phone, Microsoft Surface Pro and RT, and Blackberry devices.

Getting started with Sencha Touch isn't that difficult, but in order to get the best out of Sencha Touch, we need to invest a considerable amount of time in it.

To get a feel of a Sencha Touch app, take a look at the samples provided on its official page at http://www.sencha.com/products/touch...

Left arrow icon Right arrow icon

Description

PhoneGap is a free and open source framework that allows you to create mobile apps using standardized web APIs for the platforms you care about. It is one of the first and fastest spreading tools to develop hybrid applications using CSS, JavaScript, and HTML, without losing the advantages of native applications. If you are already a web developer, this book will provide you with the skills you need to create, customize, test, and deploy hybrid mobile applications. Starting from the beginning, this book will cover how to set up your PhoneGap development environment, add mobile web frameworks and plugins, design and customize the application layout, and utilize the embedded features of the PhoneGap framework. By working through the steps in each chapter, you will quickly master a variety of mobile applications with totally different approaches. You will then learn how to develop a PhoneGap plugin with native interfaces for iOS and Android, as well as common approaches to test PhoneGap applications. With ample screenshots that show you how to build a phenomenal application, PhoneGap by Example will ensure your success with this cutting-edge mobile development framework for hybrid applications.

Who is this book for?

If you are a web developer with some experience in development of single page applications and want to enter the world of mobile applications, then this technology and book is ideal for you. Since PhoneGap maintains an incredibly easy-to-use plugin interface, no previous experience in native languages development (such as Objective-C or Java) is required.

What you will learn

  • Set up plugins to access the camera and filesystem to capture media
  • Build a custom RESTful service and integrate it with a PhoneGap application
  • Integrate a HTML5 Canvas element to create mobile games
  • Build scalable applications using a modern mobile web framework
  • Interact with RESTful services from a mobile application
  • Build an audio/video chat facility using PhoneGap and WebRTC technologies
  • Develop a PhoneGap plugin with native interfaces for iOS and Android

Product Details

Country selected
Publication date, Length, Edition, Language, ISBN-13
Publication date : Aug 26, 2015
Length: 368 pages
Edition : 1st
Language : English
ISBN-13 : 9781785285578
Vendor :
Apache
Category :
Languages :
Tools :

What do you get with eBook?

Product feature icon Instant access to your Digital eBook purchase
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

Billing Address

Product Details

Publication date : Aug 26, 2015
Length: 368 pages
Edition : 1st
Language : English
ISBN-13 : 9781785285578
Vendor :
Apache
Category :
Languages :
Tools :

Packt Subscriptions

See our plans and pricing
Modal Close icon
€18.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
€189.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 €5 each
Feature tick icon Exclusive print discounts
€264.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 €5 each
Feature tick icon Exclusive print discounts

Frequently bought together


Stars icon
Total 105.97
Phonegap Essentials
€26.99
PhoneGap 4 Mobile Application Development Cookbook
€41.99
PhoneGap By Example
€36.99
Total 105.97 Stars icon

Table of Contents

11 Chapters
1. Installing and Configuring PhoneGap Chevron down icon Chevron up icon
2. Setting Up a Project Structure with Sencha Touch Chevron down icon Chevron up icon
3. Easy Work with Device – Your First PhoneGap Application "Travelly" Chevron down icon Chevron up icon
4. Integrating the Travelly Application with Custom Service Chevron down icon Chevron up icon
5. Crazy Bubbles - Your First HTML5 Mobile Game Chevron down icon Chevron up icon
6. Share Your Crazy Bubbles Game Result on Social Networks Chevron down icon Chevron up icon
7. Building a Real-time Communication Application – Pumpidu Chevron down icon Chevron up icon
8. Building "Imaginary" – An Application with Instagram-like Image Filters Chevron down icon Chevron up icon
9. Testing the PhoneGap Application Chevron down icon Chevron up icon
10. Releasing and Maintaining the Application Chevron down icon Chevron up icon
Index Chevron down icon Chevron up icon
Get free access to Packt library with over 7500+ books and video courses for 7 days!
Start Free Trial

FAQs

How do I buy and download an eBook? Chevron down icon Chevron up icon

Where there is an eBook version of a title available, you can buy it from the book details for that title. Add either the standalone eBook or the eBook and print book bundle to your shopping cart. Your eBook will show in your cart as a product on its own. After completing checkout and payment in the normal way, you will receive your receipt on the screen containing a link to a personalised PDF download file. This link will remain active for 30 days. You can download backup copies of the file by logging in to your account at any time.

If you already have Adobe reader installed, then clicking on the link will download and open the PDF file directly. If you don't, then save the PDF file on your machine and download the Reader to view it.

Please Note: Packt eBooks are non-returnable and non-refundable.

Packt eBook and Licensing When you buy an eBook from Packt Publishing, completing your purchase means you accept the terms of our licence agreement. Please read the full text of the agreement. In it we have tried to balance the need for the ebook to be usable for you the reader with our needs to protect the rights of us as Publishers and of our authors. In summary, the agreement says:

  • You may make copies of your eBook for your own use onto any machine
  • You may not pass copies of the eBook on to anyone else
How can I make a purchase on your website? Chevron down icon Chevron up icon

If you want to purchase a video course, eBook or Bundle (Print+eBook) please follow below steps:

  1. Register on our website using your email address and the password.
  2. Search for the title by name or ISBN using the search option.
  3. Select the title you want to purchase.
  4. Choose the format you wish to purchase the title in; if you order the Print Book, you get a free eBook copy of the same title. 
  5. Proceed with the checkout process (payment to be made using Credit Card, Debit Cart, or PayPal)
Where can I access support around an eBook? Chevron down icon Chevron up icon
  • If you experience a problem with using or installing Adobe Reader, the contact Adobe directly.
  • To view the errata for the book, see www.packtpub.com/support and view the pages for the title you have.
  • To view your account details or to download a new copy of the book go to www.packtpub.com/account
  • To contact us directly if a problem is not resolved, use www.packtpub.com/contact-us
What eBook formats do Packt support? Chevron down icon Chevron up icon

Our eBooks are currently available in a variety of formats such as PDF and ePubs. In the future, this may well change with trends and development in technology, but please note that our PDFs are not Adobe eBook Reader format, which has greater restrictions on security.

You will need to use Adobe Reader v9 or later in order to read Packt's PDF eBooks.

What are the benefits of eBooks? Chevron down icon Chevron up icon
  • You can get the information you need immediately
  • You can easily take them with you on a laptop
  • You can download them an unlimited number of times
  • You can print them out
  • They are copy-paste enabled
  • They are searchable
  • There is no password protection
  • They are lower price than print
  • They save resources and space
What is an eBook? Chevron down icon Chevron up icon

Packt eBooks are a complete electronic version of the print edition, available in PDF and ePub formats. Every piece of content down to the page numbering is the same. Because we save the costs of printing and shipping the book to you, we are able to offer eBooks at a lower cost than print editions.

When you have purchased an eBook, simply login to your account and click on the link in Your Download Area. We recommend you saving the file to your hard drive before opening it.

For optimal viewing of our eBooks, we recommend you download and install the free Adobe Reader version 9.