Book Image

PhoneGap and AngularJS for Cross-platform Development

By : Yuxian E Liang
Book Image

PhoneGap and AngularJS for Cross-platform Development

By: Yuxian E Liang

Overview of this book

PhoneGap is a mobile development framework that allows developers to build cross-platform mobile applications. Building PhoneGap apps is traditionally done using HTML, CSS, jQuery Mobile, Eclipse Editor, and/or Xcode. The process can be cumbersome, from setting up your editor to optimizing your usage of jQuery, and so on. However, AngularJS, a new but highly popular JavaScript framework, eases these tasks with APIs to get access to mobile APIs such as notifications, geo-location, accelerometers, and more. Starting with the absolute basics of building an AngularJS application, this book will teach you how to quickly set up PhoneGap apps using the command-line interface. You will learn how to create simple to advanced to-do lists and add authentication capabilities using PhoneGap's plugins. You will enhance your skills by writing a PhoneGap app using your newly learned AngularJS skills. Furthermore, you will learn about adding animation and interactive designs to your mobile web apps using PhoneGap plugins. By the end of the book, you will know everything you need to launch your app on both Android and iOS devices.
Table of Contents (14 chapters)
PhoneGap and AngularJS for Cross-platform Development
Credits
About the Author
About the Reviewers
www.PacktPub.com
Preface
Index

The to-do list app with Facebook Login on PhoneGap


As usual, we need to run our code using PhoneGap's command-line interface. So to change your current directory back to the to do list app, issue the following command:

cordova build ios
cordova emulate ios

Once you have issued the command, you should see your iOS emulator fired up. Next, you will see the following screenshot:

On Entering the App

As we are still logged in from the previous sections, we get to see our to-do list items even after clicking on OK. At this point, if you are still logged in, feel free to click on Logout, after which you should see the following screenshot:

Login Screen

As usual, you can log in and be greeted by the previous screenshot. After clicking on OK, you can start to play around with your app.

Successful login

Feel free to add new items, edit them, and log in and out just to see if the code is working correctly. If all goes well, congratulations! You now have a working PhoneGap app making RESTful calls coupled...