Apache Cordova in Action
()
About this ebook
Apache Cordova in Action teaches you to create and launch hybrid mobile apps using Cordova or Phonegap. By following carefully selected examples, step-by-step tutorials, and crystal-clear explanations, you'll learn to build apps from the Cordova CLI, how to make use of device features like the camera and accelerometer, how to submit your apps to Google Play and the Apple App Store, and more.
Purchase of the print book includes a free eBook in PDF, Kindle, and ePub formats from Manning Publications.
About the Book
Developing a mobile app requires extensive knowledge of native programming techniques for multiple platforms. Apache Cordova lets you use your existing skills in web development (HTML, CSS, and JavaScript) to build powerful mobile apps. Your apps also get the power of integration with native device features like the camera and file system.
Apache Cordova in Action teaches you how to design, create, and launch hybrid mobile apps people will want to use. With the help of straightforward, real-world examples, you'll learn to build apps from the Cordova CLI and to make use of native device features like the camera and accelerometer. You'll learn testing techniques and discover the PhoneGap Build service and how to submit your apps to Google Play and the Apple App Store. Along the way, this helpful guide discusses mobile app design and shows you how to create effective, professional-quality UI and UX.
What's Inside
- Build mobile apps
- UI, UX, and testing techniques
- Deploy to Google Play and the Apple App Store
- Employ libraries like Bootstrap, jQuery Mobile, and Ionic
About the Reader
Readers should be familiar with HTML, CSS, and JavaScript. No experience with mobile app development needed.
About the Author
Raymond Camden is a developer advocate for IBM. He is passionate about mobile development and has spoken at conferences worldwide.
The Table of Contents
-
PART 1 GETTING STARTED WITH APACHE CORDOVA
- What is Cordova?
- Installing Cordova and the Android SDK PART 2 CORE CONCEPTS
- Creating Cordova projects
- Using plugins to access device features
- Mobile design and user experience
- Considerations when building mobile apps
- Tools for debugging Cordova and other hybrid apps
- Creating custom plugins
- Packing options for Cordova projects
- Using PhoneGap tools PART 3 APPLICATION RELEASE
- Submitting your app
- Building an RSS reader app with Ionic
Raymond K. Camden
Raymond Camden is a lead developer evangelist for HERE. He works on maps, geospatial stuff, JavaScript, and enterprise cat demos. He is the author of multiple books on web development and has been actively blogging and presenting for almost twenty years.
Related to Apache Cordova in Action
Related ebooks
Ember.js in Action Rating: 0 out of 5 stars0 ratingsPro Angular 16 Rating: 0 out of 5 stars0 ratingsIsomorphic Web Applications: Universal Development with React Rating: 0 out of 5 stars0 ratingsNode.js in Practice Rating: 0 out of 5 stars0 ratingsDependency Injection: Design patterns using Spring and Guice Rating: 0 out of 5 stars0 ratingsMobile Application Development: JavaScript Frameworks Rating: 0 out of 5 stars0 ratingsEnterprise OSGi In Action Rating: 0 out of 5 stars0 ratingsPlay for Java Rating: 0 out of 5 stars0 ratingsBeginning Mobile Application Development in the Cloud Rating: 0 out of 5 stars0 ratingsRedux in Action Rating: 0 out of 5 stars0 ratingsGradle in Action Rating: 4 out of 5 stars4/5Alfresco 3 Cookbook Rating: 0 out of 5 stars0 ratingsJava 9 with JShell Rating: 0 out of 5 stars0 ratingsFull Stack iOS Development with Swift and Vapor: Full stack iOS development made easy (English Edition) Rating: 0 out of 5 stars0 ratingsMERN Stack Course Book Rating: 0 out of 5 stars0 ratings120 Advanced JavaScript Interview Questions Rating: 0 out of 5 stars0 ratingsNW.js Essentials Rating: 0 out of 5 stars0 ratingsHeroku Cloud Application Development Rating: 0 out of 5 stars0 ratingsTraefik API Gateway for Microservices: With Java and Python Microservices Deployed in Kubernetes Rating: 0 out of 5 stars0 ratingsUnleashing the Power of TypeScript Rating: 0 out of 5 stars0 ratingsLearning Software Architecture Rating: 0 out of 5 stars0 ratingsSonar Code Quality Testing Essentials Rating: 0 out of 5 stars0 ratingsExtending Docker Rating: 0 out of 5 stars0 ratingsThe Best Javascript Rating: 0 out of 5 stars0 ratingsjQuery Mobile Web Development Essentials - Third Edition Rating: 0 out of 5 stars0 ratingsCORS Essentials Rating: 0 out of 5 stars0 ratings
Operating Systems For You
Linux Command Line and Shell Scripting Bible Rating: 3 out of 5 stars3/5Mastering Windows PowerShell Scripting Rating: 4 out of 5 stars4/5Excel : The Ultimate Comprehensive Step-By-Step Guide to the Basics of Excel Programming: 1 Rating: 5 out of 5 stars5/5OneNote: The Ultimate Guide on How to Use Microsoft OneNote for Getting Things Done Rating: 1 out of 5 stars1/5Linux Command-Line Tips & Tricks Rating: 0 out of 5 stars0 ratingsLinux: Learn in 24 Hours Rating: 5 out of 5 stars5/5The Linux Command Line Beginner's Guide Rating: 4 out of 5 stars4/5Hacking : The Ultimate Comprehensive Step-By-Step Guide to the Basics of Ethical Hacking Rating: 5 out of 5 stars5/5Exploring Windows 11: The Illustrated, Practical Guide to Using Microsoft Windows Rating: 0 out of 5 stars0 ratingsMake Your PC Stable and Fast: What Microsoft Forgot to Tell You Rating: 4 out of 5 stars4/5Bash Command Line Pro Tips Rating: 5 out of 5 stars5/5Raspberry Pi Cookbook for Python Programmers Rating: 0 out of 5 stars0 ratingsRHCSA Red Hat Enterprise Linux 8 (UPDATED): Training and Exam Preparation Guide (EX200), Second Edition Rating: 5 out of 5 stars5/5Linux Bible Rating: 0 out of 5 stars0 ratingsPowerShell: A Comprehensive Guide to Windows PowerShell Rating: 4 out of 5 stars4/5MacBook Pro User Manual: 2022 MacBook Pro User Guide for beginners and seniors to Master Macbook Pro like a Pro Rating: 0 out of 5 stars0 ratingsWindows 11 For Dummies Rating: 0 out of 5 stars0 ratingsNetworking for System Administrators: IT Mastery, #5 Rating: 5 out of 5 stars5/5macOS Sonoma For Dummies Rating: 0 out of 5 stars0 ratingsThe Windows Command Line Beginner's Guide: Second Edition Rating: 4 out of 5 stars4/5Help! iOS 17 - iPhone: How to Use iOS17 Rating: 0 out of 5 stars0 ratingsLinux All-In-One For Dummies Rating: 2 out of 5 stars2/5The Mac Terminal Reference and Scripting Primer Rating: 4 out of 5 stars4/5Macs All-in-One For Dummies Rating: 0 out of 5 stars0 ratingsCompTIA A+ Complete Study Guide: Core 1 Exam 220-1101 and Core 2 Exam 220-1102 Rating: 0 out of 5 stars0 ratingsXDA Developers' Android Hacker's Toolkit: The Complete Guide to Rooting, ROMs and Theming Rating: 2 out of 5 stars2/5
Reviews for Apache Cordova in Action
0 ratings0 reviews
Book preview
Apache Cordova in Action - Raymond K. Camden
Copyright
For online information and ordering of this and other Manning books, please visit www.manning.com. The publisher offers discounts on this book when ordered in quantity. For more information, please contact
Special Sales Department
Manning Publications Co.
20 Baldwin Road
PO Box 761
Shelter Island, NY 11964
Email:
©2016 by Manning Publications Co. All rights reserved.
No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by means electronic, mechanical, photocopying, or otherwise, without prior written permission of the publisher.
Many of the designations used by manufacturers and sellers to distinguish their products are claimed as trademarks. Where those designations appear in the book, and Manning Publications was aware of a trademark claim, the designations have been printed in initial caps or all caps.
Recognizing the importance of preserving what has been written, it is Manning’s policy to have the books we publish printed on acid-free paper, and we exert our best efforts to that end. Recognizing also our responsibility to conserve the resources of our planet, Manning books are printed on paper that is at least 15 percent recycled and processed without elemental chlorine.
ISBN: 9781633430068
Printed in the United States of America
1 2 3 4 5 6 7 8 9 10 – EBM – 20 19 18 17 16 15
Brief Table of Contents
Copyright
Brief Table of Contents
Table of Contents
Preface
Acknowledgments
About this Book
About the Cover Illustration
1. Getting started with Apache Cordova
Chapter 1. What is Cordova?
Chapter 2. Installing Cordova and the Android SDK
2. Core concepts
Chapter 3. Creating Cordova projects
Chapter 4. Using plugins to access device features
Chapter 5. Mobile design and user experience
Chapter 6. Considerations when building mobile apps
Chapter 7. Tools for debugging Cordova and other hybrid apps
Chapter 8. Creating custom plugins
Chapter 9. Packing options for Cordova projects
Chapter 10. Using PhoneGap tools
3. Application release
Chapter 11. Submitting your app
Chapter 12. Building an RSS reader app with Ionic
Index
List of Figures
List of Tables
List of Listings
Table of Contents
Copyright
Brief Table of Contents
Table of Contents
Preface
Acknowledgments
About this Book
About the Cover Illustration
1. Getting started with Apache Cordova
Chapter 1. What is Cordova?
1.1. The history of PhoneGap (and Cordova)
1.2. How PhoneGap and Cordova relate
1.2.1. How are they the same?
1.2.2. How do they differ?
1.2.3. Official websites
1.3. What Cordova provides
1.3.1. Command-line tool
1.3.2. Hardware access
1.3.3. Plugin support
1.4. What Cordova doesn’t provide
1.5. When you wouldn’t use Cordova
1.6. Web standards and Cordova
1.7. Summary
Chapter 2. Installing Cordova and the Android SDK
2.1. Installing the Android SDK
2.2. Installing Apache Ant
2.3. Installing Git
2.4. Installing Node.js
2.5. Setting up your PATH
2.6. Installing Cordova
2.7. Making your first Cordova project
2.8. Summary
2. Core concepts
Chapter 3. Creating Cordova projects
3.1. Creating projects with the Cordova CLI
3.2. Digging into a Cordova project
3.3. Adding platforms
3.4. Working with Android emulators and devices
3.4.1. Working with devices
3.5. Sending your Cordova application to the emulator (or device)
3.6. Building your first real application
3.7. Summary
Chapter 4. Using plugins to access device features
4.1. What are plugins?
4.2. Finding (and evaluating) plugins
4.3. Managing plugins and the Cordova CLI
4.4. Plugins and the development cycle
4.5. The deviceready event
4.6. Plugin example: Dialogs
4.6.1. Better dialogs with the Cordova Dialogs plugin
4.6.2. Building an application with the Dialogs plugin
4.7. Plugin example: Camera
4.8. Plugin example: Contacts
4.9. Summary
Chapter 5. Mobile design and user experience
5.1. Congratulations—you’re a (horrible) mobile developer!
5.1.1. A good example of a bad UI
5.1.2. Put some lipstick on the pig: improving the application with CSS
5.1.3. The meta viewport tag
5.2. Enhancing your Cordova UI with Bootstrap
5.2.1. Introducing Bootstrap
5.2.2. Another example: the camera app
5.2.3. Bootstrap does more
5.3. Mobile UI frameworks: an overview
5.3.1. Ionic: UI, UX, and more
5.3.2. jQuery Mobile: powerful and simple
5.3.3. Ratchet: Android and iOS friendly
5.3.4. Kendo UI: large and commercially supported
5.4. Summary
Chapter 6. Considerations when building mobile apps
6.1. Congratulations—you’re a (slightly better) mobile developer!
6.2. Single-page applications and you
6.2.1. So why should you care?
6.2.2. A SPA for you, a SPA for me, a SPA for everyone!
6.2.3. jQuery Mobile: the basics
6.2.4. Mixing jQuery Mobile and Cordova
6.3. Building offline-ready Cordova applications
6.3.1. Problems with the application
6.3.2. Adding offline support to the GitHub Search application
6.4. Supporting the entire planet
6.4.1. Improving the GitHub Search application for the world
6.5. Storing data on the device
6.5.1. A real-world example
6.5.2. Options for handling data storage
6.5.3. Selecting the type of data storage
6.5.4. Improving the GitHub Search application
6.6. Summary
Chapter 7. Tools for debugging Cordova and other hybrid apps
7.1. Finding the bug is nine-tenths the work of solving it
7.2. A broken app
7.3. Working with Chrome remote debugging on Android
7.3.1. Preparing for Chrome remote debugging
7.3.2. Features of Chrome’s developer tools
7.3.3. Putting Chrome remote debugging to use
7.4. Remote debugging with iOS and Safari
7.4.1. Preparing for Safari remote debugging
7.4.2. Features of Safari’s developer tools
7.5. Working with Weinre
7.5.1. Installing Weinre
7.5.2. Running Weinre
7.6. Other debugging options
7.6.1. Skip Cordova!
7.6.2. GapDebug
7.7. Summary
Chapter 8. Creating custom plugins
8.1. Why write your own plugins?
8.2. Plugin architecture
8.3. Building an Android plugin
8.3.1. Setting up the plugin
8.3.2. Writing the plugin code
8.3.3. Working with your plugin
8.3.4. Adding the plugin
8.4. Summary
Chapter 9. Packing options for Cordova projects
9.1. Using config.xml to customize your Cordova project
9.1.1. General (or global) preferences
9.1.2. Specifying preferences for a platform
9.1.3. Finding other preferences
9.1.4. Working with icons and splash-screens
9.2. Using merges for multiple platforms
9.3. Using hooks to enhance the Cordova CLI
9.3.1. Why do you use hooks?
9.3.2. Defining hooks
9.3.3. Hooks: before and after CLI commands
9.3.4. Example: use a hook to add plugins for a platform
9.3.5. Using hooks with config.xml
9.3.6. Working with hook arguments
9.4. Summary
Chapter 10. Using PhoneGap tools
10.1. Working with PhoneGap
10.2. PhoneGap Build service
10.2.1. Create a PhoneGap Build account
10.2.2. Creating your first PhoneGap Build application
10.2.3. Digging deeper into PhoneGap Build
10.2.4. Using plugins with PhoneGap Build
10.2.5. More configuration options
10.2.6. More PhoneGap Build features
10.3. PhoneGap Developer App
10.3.1. Installing
10.3.2. Using the PhoneGap Developer App
10.4. Summary
3. Application release
Chapter 11. Submitting your app
11.1. Releasing your app
11.2. Submitting your Android app
11.2.1. Signing your app
11.2.2. Publishing to the Android market
11.3. Submitting your iOS app
11.3.1. Signing your app
11.3.2. Publishing to the iOS market
11.4. Summary
Chapter 12. Building an RSS reader app with Ionic
12.1. Designing a simple RSS reader application
12.2. Using Ionic for Cordova development
12.2.1. The ionic serve feature
12.3. RSS reader app: part one
12.3.1. Starting the app
12.3.2. Application modules
12.3.3. Reviewing what you’ve done
12.4. RSS reader app: part two
12.4.1. Adding the loading indicator
12.4.2. Adding the InAppBrowser plugin
12.4.3. Adding the SocialSharing plugin
12.4.4. Adding offline support
12.5. Summary
Index
List of Figures
List of Tables
List of Listings
Preface
I’ve been fortunate to have been a web developer for approximately 20 years. I can remember using NCSA Mosaic to browse the web and picking up HTML books to help me build my first web page. (Yes, I used a rainbow gradient back then.) Things were rough in those days. I can remember playing with LiveScript, the initial release of JavaScript, and having to reboot my entire machine at times to get my browser to work. I spent a good deal of my first decade or so as a developer focused on the server side, first with Perl and then with ColdFusion. I ignored the front-end due to the numerous issues with browsers and, pretty much, just the browsers themselves.
Approximately 10 years ago, I turned my attention back to the client side. I was surprised to find that this Web 2.0/AJAX thing was actually kind of cool, and that, for the most part, it actually worked. I began to spend most of my time learning JavaScript (again) and reacquainting myself with HTML. That may sound like a surprising statement. I certainly knew HTML and used it in my server-side applications, but I discovered that when I looked closely, there was quite a bit I didn’t know and didn’t appreciate.
At the same time, mobile was slowly inching along toward being a big deal. I kept hearing about how big it was in Europe and Asia, but my experience with it was disappointing. I loved my Motorola RAZR, but the first time I sent an SMS message with it was also the last time I sent an SMS message with it. Browsing the web on it was also an exercise in frustration.
And then one day ... everything changed. The iPhone was a game changer—it made using the mobile web useful. And when the app market was launched, and folks made millions with fart apps, a whole new breed of developer was born. I began focusing on working on the mobile platform, specifically building mobile-friendly websites. Then one day I discovered PhoneGap (the originator of Apache Cordova—don’t worry, we’ll discuss the differences in chapter 1). It was rough too—it took me a good 10 minutes or so to get the Hello World
project set up. But when I first saw my HTML running as an app on my phone, it was incredible. Everything I had learned about web development was now enabling me to create applications on mobile devices—and not just one, but many.
PhoneGap, and Cordova, have come a long way since I began working with them. The platform is simpler to use, but still requires careful consideration and planning, and this is where I think this book will really help. I tried to take information found in multiple sources and bring it together in a concise, easy-to-follow format. I’m not terribly smart. In fact, I struggle a lot. But I’ve made a career out of taking my struggle and turning that into writing and presentations that will—I hope—help others with their struggles as well.
Acknowledgments
This book was a lot of work. No, make that really a lot of work! But I believe that this is a great book, and I hope that you will think so as well. There are quite a few people I’d like to thank for helping me along the way.
First and foremost, I want to thank my wife, Jeanne. You’ve always supported me, always patiently listened while I struggled to get this done, and always made me believe I could finish this. I love you.
Next, I’d like to acknowledge my editor at Manning, Helen Stergius. Thank you for working with me, and thank you more for being patient when things got rough. Your commitment to the quality of this book has made it better for everyone who reads it. Thanks as well to all the other folks at Manning who worked with me on the production and promotion of the book. It was truly a team effort.
I’d also like to thank the reviewers who took the time to read my manuscript at various stages during its development and who provided invaluable feedback: Barry Alexander, Becky Huett, Charlie Gaines, Chris Snow, Chris Wayman, Doug Warren, Greg Murray, Ivo Štimac, Jérôme Baton, Matt Royten, Michael E. Roberts, Natalia Stavisky, Satish Kumar Bairi, and Yogesh Poojari. Special thanks to Cody Sand, technical proofreader, for his careful review of the code one last time, shortly before the book went into production.
Finally, thank you to the entire PhoneGap and Apache Cordova team. You’ve created something that’s incredibly cool and useful for developers around the world. Thank you to Shazron Abdullah, Brian LeRoux, Michael Brooks, and others for answering my questions and helping make this book happen.
About this Book
Apache Cordova in Action was written to help you build hybrid mobile applications for the Apache Cordova framework. It begins by focusing on the mechanics of setting up your development environment and then switches its focus to the intangibles of working with hybrid mobile development—things like design, best practices, and what to do when things go wrong.
How the book is organized
The book has three sections that cover 12 chapters.
Part 1 explains what Apache Cordova covers and how to set up your development environment.
Chapter 1 discusses the Apache Cordova project and what a hybrid mobile application actually is. It also discusses what Cordova does and doesn’t provide, even discussing when you would not want to use a hybrid mobile application.
Chapter 2 goes deep into setting up all the necessary parts required to do Cordova development with Android. Because the iOS SDK requires a Mac but Android will work anywhere, the book focuses on explaining Android’s requirements, as well as what you need to get the Cordova CLI installed.
Part 2 covers high-level core concepts for working with Apache Cordova.
Chapter 3 discusses the Cordova CLI and how it’s used to create projects. It also discusses what makes up a Cordova project.
Chapter 4 describes what plugins mean in a Cordova project and how to make use of them. It contains multiple examples of how to use plugins.
Chapter 5 begins the discussion of how to use a mobile-friendly design for your Cordova applications. Bootstrap is demonstrated and other frameworks are discussed.
Chapter 6 discusses other considerations for Cordova projects, including things like detecting network status and client-side storage.
Chapter 7 goes deep into the topic of debugging. Multiple debugging techniques are described.
Chapter 8 describes the process of creating custom plugins, with a full example of an Android plugin.
Chapter 9 discusses how to package your applications so they can be released and discusses creating custom icons and splash-screens.
Chapter 10 demonstrates Adobe PhoneGap Build as an alternative to using a local SDK to build apps.
Part 3 covers the next steps required for a successful application release.
Chapter 11 describes in deep detail the process of submitting your application to both the Android and Apple stores.
Chapter 12 ends the book with a demo of a real (if simple) application.
Who should read this book
Apache Cordova in Action is for web developers who are looking to enter the mobile space by building hybrid mobile applications. Both beginner and experienced web developers will be able to learn how to use their skills within the Cordova framework. While plenty of docs and blog posts exist online, this book brings together everything in a very clear, very easy-to-follow format that will benefit anyone wanting to become a mobile developer.
How to use this book
In general, developers should be sure to read the first two chapters so that their development environment is correctly set up. Chapters 3 and 4 provide important information about using Cordova itself. The rest of the book discusses topics like design, best practices, and debugging, and can be read out of order, based on the reader’s particular needs.
About the code
All source code in the book is presented in a monospaced typeface like this, which sets it off from the surrounding text. In many listings, the code is annotated to point out key concepts, and numbered bullets are sometimes used in the text to provide additional information about the code.
Source code for the examples in this book is available for download from the publisher’s website at www.manning.com/books/apache-cordova-in-action.
Online resources
Need additional help?
The PhoneGap Google Group at groups.google.com/forum/#!forum/phonegap provides a great place to discuss topics related to PhoneGap (and Cordova) development.
The Cordova tag at StackOverflow (stackoverflow.com/questions/tagged/cordova) is a great place to both ask questions and help others. Helping someone else is a great way to learn!
Author Online
Purchase of Apache Cordova in Action includes free access to a private web forum run by Manning Publications where you can make comments about the book, ask technical questions, and receive help from the author and from other users. To access the forum and subscribe to it, point your web browser to www.manning.com/books/apache-cordova-in-action. This page provides information on how to get on the forum once you’re registered, what kind of help is available, and the rules of conduct on the forum.
Manning’s commitment to our readers is to provide a venue where a meaningful dialog between individual readers and between readers and the author can take place. It is not a commitment to any specific amount of participation on the part of the author, whose contributions to the AO remain voluntary (and unpaid). We suggest you ask the author challenging questions, lest his interest stray.
About the Author
RAYMOND CAMDEN is a web developer with nearly 20 years of experience. He has been a PhoneGap/Cordova user for most of the history of the project and has spoken at multiple conferences around the world on mobile development. He has a passion for web standards and helping explain complex topics to people in a way that is easy to understand as well as inspiring.
About the Cover Illustration
The figure on the cover of Apache Cordova in Action is captioned A Shepherd from Gonesse, France.
The illustration is taken from a collection of traditional French costumes by Nicolas Bonnart (1637-1717). The drawings are hand-colored engravings on paper that depict the various styles of dress popular in Paris and its suburbs in the seventeenth and eighteenth centuries. Gonesse is a small town about 15 kilometers northeast of Paris.
Dress codes and lifestyles have changed over the last 300 years, and the diversity by region, so rich at the time, has faded away. It is now hard to tell apart the inhabitants of different continents, let alone of different hamlets or towns separated by only a few miles. Perhaps we have traded cultural diversity for a more varied personal life—certainly for a more varied and fast-paced technological life.
Manning celebrates the inventiveness and initiative of the computer business with book covers based on the rich diversity of regional life of three centuries ago, brought back to life by illustrations from old books and collections such as this one.
Part 1. Getting started with Apache Cordova
In these first two chapters, you’ll learn about hybrid mobile applications and how Apache Cordova fits into their development. We’ll look at what Cordova provides and what it doesn’t, and when a hybrid app isn’t always the best solution. You also will learn how to set up your environment for Cordova development with