Ionic : Hybrid Mobile App Development
eBook - ePub

Ionic : Hybrid Mobile App Development

Rahat Khanna, Sani Yusuf, Hoc Phan

Share book
  1. 544 pages
  2. English
  3. ePUB (mobile friendly)
  4. Available on iOS & Android
eBook - ePub

Ionic : Hybrid Mobile App Development

Rahat Khanna, Sani Yusuf, Hoc Phan

Book details
Book preview
Table of contents
Citations

About This Book

An end–to-end journey, empowering you to build real-time, scalable, and interactive mobile applications with the Ionic frameworkAbout This Book• Develop engaging mobile experiences with a native-looking UI in Ionic and AngularJS.• Use out-of-the-box Ionic functionalities, customize existing components, and add new components with this comprehensive course.• Learn Ionic by creating three complete mobile applicationsWho This Book Is ForIf you are a web developer who wants to build hybrid mobile app development using the Ionic framework, then this comprehensive course is best-suited for you.What You Will Learn• Get to know about Hybrid Apps and AngularJS• Set up a development environment to build Hybrid Apps• Navigate around components and routing in Ionic• Authenticate users using an e-mail password, Twitter, Facebook, Google+, and LinkedIn• Retrieve data and store it using Firebase• Access native device functionalities such as the camera, contact list, e-mail, and maps using NG-Cordova• Integrate PhoneGap plugins with NG-Cordova• Test your apps to improve and optimize performanceIn DetailHybrid Apps are a promising choice in mobile app development to achieve cost-effectiveness and rapid development. Ionic has evolved as the most popular choice for Hybrid Mobile App development as it tends to match the native experience and provides robust components/tools to build apps. The Ionic Complete Developers course takes you on an end–to-end journey, empowering you to build real-time, scalable, and interactive mobile applications with the Ionic framework.Starting with an introduction to the Ionic framework to get you up and running, you will gradually move on to setting up the environment, and work through the multiple options and features available in Ionic to build amazing hybrid mobile apps. You will learn how to use Cordova plugins to include native functionality in your hybrid apps.You will work through three complete projects and build a basic to-do list app, a London tourist app, and a complete social media app. All three projects have been designed to help you learn Ionic at its very best. From setting up your project to developing on both the server side and front end, and best practices for testing and debugging your projects, you'll quickly be able to deliver high-performance mobile apps that look awesome.You will then hone your skills with recipes for cross-platform development. Integrating Ionic with Cordova will bring you native device features, and you will learn about the best modules from its ecosystem. Creating components and customizing the theme will allow you to extend Ionic. You'll see how to build your app to deploy to all platforms to make you a confident start-to-finish mobile developer.This Learning Path combines some of the best that Packt has to offer in one complete, curated package. It includes content from the following Packt products: • Getting Started with Ionic – by Rahat Khanna• Ionic by Example – by Sani Yusuf• Ionic Cookbook – by Hoc PhanStyle and approachThis course shows you how to get up and running with the Ionic framework. It doesn't just give you instructions, expecting you to follow them. Instead, with a hands-on approach, it demonstrates what Ionic is capable of through a series of practical projects that you can build yourself.

Frequently asked questions

How do I cancel my subscription?
Simply head over to the account section in settings and click on “Cancel Subscription” - it’s as simple as that. After you cancel, your membership will stay active for the remainder of the time you’ve paid for. Learn more here.
Can/how do I download books?
At the moment all of our mobile-responsive ePub books are available to download via the app. Most of our PDFs are also available to download and we're working on making the final remaining ones downloadable now. Learn more here.
What is the difference between the pricing plans?
Both plans give you full access to the library and all of Perlego’s features. The only differences are the price and subscription period: With the annual plan you’ll save around 30% compared to 12 months on the monthly plan.
What is Perlego?
We are an online textbook subscription service, where you can get access to an entire online library for less than the price of a single book per month. With over 1 million books across 1000+ topics, we’ve got you covered! Learn more here.
Do you support text-to-speech?
Look out for the read-aloud symbol on your next book to see if you can listen to it. The read-aloud tool reads text aloud for you, highlighting the text as it is being read. You can pause it, speed it up and slow it down. Learn more here.
Is Ionic : Hybrid Mobile App Development an online PDF/ePUB?
Yes, you can access Ionic : Hybrid Mobile App Development by Rahat Khanna, Sani Yusuf, Hoc Phan in PDF and/or ePUB format, as well as other popular books in Informatique & Développement d'applications. We have over one million books available in our catalogue for you to explore.

Information

Year
2017
ISBN
9781788297813

Ionic : Hybrid Mobile App Development


Table of Contents

Ionic : Hybrid Mobile App Development
Ionic : Hybrid Mobile App Development
Credits
Preface
What this learning path covers
What you need for this learning path
Who this learning path is for
Reader feedback
Customer support
Downloading the example code
Errata
Piracy
Questions
1. Module 1
1. All About Hybrid Mobile Apps and Ionic Framework
Introducing a Hybrid Mobile Application
Types of Hybrid Mobile Apps
WebView-based Hybrid Apps
Cross-compiled Hybrid Apps
Anatomy of a Hybrid Mobile App
Custom WebView
Native library
Native to JS Bridge
Using web technologies to develop for mobile
What is AngularJS?
Important concepts in AngularJS
Modules
Directives
Controllers
Services
Templates
Expressions
Filters
Why use Apache Cordova?
Introducing Ionic Framework
Summary
2. Setting up the Environment the Right Way
Setting up Native Mobile development environments
For iOS
Installing and running simulators for testing
For Android
Download links
Setting the environment variables
For Windows
For Linux/Mac OS
Managing Android SDK and emulators
Alternative to Android emulators – Genymotion
Ionic development environment
Installing NodeJS
Basic npm commands
Installing Cordova CLI and Ionic CLI
Installation command for Cordova CLI
Basic Ionic CLI commands
Building a dummy app
Popular issues faced and solutions
Alternative to installation fuss – Ionic Playground
Using Ionic Framework with different Code Editors
Brackets
Sublime Text
Visual Studio
Summary
3. Start Building Your First Ionic App
Starting a new project
Multiple ways to start a project
Method 1 – using CDN-hosted library files
Method 2 – using Ionic Creator to design a prototype and start a project
Method 3 – using Ionic CLI locally
The anatomy of Ionic Project
Project folder structure and important files
Main components
The index.html file
App.js and the root module
Simple content directives – ion-content and ion-pane
ion-content
ion-pane
The Ionic starter template
The blank template
The tabs template
The sidemenu template
The maps template
E-commerce sample app – BookStore
Features
Architecture and design
Summary
4. Navigation and Routing in an Ionic App
Introduction to Angular UI Router
States and URLs
Nested states and views
Using the dot notation
Using the parent property
Using object-based states
Views for nested views
Ways to transition to a state
Abstract state
Multiple and named views
View names – relative versus abstract
State parameters
Basic parameters
Regex parameters
Query parameters
Single parameter
Multiple parameters
The $stateParams service
State events and resolve
Resolve
Ionic header and footer
The <ion-header-bar> directive
The <ion-footer-bar> directive
Ionic Tabs
The <ion-tabs> directive
The <ion-tab> directive
Ionic side menu
The <ion-side-menus> directive
The <ion-side-menu> directive
The <ion-side-menu-content> directive
Other important directives
Navigation and back menus
Navigation and layout to be used in BookStore
Summary
5. Accessorizing Your App with Ionic Components
Ionic CSS components
Header
Footer
Buttons
Icon buttons
Button bar
Lists
List dividers
List icons
List buttons
Item avatars or thumbnails
Cards
Forms
Input elements
Checkbox
Radio button list
Toggle
Range
Tabs
Grid
Utility
Ionic JS components
Actionsheet – $ionicActionSheet
Backdrop - $ionicBackdrop
Form inputs
The <ion-checkbox> directive
The <ion-radio> directive
The <ion-toggle> directive
Gestures and events
The $ionicGesture service
The on method
The off method
Gesture events
Lists
The <ion-list> directive
Loading – $ionicLoading
Modal – $ionicModal
The IonicModal controller
initialize(options)
Popover – $ionicPopover
Spinner – ion-spinner
Miscellaneous components
$ionicPosition
$ionicConfigProvider
Summary
6. Integrating App with Backend Services
$http services
The response object
The $http constructor method
Ionic services vs factories
Ionic service – authentication service
Ionic factory – BooksFactory
$resource and REST API
Demystifying mBaaS
Integrating with Parse
Step 1 – creating an app on Parse
Step 2 – getting API keys
Step 3 – configuring appropriate settings
Step 4 – integrating SDK or integrating using REST API
Using SDK – downloading and overview
Using REST API
Integrating to Firebase
Summary
7. Testing App on Real Devices
Testing on browser emulators
Overview of device mode in Chrome dev tools
Ionic view app
The Ionic upload command
Viewing your app
Making debug build
Android debug build
iOS debug build
Remote debugging
Remote debugging using Chrome dev tools
Android debugging
iOS debugging
Remote debugging using jsconsole.com
Testing using Ngrok
Summary
8. Working with Cordova Plugins – ngCordova
Introduction to Cordova plugins
Plugin management
Integrating ngCordova to Ionic App ...

Table of contents