Mobile App Development With Ionic, Revised Edition by Griffith, Chris -- Read -- Imperial Library of Trantor

Index

Foreword Preface

Who Should Read This Book Navigating This Book Online Resources Conventions Used in This Book Using Code Examples O’Reilly Safari How to Contact Us Acknowledgments

1. Hybrid Mobile Apps

What Is the Ionic Framework? What’s New in Ionic? Comparing Mobile Solutions

Native Mobile Applications Mobile Web Applications Hybrid Mobile Applications

Understanding the Ionic Stack

Ionic Framework Angular Cordova

Prerequisites for Ionic Application Development Summary

2. Setting Up Our Development Environment

Installing the Ionic Framework

Installing Node.js Installing Git Installing the Apache Cordova CLI Installing Ionic CLI

Starting a New Ionic Project

Ionic Project Folder Structure

Changes from Ionic 1 Previewing in the browser

Platform Tools Installations

iOS Android Windows Universal

Setting Emulators

iOS Android

Setting Up Your Devices

iOS Android

Adding Mobile Platforms Previewing on Emulator Previewing on Device Summary

3. Understanding the Ionic Command-Line Interface

Define Your Build Platforms Managing Cordova Plugins Ionic Generator Previewing Your Application The Ionic lab Command Specifying an IP Address to Use Emulating Your Ionic App

Emulating iOS Devices Emulating Android Devices

Running Ionic App on a Device Logging CLI information Summary

4. Just Enough Angular and TypeScript

Why Angular?

Components Inputs Templates

{ }: Rendering [ ]: Binding properties ( ): Event handling [( )]: Two-way data binding *: The asterisk

Events

Custom events Life cycle events NgModule Component init event Component life cycle events

Pipes @ViewChild

Understanding ES6 and TypeScript

Variables Classes Promises Observables Template Strings Arrow Functions Types Special Types Typing Functions :void

Summary

5. Apache Cordova Basics

The History of Cordova (aka PhoneGap) Apache Cordova versus Adobe PhoneGap A Deep Dive into Cordova Configuring Your Cordova App Device Access (aka Plugins) Interface Components: The Missing Piece Why Not Cordova? Understanding Web Standards Summary

6. Understanding Ionic

HTML Structure Ionic Components Understanding the SCSS File Understanding TypeScript Summary

7. Building Our Ionic2Do App

Adding Our Build Platforms Previewing Our Ionic2Do App

Understanding the index.html File Exploring the app Directory

The pages directory The home.html file The home.ts file The build directory The theme directory The assets directory The declarations.d.ts file The manifest.json file The service-worker.js file

Updating the Page Structure Adding Full-Swipe Gesture Simple Theming Proper Typing Saving Data Creating a Firebase account Installing Firebase and AngularFire2 Ionic Build System Adding AngularFire to Our app.module.ts File Using Firebase Data Using Ionic Native Summary

8. Building a Tab-Based App

Bootstrapping Our App Loading Data via the HTTP Service Display our Data

Extending parklist.ts

Generating New Pages Understanding the Ionic Navigation model

Passing Data Between Pages

Updating the Park Details Page Add a Google Map

Adding Additional Typings Adding Our Content Security Policy Adjust the CSS to support the Google Map

Rendering the Google Map Add Map Markers

Making the Markers Clickable

Adding Search Theming Our Application Virtual Scrolling Custom List Headers Summary

9. Building a Weather Application

Getting Started Exploring the Side Menu Template

Exploring the app.component.ts File

Side Menu Options Displaying the Menu Converting the Template Mocking Up Our Weather Provider Laying Out the Weather Data Loading Feedback: Loading Dialogs and Pull to Refresh Adding GeoLocation Accessing Live Weather Data Connecting the Geolocation and Weather Providers Getting Other Locations’ Weather Pull to Refresh: Part 2 Editing the Locations

Deleting a City Adding a City

Using a Geocoding Service Dynamically Updating the Side Menu Ionic Events Observables Styling the App Add a Weather Icon Next Steps Summary

10. Debugging and Testing Your Ionic Application

Dealing with CORS Issues Debugging Through an iOS or Android Simulator

Android

Debugging On-Device

Android iOS

Debugging Ionic Initialization Additional Tools Summary

11. Deploying Your Application

Adjusting the config.xml File App Icons and Splash Screens Building Your Android APK

Generating the Signing Key Submitting to the Google Play Store

Building Your iOS App

Request a Distribution Certificate Create a Distribution Provisioning Profile Creating the App Listing Building the App for Production Creating an Archive of the Application Using TestFlight Beta Testing Releasing to the App Store

Summary

12. Exploring the Ionic Services

Setting Up Ionic Services Generating Your Ionic App ID Configuring Your Application Ionic Deploy

Setting Up Ionic Deploy Testing Ionic Deploy

Enabling Ionic Deploy Checking for a new snapshot Creating a snapshot Setting snapshot metadata Using binary versioning

Security Profiles

Creating a Profile iOS Setup Supporting iOS Push Notifications Android Setup Android Push Notifications

Ionic Package

Preparing a Release Build Getting Build Information Getting Your Build Results Downloading Your Build Updating Your Cordova Plug-ins

Ionic View

Supported Plug-ins Uploading Your App Viewing Your App

Ionic Creator Summary

13. Progressive Web Apps

But What, Exactly, Is a Progressive Web App? The manifest.json File Service Workers Push Notifications What’s Next?

14. Conclusion

Components You Should Know About

Slides Date-Time Popover Reorder List DeepLinker Storage

Next Steps Ionic Forums

Ionic Worldwide Slack Channel GitHub

Conclusion

A. Migrating From Ionic 1

Create a New Ionic Application

Create Your Page Structure Update the Theming Replacing Your Controllers and Views Replace Your Factories/Services Convert the Application Initialization Update the Routing

Switching to Ionic Native Conclusion

B. Understanding the Config.xml File

Essential Properties Preferences

Common General Preferences Common iOS Preferences Common Android Preferences Common Windows Preferences

Icons

Android iOS Windows

Splashscreens

Android iOS Windows

Plug-ins Features Reference

C. Ionic Component Library Index

← Prev
Back
Next →

← Prev
Back
Next →