Developing an Ionic Edge by Keith D. Moore, Robin van Baalen, Anton Shevchenko, Diego Netto, Alan Levicki, Chris Marshall -- Read -- Imperial Library of Trantor

Index

Preface

Why use Ionic? What should readers know prior to reading this book? Source code/sample app What will this book teach you? The writing process Authors Acknowledgments

1. Introduction

Ionic

2. Development environment, tooling, and workflow

Installing prerequisites: Node.js and Git

Installing Node.js Installing Git

Installing Ionic

Cordova

Ionic Command Line Interface (CLI)

Starting a new project Developing in the browser

Ionic Lab Proxies

Adding a platform Creating a build Running your build on an emulator Running on a device

iOS Android Android SDK local installation Ionic box

Adding plugins Generate icons and splash screen

Source control best practices

Git and templated applications Root files Included directories Excluded directories

Summary

3. Trendicity

Side menu

Home Favorites

Favorites List Adding Favorites Add Favorite Form Directive Removing Favorites Favorites Service

About Login/Logout

Loading service

Map view tab Card view tab

Working files Introductory popup Card view Card view controller

List view tab

Related files Template layout Refreshing the list of posts List of posts Liking posts Displaying options with action sheet

Summary

4. Implementing a side menu and setting up the routes

Introduction to Ionic’s side menu directives

ion-side-menus ion-side-menu-content

Disabling content dragging to open the side menu

ion-side-menu

Programmatically disabling the side menu

ion-header-bar

Aligning the header title

Wrapping up the side menu

Last but not least

Handling routes with the Angular UI Router component

About Angular UI The future of AngularJS application routing Setting up the application routes Defining the root state Defining a state with named view and custom template and controller Finished routing Trendicity

5. Integrating a map view with Ionic

Picking an AngularJS directive for Google Maps

The candidates

angular-google-maps ui-maps LeafletJS And the winner is

Creating the geolocation utility service

Implementing ngCordova and the $cordovaGeolocation service $ionicPlatform.ready()

Converting addresses to geolocation objects using the Google Maps Geocode API Setting up the map view inside a tab

Touchstart, touchend, and click events on touch-enabled devices ui-gmap-google-map ui-gmap-markers Overriding the Nav Bar

Map View Controller

Initializing the Controller Refreshing Posts Locating the User Displaying Posts Loading a Favorite Location

Summary

6. Authentication

Desired user experience Incorporating angular-http-auth

OAuth2 based approach Token-based approach

Cancel login Summary

7. Designing the application

Layout components

Designing Trendicity

Ionicons

Creating native-looking applications

Customizing Ionic with Sass

Overriding Ionic design with Sass Using Sass in Trendicity Gotchas

Extending Ionic Summary

8. Instagram Service

Authentication

Device/Simulator Desktop Browser

Logout

CORS Non-Authenticated Requests Authenticated Requests Summary

9. What’s next?

Promoting your Ionic application Prototyping with Ionic Creator Ionic’s evolution

Ionic CLI Ionic View AngularJS 2.0 Support ngCordova Ions Other Tidbits

Ionic as a platform Summary

← Prev
Back
Next →

← Prev
Back
Next →