Browse Library
Sign In Start Free Trial
Close icon Search icon
Account
Browse Library Advanced Search Sign In Start Free Trial

Add to playlist

Create a Playlist

Modal Close icon
You need to login to use this feature.
  • Learning Ionic, Second Edition
  • Toc
  • feedback
Learning Ionic, Second Edition

Learning Ionic, Second Edition

By : Ravulavaru
close
Learning Ionic, Second Edition

Learning Ionic, Second Edition

By: Ravulavaru

Overview of this book

Ionic makes it incredibly easy to build beautiful and interactive mobile apps using HTML5, SCSS, and Angular. Ionic also makes app development easier, faster, and more fun. This hands-on guide will help you understand the Ionic framework and how you can leverage it to create amazing real-time applications. We begin by covering the essential features of Angular 2, and then dive straight into how Ionic fits in today’s world of hybrid app development and give you a better understanding of the mobile hybrid architecture along the way. Further on, you will learn how to work with Ionic decorators, services, and components, which will allow you to build complex apps using the Ionic framework. We will take a look at theming Ionic apps using the built-in SCSS setup. After that, we will explore Ionic Native, and you will learn how to integrate device-specific features, such as notifications, with the Ionic app. To complete our learning, we will be building a Rider app, using Ionic and Uber API, to book a ride. Next, you will learn how to unit test, end-to-end test, monkey test, and execute device testing on AWS Device farm. Then, we will take a look at migrating the existing Ionic 1 apps to Ionic 2 and deploy them to the App Store. The final chapter on Ionic 3 wraps up this book by explaining the new features of Ionic 3 at the time of writing this book. By the end of this book, you will be able to develop, deploy, and manage hybrid mobile applications built with Cordova, Ionic, and Angular. All the examples in this book are valid for both Ionic 2 and Ionic 3.
Table of Contents (13 chapters)
close
close
Preface
Preface
What this book covers
What you need for this book
Conventions
Reader feedback
Customer support
Free Chapter
1
Angular - A Primer
chevron up
Angular - A Primer
What is new in Angular?
TypeScript primer
Angular
Giphy app
Summary
2
Welcome to Ionic
Welcome to Ionic
Mobile Hybrid architecture
What is Apache Cordova?
What is Ionic 2?
Ionic 3
Software setup
Hello Ionic
The browser developer tools setup
The Ionic project structure
Scaffolding the tabs template
Scaffolding the side menu template
Summary
3
Ionic Components and Navigation
Ionic Components and Navigation
Core components
The Ionic Grid system
Ionic components
Ionic navigation
Summary
4
Ionic Decorators and Services
Ionic Decorators and Services
Decorators
Navigation
Config service
Platform service
Storage service
Summary
5
Ionic and SCSS
Ionic and SCSS
What is Sass?
Ionic and SCSS
Theme a sample component
Summary
6
Ionic Native
Ionic Native
Setting up a platform-specific SDK
Testing the setup
Getting started with Cordova plugins
Working with Cordova plugins using Ionic Native
Summary
7
Building the Riderr App
Building the Riderr App
App overview
Uber APIs
Building Riderr
Summary
8
Ionic 2 Migration Guide
Ionic 2 Migration Guide
Why migration?
Todo app - Ionic v1
Migration plan
Summary
9
Testing an Ionic 2 App
Testing an Ionic 2 App
Testing methodologies
Setting up the unit testing environment
driftyco/ionic-unit-testing-example
E2E testing
Code coverage
AWS Device Farm
Automation testing
Summary
10
Releasing the Ionic App
Releasing the Ionic App
Preparing the app for distribution
Generating Installers using Cordova CLI
Ionic package
Summary
11
Ionic 3
Ionic 3
Angular 4
Ionic 3
Ionic 3 updates
Ionic 2 versus Ionic 3
Summary
Appendix
Appendix
Ionic CLI
Ionic help and docs
Ionic Creator
Ionic Cloud
Auth
IonicDB
Deploy
Push
Package
Summary

What is new in Angular?

Angular 2 is one of the most anticipated and dramatic version upgrades I have seen for any software. Angular 1 was a boon to web/mobile web/hybrid app developers, where managing a lot of things was made easy. Not only did Angular 1 help restructure client-side app development, but it also provided a platform to build applications; not websites, but applications. Though the first release suffered performance issues when dealing with large datasets, the Angular team bounced back quite well with the later releases of Angular 1, that is, Angular 1.4.x and above, and fixed these performance issues by releasing a more stable version in the form of Angular (2).

Some of the new changes that have accompanied with Angular (2) are:

  • Speed and performance improvements.
  • Component based (not the typical MV*).
  • Angular CLI.
  • Simple and expressive syntax.
  • Progressive Web Apps (PWA).
  • Cross-platform app development, which includes desktops, mobile, and web.
  • Cordova-based Hybrid app development.
  • Angular Universal provider for the server side for fast initial views.
  • Upgrades to better animation, internationalization, and accessibility.
  • Angular can be written on ES5, ES6, TypeScript, and Dart are based on the user's comfort with the JavaScript flavor.

With these new updates, developing apps has never been easier, be it on the desktop, mobile, or Mobile Hybrid environments.

Note: The latest version of Angular is going to be called just Angular, not Angular 2, or AngularJS 4, or NG4. So throughout this book, I will refer to Angular version 2 as Angular.

The current latest version of Angular is 4. Do checkout Chapter 11, Ionic 3, to know a bit more about Angular 4 and how it improves Ionic.

You can find more information about Angular here: https://angular.io.

Note: If you are new to Angular, you can refer to these books:

https://www.packtpub.com/web-development/learning-angular-2

https://www.packtpub.com/web-development/mastering-angular-2-components

https://www.packtpub.com/web-development/mastering-angular-2

https://www.packtpub.com/web-development/angular-2-example

Or these videos:

https://www.packtpub.com/web-development/angular-2-projects-video

https://www.packtpub.com/web-development/web-development-angular-2-and-bootstrap-video

https://www.packtpub.com/web-development/angular-2-web-development-TypeScript-video

End of Section 2
Next Section
bookmark search playlist download
font-size

Change the font size

margin-width

Change margin width

day-mode

Change background colour

Close icon Search
Country selected
Close icon Your notes and bookmarks

Delete Bookmark

Modal Close icon
Are you sure you want to delete it?
Cancel
Yes, Delete