Ionic Tutorials

Hero image for article
Icon for article
intermediateionicperformancescalability

High Performance List Filtering in Ionic & Angular

7 min read

In this tutorial, we are going to discuss how to create efficient list filtering solutions in an Ionic/Angular application

Hero image for article
Icon for article
advancedbackendionic2jwtsecurity

Using JSON Web Tokens (JWT) for Custom Authentication in Ionic 2: Part 1

6 min read

In this tutorial, we are going to talk a bit more about what a JSON Web Token is, and how we can use them to create our own custom authentication with the Ionic Cloud platform.

Hero image for article
Icon for article
advancedauthenticationbackendherokuionic cloudionic2jwt

Using JSON Web Tokens (JWT) for Custom Authentication in Ionic 2: Part 2

10 min read

As well as allowing users to sign in with email and social services, Ionic also allows you to provide your own custom authentication that integrates with their cloud platform

Hero image for article
Icon for article
datahttpintermediateionic2

How to Manipulate Data in Ionic 2: Part 1

6 min read

In this tutorial, we are going to discuss how exactly the `http.get()` method works, and how we can hook into that process to return data in a more friendly format.

Hero image for article
Icon for article
dataintermediateionic2

How to Manipulate Data in Ionic 2: Part 2

8 min read

In this tutorial we are going to focus on how to manipulate that data once it is inside of our application using mapping, filtering and reducing.

Hero image for article
Icon for article
advancedauthenticationbackendionic2jwtnodepassport

Creating Role Based Authentication with Passport in Ionic 2 – Part 2

10 min read

In this tutorial, I will be walking you through how to make use of the role based authentication API we created in the previous tutorial.

Hero image for article
Icon for article
advancedauthenticationbackendionic2jwtnodepassport

Creating Role Based Authentication with Passport in Ionic 2 – Part 1

14 min read

In this tutorial, I am going to show you how to create a flexible, role-based authentication system using Passport and the MEAN stack.

Hero image for article
Icon for article
angularfirebackendfirebaseintermediateionic2

Building a CRUD Ionic Application with Firebase & AngularFire

7 min read

Firebase is one of the most powerful and popular Database as a Service (DBaaS) solutions available today. It provides a document based NoSQL database, with real-time capability.

Hero image for article
Icon for article
cordovaintermediateionic2notifications

Getting Familiar with Local Notifications in Ionic 2 & 3

8 min read

In this tutorial, we are going to walk through how you can create a basic application that can schedule local notifications.

Hero image for article
Icon for article
animationintermediateionic2ui

Build a Custom Flash Card Component in Ionic 2 & 3

4 min read

In this tutorial, we will be building our own custom flash card component in Ionic 2

Hero image for article
Icon for article
animationintermediateionic2uivideo

Build a Custom Flash Card Component in Ionic 2 – Part 2

1 min read

In this tutorial, we will be building our own custom flash card component in Ionic 2

Hero image for article
Icon for article
beginnergitionic2video

How to Use Git with Ionic 2 Projects

1 min read

Learn how to use Git and Bitbucket (or GitHub) in your Ionic 2 projects

Hero image for article
Icon for article
animationintermediateionic2uiux

Create a Sliding Item Animation with a Directive in Ionic 2 & 3

6 min read

In this tutorial, we are going to walk through how to create a directive to create an animation for a sliding item.

Hero image for article
Icon for article
animationintermediateionic2

Create a Data Driven Quiz App in Ionic 2 & 3 – Part 1

5 min read

In this tutorial, we are going to walk through how to build a quiz application in Ionic 2.

Hero image for article
Icon for article
intermediateionic2uiuxvideo

Creating an Asynchronous Login Screen in Ionic 2

1 min read

In this video tutorial, we are going to walk through how to create an asynchronous login screen in Ionic 2.

Hero image for article
Icon for article
advancedgeolocationgoogle mapsionic2

Create a Nearby Places List with Google Maps in Ionic 2 – Part 1

5 min read

In this video tutorial, we are going to walk through how to create an asynchronous login screen in Ionic 2.

Hero image for article
Icon for article
animationintermediateionic2

Create a Data Driven Quiz App in Ionic 2 & 3 – Part 2

5 min read

In this tutorial, we are going to finish off the application by loading in some real data, adding the logic required for navigating through the quiz, and adding some styling.

Hero image for article
Icon for article
intermediateionic2video

Filtering, Mapping, and Reducing Arrays in Ionic 2

1 min read

In this video tutorial, we will walk through a quick and practical example of applying filter, map, and reduce functions to a list of data in Ionic 2.

Hero image for article
Icon for article
beginnerionic2uivideo

Hacking CSS in Ionic 2

1 min read

You can use Ionic's built in utility attributes, you can overwrite SASS variables or create your own, and you can also define your own custom CSS rules.

Hero image for article
Icon for article
advancedgoogle mapsionic2

Create a Nearby Places List with Google Maps in Ionic 2 – Part 2

5 min read

In this tutorial, we will be extending the application so that we can display markers on the map, and display some real data (along with the calculated proximity information) in the list.

Hero image for article
Icon for article
advancedanimationionic2performanceui

High Performance Parallax Animation in Ionic 2

7 min read

In this tutorial, I am going to walk through how to build a high-performance parallax directive for Ionic 2.

Hero image for article
Icon for article
beginnerionic2ui

A List of Common CSS Utility Attributes in Ionic 2

3 min read

In this post, I am going to introduce you to some of the key utility attributes that Ionic provides.

Hero image for article
Icon for article
beginnerionic2uiuxvideo

Conditional Attributes, Styles, and Classes in Ionic 2

1 min read

In this video tutorial, we take a look at how to conditionally apply attributes, styles, and classes to elements in Ionic 2.

Hero image for article
Icon for article
beginnerionic2uiuxvideo

Component and Template Interaction in Ionic 2

11 min read

In this video tutorial, I introduce the concepts of Property Binding, Event Binding, Interpolation, and Two-Way Data Binding

Hero image for article
Icon for article
google mapsintermediateionic2uiux

Create Marker Clusters with Google Maps in Ionic 2

4 min read

In this tutorial, we are going to walk through how to add marker clustering to a Google Map in an Ionic 2 application