Ionic Tutorials

Hero image for article
Icon for article
intermediateionic2

How to Create a Custom Loading Component in Ionic 2

2 min read

I'm going to show you how you can implement your own custom loading service in Ionic 2

Hero image for article
Icon for article
beginnercordovaionic2plugins

Using Cordova Plugins in Ionic 2 with Ionic Native

5 min read

Now that we've covered that bit of theory, let's get into how to actually use Ionic Native (it's pretty easy).

Hero image for article
Icon for article
intermediateionic2performance

Boosting Scroll Performance in Ionic 2

4 min read

The basic idea is that we only create enough elements in the DOM to display the list data that is currently on screen, and we recycle those DOM elements.

Hero image for article
Icon for article
apibackenddropboxintermediateionic2

Integrating Ionic 2 & 3 with the Dropbox API – Part 1

10 min read

In this tutorial, we are going to create an Ionic 2 application that integrates with the Dropbox API. We are going to create an application that will return a

Hero image for article
Icon for article
cordovaintermediateionic2plugins

Adding Background Geolocation to an Ionic 2 & 3 Application

5 min read

In this tutorial I am going to show you how you can enable Background Geolocation in your Ionic 2 applications.

Hero image for article
Icon for article
apibackenddropboxintermediateionic2

Integrating Ionic 2 & 3 with the Dropbox API – Part 2

6 min read

In this part of the tutorial we are going to be using the Dropbox OAuth 2 flow to authenticate a user and retrieve their access token.

Hero image for article
Icon for article
beginnerionic2theming

An In Depth Look at the Grid System in Ionic 2 & 3

4 min read

In this tutorial we are going to cover one specific component, which is the cornerstone for building complex layouts in Ionic 2 The Grid

Hero image for article
Icon for article
beginnerionic2typescript

Ionic 2: TypeScript vs ECMAScript 6

5 min read

TypeScript and ECMAScript 6 are not really two different things battling it out, TypeScript is just an extension of the standard ECMAScript 6 syntax.

Hero image for article
Icon for article
angulardiscussionionic

Why I Released an Ionic 2 & Angular 2 Application

6 min read

Despite the reasons why you shouldn't use Ionic 2 to build production applications right now that I've listed above, I've gone ahead and done it anyway.

Hero image for article
Icon for article
angular2intermediateionic2

Using Angular 2 without Ionic 2: Part 1

5 min read

In the first part of this tutorial series we are going to focus on getting up an running with Angular 2, "hello world" style.

Hero image for article
Icon for article
beginnerionic2

An Introduction to Lists in Ionic 2 & 3

8 min read

In this tutorial we are going to focus on going through the core concepts of how to use lists in Ionic 2

Hero image for article
Icon for article
advancedbackendionic2mongodbnodenosql

Building a Review App with Ionic 2, MongoDB & Node

7 min read

In this tutorial we will be creating a simple review application in Ionic 2 powered by the MEAN stack - MongoDB, Express, Angular, and Node.

Hero image for article
Icon for article
advancedbackendcouchdbdatabaseionic2pouchdb

Offline Syncing in Ionic 2 with PouchDB & CouchDB

9 min read

In this tutorial we will be creating a todo list application called 'ClouDO' which will store data in a remote database and locally with offline syncing.

Hero image for article
Icon for article
ionic2

An In-Depth Explanation of Providers in Ionic 2

6 min read

This tutorial isn't going to focus on how to build specific services, but rather how they work and how to use them in general.

Hero image for article
Icon for article
angularbeginnerionic

Ionic 2: How to Create a Sliding Delete Button for Lists

4 min read

In this tutorial I'm going to show you how you can use Ionic 2 to add a simple delete button to your lists.

Hero image for article
Icon for article
beginnerionic2typescript

Converting ECMAScript 6 to TypeScript in Ionic 2

4 min read

In this tutorial I am going to show you how to take some ES6 code and convert it to TypeScript

Hero image for article
Icon for article
advancedbackendcouchdbionic2pouchdb

Part 2: Creating a Multiple User App with Ionic 2, PouchDB & CouchDB

9 min read

In this tutorial we are going to extend the cloud based todo application that was created previously with Ionic 2, to support multiple users and authentication.

Hero image for article
Icon for article
advancedbackendionic2mongodbnodenosql

Building a Hotel Booking App with Ionic 2, MongoDB & Node

10 min read

This tutorial will get into more advanced MongoDB concepts, including updating data and running complex queries on data.

Hero image for article
Icon for article
beginnercssionic2

Tips & Tricks for Styling Ionic 2 Applications

7 min read

I've been doing a lot of work with Ionic 2, including creating a lot of custom themes, and in this post I am going to focus on some specific "tips & tricks".

Hero image for article
Icon for article
angular2animationsintermediateionic2

Using the Web Animations API in Ionic 2

8 min read

In this tutorial, we will be building a simple Ionic 2 application that implements four different animations with Angular 2 animations.

Hero image for article
Icon for article
cordovaintermediateionic2

Ionic GO – Create a Pokémon GO Style Interface in Ionic 2

5 min read

In this tutorial we are going to create our own, very simple, example of augmented reality. We will be recreating the Pokémon GO interface.

Hero image for article
Icon for article
angularbeginnerionictheming

A Guide to Styling an Ionic 2 Application

7 min read

In this tutorial I'm going to show you the different ways you can customise your Ionic 2 applications, and the theory behind theming in general.

Hero image for article
Icon for article
cordovagooglegoogle mapsintermediateionic2

Integrating Native Google Maps into an Ionic 2 Application

5 min read

The Google Maps Javascript SDK does a great job and performs well. There is another option available though, and that is the Google Maps plugin for Cordova.

Hero image for article
Icon for article
animationintermediateionic2

Create an Animated Login Screen in Ionic 2

4 min read

This tutorial will walk you through creating a custom login screen with some animations in Ionic

Hero image for article
Icon for article
apiintermediateionic2soundcloud

Streaming Music from SoundCloud in Ionic 2: Part 1

7 min read

In this tutorial we will be walking through how to stream music from SoundCloud in an Ionic 2 application