Ionic Cookbook
By Phan Hoc
()
About this ebook
Related to Ionic Cookbook
Related ebooks
Beginning DotNetNuke Skinning and Design Rating: 0 out of 5 stars0 ratingsApplication Integration Team A Complete Guide Rating: 0 out of 5 stars0 ratingsCustom CGI Scripting with Perl Rating: 0 out of 5 stars0 ratingsHypertext Markup Language (HTML) Fundamentals: How to Master HTML with Ease Rating: 0 out of 5 stars0 ratingsNosql A Complete Guide - 2019 Edition Rating: 0 out of 5 stars0 ratingsSwitch On Coursebook 3 Rating: 0 out of 5 stars0 ratingsSoftware Construction A Complete Guide - 2020 Edition Rating: 0 out of 5 stars0 ratingsAncillary revenue Complete Self-Assessment Guide Rating: 0 out of 5 stars0 ratingsData Normalization A Complete Guide - 2020 Edition Rating: 0 out of 5 stars0 ratingsThe 50 More Excel Functions Quiz Book: Excel Essentials Quiz Books, #4 Rating: 0 out of 5 stars0 ratingsHeroku Cloud Application Development Rating: 0 out of 5 stars0 ratingsSoftware architecture A Complete Guide - 2019 Edition Rating: 0 out of 5 stars0 ratingsJSTL: Practical Guide for JSP Programmers Rating: 3 out of 5 stars3/5Programming Techniques using Python: Have Fun and Play with Basic and Advanced Core Python Rating: 0 out of 5 stars0 ratingsMicrosoft Conversational AI Platform for Developers: End-to-End Chatbot Development from Planning to Deployment Rating: 0 out of 5 stars0 ratingsDon't Study for Exams Rating: 1 out of 5 stars1/5Jump Start Web Performance Rating: 0 out of 5 stars0 ratingsLearn Angular: Build a Todo App Rating: 0 out of 5 stars0 ratingsPro Spring Boot 2: An Authoritative Guide to Building Microservices, Web and Enterprise Applications, and Best Practices Rating: 0 out of 5 stars0 ratingsOSGi in Depth Rating: 0 out of 5 stars0 ratingsASP A Complete Guide Rating: 0 out of 5 stars0 ratingsLogical Framework A Complete Guide - 2019 Edition Rating: 0 out of 5 stars0 ratingsCISSP Certification Exam Study Guide: (Cerified Information Systems Security Professional) Rating: 0 out of 5 stars0 ratingsTouchCode Class 4 Rating: 0 out of 5 stars0 ratingsEmbedded Hypervisor The Ultimate Step-By-Step Guide Rating: 0 out of 5 stars0 ratingsStart Concurrent: An Introduction to Problem Solving in Java with a Focus on Concurrency, 2014 Rating: 0 out of 5 stars0 ratingsCode reuse Complete Self-Assessment Guide Rating: 0 out of 5 stars0 ratingsDatabase normalization A Complete Guide - 2019 Edition Rating: 0 out of 5 stars0 ratings
Internet & Web For You
No Place to Hide: Edward Snowden, the NSA, and the U.S. Surveillance State Rating: 4 out of 5 stars4/5How to Be Invisible: Protect Your Home, Your Children, Your Assets, and Your Life Rating: 4 out of 5 stars4/5Social Engineering: The Science of Human Hacking Rating: 3 out of 5 stars3/5The Gothic Novel Collection Rating: 5 out of 5 stars5/5Get Rich or Lie Trying: Ambition and Deceit in the New Influencer Economy Rating: 0 out of 5 stars0 ratingsSix Figure Blogging Blueprint Rating: 5 out of 5 stars5/5Coding For Dummies Rating: 5 out of 5 stars5/5How to Disappear and Live Off the Grid: A CIA Insider's Guide Rating: 0 out of 5 stars0 ratingsEverybody Lies: Big Data, New Data, and What the Internet Can Tell Us About Who We Really Are Rating: 4 out of 5 stars4/5Coding All-in-One For Dummies Rating: 4 out of 5 stars4/5Podcasting For Dummies Rating: 4 out of 5 stars4/5The Hacker Crackdown: Law and Disorder on the Electronic Frontier Rating: 4 out of 5 stars4/5Beginner's Guide To Starting An Etsy Print-On-Demand Shop Rating: 0 out of 5 stars0 ratingsGrokking Algorithms: An illustrated guide for programmers and other curious people Rating: 4 out of 5 stars4/5The Beginner's Affiliate Marketing Blueprint Rating: 4 out of 5 stars4/5200+ Ways to Protect Your Privacy: Simple Ways to Prevent Hacks and Protect Your Privacy--On and Offline Rating: 0 out of 5 stars0 ratingsHacking : The Ultimate Comprehensive Step-By-Step Guide to the Basics of Ethical Hacking Rating: 5 out of 5 stars5/5The Internet Is Not What You Think It Is: A History, a Philosophy, a Warning Rating: 4 out of 5 stars4/5The Logo Brainstorm Book: A Comprehensive Guide for Exploring Design Directions Rating: 4 out of 5 stars4/5Remote/WebCam Notarization : Basic Understanding Rating: 3 out of 5 stars3/5How To Start A Podcast Rating: 4 out of 5 stars4/5Tor and the Dark Art of Anonymity Rating: 5 out of 5 stars5/5More Porn - Faster!: 50 Tips & Tools for Faster and More Efficient Porn Browsing Rating: 3 out of 5 stars3/5The Digital Marketing Handbook: A Step-By-Step Guide to Creating Websites That Sell Rating: 5 out of 5 stars5/5The Cyber Attack Survival Manual: Tools for Surviving Everything from Identity Theft to the Digital Apocalypse Rating: 0 out of 5 stars0 ratingsIntroduction to Internet Scams and Fraud: Credit Card Theft, Work-At-Home Scams and Lottery Scams Rating: 4 out of 5 stars4/5
Reviews for Ionic Cookbook
0 ratings0 reviews
Book preview
Ionic Cookbook - Phan Hoc
Table of Contents
Ionic Cookbook
Credits
Foreword
About the Author
About the Reviewers
www.PacktPub.com
Support files, eBooks, discount offers, and more
Why Subscribe?
Free Access for Packt account holders
Preface
What this book covers
What you need for this book
Who this book is for
Sections
Getting ready
How to do it…
How it works…
There's more…
See also
Conventions
Reader feedback
Customer support
Downloading the example code
Errata
Piracy
Questions
1. Creating Our First App with Ionic
Introduction
Setting up a development environment
Getting ready
How to do it…
See also
Creating a HelloWorld app via CLI
How to do it…
How it works…
Creating a HelloWorld app via Ionic Creator
Getting ready
How to do it…
There's more...
Copying examples from Ionic Codepen Demos
How to do it…
There's more...
Viewing the app using your web browser
Getting ready
How to do it…
How it works...
Viewing the app using iOS Simulator
How to do it...
Viewing the app using Xcode for iOS
How to do it...
There's more...
Viewing the app using Genymotion for Android
How to do it...
Viewing the app using Ionic View
How to do it...
Customizing the app folder structure
How to do it...
2. Managing States and Navigation
Introduction
Creating a tab interface with nested views
Getting ready
How to do it...
How it works...
See also
Creating a multistep form with validation
Getting ready
How to do it...
How it works...
See also
3. Adding Device Features Support
Introduction
Taking a photo using the device camera
Getting ready
How to do it...
How it works...
There's more...
Capturing video and allowing playback
Getting ready
How to do it...
How it works...
There's more...
Composing an email with an attachment from an app
Getting ready
How to do it...
How it works...
See also
Picking and adding a contact
How to do it...
How it works...
See also
Adding Google Maps with geocoding support
Getting ready
How to do it...
How it works...
There's more...
See also
4. Offline Data Storage
Introduction
Creating a to-do app using ngStorage for Local Storage
Getting ready
How to do it...
How it works...
There's more...
See also
Creating a social networking app using SQLite
Getting ready
How to do it...
How it works...
There's more...
See also
5. Handling Gestures and Events
Introduction
Detecting drag events with a gesture coordinate
Getting ready
How to do it...
How it works...
See also
Communication between a view, controller, and directive using events
Getting ready
How to do it...
How it works...
See also
6. App Theme Customization
Introduction
Customizing themes for specific platforms
Getting ready
How to do it...
How it works...
There's more...
See also
Creating an introduction screen with a custom header
Getting ready
How to do it...
How it works...
7. Extending Ionic with Your Own Components
Introduction
Creating a scroll progress bar directive
Getting ready
How to do it...
How it works...
See also
Creating a custom filter
Getting ready
How to do it...
How it works...
See also
Animating an app using requestAnimationFrame with event binding
Getting ready
How to do it...
How it works...
There's more...
8. User Registration and Authentication
Introduction
Configuring a Facebook app with Firebase authentication
Getting ready
How to do it...
How it works...
There's more...
Configuring a Twitter app with Firebase authentication
Getting ready
How to do it...
How it works...
Configuring a Google+ project with Firebase authentication
Getting ready
How to do it...
How it works...
Creating an Ionic social authentication project for Facebook using $firebaseAuth
Getting ready
How to do it...
How it works...
There's more...
Creating a LinkedIn app and configuring authentication in Auth0
Getting ready
How to do it...
How it works...
There's more...
Integrating Auth0's LinkedIn authentication in an Ionic project
Getting ready
How to do it...
How it works...
See also
9. Saving and Loading Data Using Firebase
Introduction
Saving array data to Firebase
Getting ready
How to do it...
How it works...
Rendering a large Firebase data set using collection-repeat
Getting ready
How to do it...
How it works...
There's more...
Saving form data to Firebase
Getting ready
How to do it...
How it works...
10. Finalizing Your Apps for Different Platforms
Introduction
Building and publishing an app for iOS
Getting ready
How to do it...
How it works...
See also
Building and publishing an app for Android
Getting ready
How to do it...
How it works...
Using PhoneGap Build for cross-platform applications
Getting ready
How to do it...
How it works...
See also
Index
Ionic Cookbook
Ionic Cookbook
Copyright © 2015 Packt Publishing
All rights reserved. No part of this book may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written permission of the publisher, except in the case of brief quotations embedded in critical articles or reviews.
Every effort has been made in the preparation of this book to ensure the accuracy of the information presented. However, the information contained in this book is sold without warranty, either express or implied. Neither the author, nor Packt Publishing, and its dealers and distributors will be held liable for any damages caused or alleged to be caused directly or indirectly by this book.
Packt Publishing has endeavored to provide trademark information about all of the companies and products mentioned in this book by the appropriate use of capitals. However, Packt Publishing cannot guarantee the accuracy of this information.
First published: October 2015
Production reference: 1261015
Published by Packt Publishing Ltd.
Livery Place
35 Livery Street
Birmingham B3 2PB, UK.
ISBN 978-1-78528-797-8
www.packtpub.com
Credits
Author
Hoc Phan
Reviewers
Mike Hartington
Chady Kassouf
Ted Morin
Siva Prakash
Syed Iqrar Raza Zaidi
Acquisition Editors
Aaron Lazar
Rebecca Youé
Content Development Editor
Ritika Singh
Technical Editor
Edwin Moses
Copy Editors
Vedangi Narvekar
Jonathan Todd
Project Coordinator
Judie Jose
Proofreader
Safis Editing
Indexer
Hemangini Bari
Graphics
Abhinash Sahu
Production Coordinator
Komal Ramchandani
Cover Work
Komal Ramchandani
Foreword
This book is the result of 7 months of focused writing and coding by Hoc Phan, a talented developer and dedicated writer with whom the Ionic team has collaborated on a past book. Hoc is a dedicated Ionic community member who often speaks about Ionic, and we have the utmost respect for his commitment to teaching others how to use Ionic in really effective ways. This book provides recipes for getting a stew goin' with Ionic!
Hoc teaches developers how to set up a project by installing the Ionic command-line tool (CLI) and creating a new project. He addresses platform-specific styles and how to target each platform with SCSS and JavaScript. He explains how to integrate an Ionic app with Firebase to create a connection to a real-time database. The book covers routing and navigation, as well as running your app on a device (how to target the iOS and Android simulators).
For more advanced developers, the book explains how to integrate device APIs with ngCordova by working with a device's camera. Hoc also addresses the topic of setting up the Whitelist Plugin and working with CSP to make sure your app is secure.
Before I joined Ionic as a core team member and developer advocate, I was a developer and created many internal hybrid apps for my company. Before I began building apps, I evaluated multiple frameworks. Only Ionic provided a complete solution for hybrid mobile development. I could focus on development, and Ionic handled architecture and design.
Ionic offers a complete ecosystem for building performant, beautiful mobile apps using one code base, which saves time and money. We released the stable version of Ionic in May 2015 and have released alpha versions of four of our platform services since then. We plan to continue to support the open source Ionic SDK and release new features, tools, and services. As Ionic's developer advocate, I travel around the US to talk about Ionic and meet Ionic developers, and my favorite part of my job is people's enthusiasm for Ionic. The Ionic community is what makes Ionic great.
You'll find this book to be a great way to get cooking with Ionic and deep dive into the SDK. We're glad to have you as a member of the Ionic community.
Enjoy!
Mike Hartington
Developer Advocate, Ionic.io
About the Author
Hoc Phan is a technologist with a lot of experience in frontend development. He started programming at the age of 12 with Pascal and Assembly on a 486 computer. The way he learned was to start practicing right away even before figuring out concepts. Hoc worked on many JavaScript projects in the past by teaching himself the framework using various online sources. He was one of the first few developers who tested Ionic for its feasibility as a JavaScript replacement of the native language of a device. He wrote the Full Stack Mobile App with Ionic Framework book (for more information, visit http://www.amazon.com/Full-Stack-Mobile-Ionic-Framework-ebook/dp/B00QF1H380/), which was very well-received.
He has worked for both start-ups and large companies. By frequently speaking at local meet-ups as well as cloud computing / Big Data industry events and conferences, he learns from other experts. He holds an MBA degree from the University of Washington's Michael G. Foster School of Business.
About the Reviewers
Mike Hartington is a JavaScript developer who has focused on hybrid technologies for most of his career. By working on Ionic, he has been able to take his love of hybrid apps to the next level, focussing on making a power SDK for developers of all skill levels. After working with Arvind Ravulavaru on the Learning Ionic book by Packt Publishing, he used his knowledge as an Ionic core team member to provide valuable feedback on this book's content. He is thankful to the Ionic community for its support.
Chady Kassouf is an independent iOS and web development expert. He started programming 23 years ago, and he hasn't stopped ever since. Seven years ago, he decided to leave his job as a team leader in one of the leading digital agencies and to start his own business.
His interests apart from computers include arts, music, and fitness. He can be found online at http://chady.net/.
Ted Morin is a software developer with a focus on frontend technologies. He enjoys JavaScript in its many forms and is always exploring new frameworks and tools. He is currently juggling different projects and jobs and pursuing an undergraduate degree in software engineering at the University of Ottawa.
Siva Prakash has been working in the field of software development for the last 7 years. He is currently working for CISCO, Bangalore. He has an extensive experience in the development of desktop, mobile, and web-based applications in ERP, telecom, and the digital media industry. He has a passion for learning new technologies and sharing knowledge thus gained with others. He has worked on Big Data technologies for the digital media industry. He loves trekking, travelling, listening to music, reading books, and blogging.
Syed Iqrar Raza Zaidi is a software engineer with an experience of 4 years. He is currently designated as a Technical Lead at Bond Internet Consultancy LLC in Dubai, UAE. He is an organized, energetic, and dedicated software developer at work who is motivated to be of service by positively contributing towards every piece of work. He has vast knowledge of core JavaScript, and he has dabbled in PHP and Node.js. He built multiple web portals, web applications, mobile hybrid applications, and 2D and 3D games that delight and inform users using the latest web technologies.
He received the Employee Performance Award at Systems Limited in December 2014. He is a Microsoft Community Contributor as well as a technology leader at Mohammad Ali Jinnah University, Karachi, Pakistan.
You can view his LinkedIn profile by visiting https://pk.linkedin.com/pub/raza-zaidi/6a/201/a62. If you're interested in his work, you can drop him an email (
Whatever I am today is because of my parents' prayers and my family's love.
www.PacktPub.com
Support files, eBooks, discount offers, and more
For support files and downloads related to your book, please visit www.PacktPub.com.
Did you know that Packt offers eBook versions of every book published, with PDF and ePub files available? You can upgrade to the eBook version at www.PacktPub.com and as a print book customer, you are entitled to a discount on the eBook copy. Get in touch with us at
At www.PacktPub.com, you can also read a collection of free technical articles, sign up for a range of free newsletters and receive exclusive discounts and offers on Packt books and eBooks.
https://www2.packtpub.com/books/subscription/packtlib
Do you need instant solutions to your IT questions? PacktLib is Packt's online digital book library. Here, you can search, access, and read Packt's entire library of books.
Why Subscribe?
Fully searchable across every book published by Packt
Copy and paste, print, and bookmark content
On demand and accessible via a web browser
Free Access for Packt account holders
If you have an account with Packt at www.PacktPub.com, you can use this to access PacktLib today and view 9 entirely free books. Simply use your login credentials for immediate access.
Preface
The world of mobile development is fragmented, with many platforms, frameworks, and technologies. Ionic is intended to fill this gap with its open source HTML5 mobile app framework that lets developers build native-feeling apps using web technologies such as HTML, CSS, and AngularJS. Ionic makes it easy for frontend developers who want to become app developers. The framework provides superior performance with deep Cordova integration and a comprehensive set of tools for prototyping, backend support, and deployment.
This book will take you through the process of developing a cross-platform mobile app using just HTML5 and JavaScript based on Ionic. You will start first by getting familiarized with the CLI and learning how to build and run an app. You will have a look at some common features of real-world mobile apps such as authenticating a user and receiving and saving data using either Firebase or Local Storage.
Next, the book will explain how Ionic integrates with Cordova to support native device features by using ngCordova and takes advantage of the existing modules around its ecosystem. You will also explore the advanced topics related to extending Ionic to create new components. Finally, the book will show you how to customize the Ionic theme and build the app for all platforms.
What this book covers
Chapter 1, Creating Our First App with Ionic, introduces the Ionic framework and provides instructions for setting up the development environment and quickly creating and running the first app.
Chapter 2, Managing States and Navigation, walks through some examples of how to manage views, states, and the overall navigation within the app. This can be done via either the UI-Router component of AngularJS or the out-of-the-box Ionic directives.
Chapter 3, Adding