Converting Your Ionic Framework 1 Application To Ionic 2

Ionic Framework has been around for a few years now and has completely changed the way people develop hybrid mobile applications. With Angular out and Ionic 2 nearing stable release, the Ionic 1 and AngularJS predecessor will be a thing of the past and forgotten. What if you’ve gone all in with the first version of Ionic Framework, how do you convert to the latest and greatest?

We’re going to see how to take a simple Ionic Framework application and convert it to Ionic 2. While there will be similarities, the process is manual, but better in the long run.

Use Mozilla’s LocalForage For Key-Value Storage In Ionic 2

When it comes to saving data in an Ionic 2 mobile application, there are many ways to get the job done. You can use the classic HTML5 local storage, but run the risk of compatibility problems between all available devices. You can use SQLite, which is part of Ionic Native, but that will only work for Android and iOS and has more of a mobile API. You can also use SqlStorage, but that is a very proprietary solution. This brings us to localForage from Mozilla.

Mozilla advertises localForage as a wrapper to IndexedDB, WebSQL and localStorage which will offer maximum compatibility across the grid.

We’re going to see how to include localForage in our application which is a valid option for Ionic 2.

Using SqlStorage Instead Of SQLite In An Ionic 2 App

When it comes to Ionic 2 there are many ways that you can store your data. For example you could use HTML5 local storage, Mozilla’s localForage library, or Ionic’s SQLite extension that is part of Ionic Native. With these options available, I get a lot of requests for information on Ionic’s less advertised SqlStorage option.

We’re going to take a look at using SqlStorage in an Android and iOS application rather than the SQLite alternative.

Build A Password Manager For Android And iOS Using Ionic 2

Have you ever wanted to build your own password manager? Maybe you don’t trust the password management tools that already exist, or maybe you just want the experience. I personally use the tool 1Password, but many of my friends don’t trust the applications that exist on the market. It is a valid concern that they have. What if the password managers that exist are using an ancient or obsolete DES specification or similar, rather than the modern AES? What if the master passwords are not being hashed with a strong Bcrypt algorithm?

Not too long ago we created a password manager using the NativeScript framework, but what if we wanted to build one with a different technology.

We’re going to see how to build a password manager that makes use of the AES specification using Ionic 2 and Angular. This application will work for both Android and iOS and look great on both.

Using Local Notifications In Your Ionic 2 Mobile App

A little more than a year ago I wrote a tutorial regarding using local notifications in an Ionic Framework Android and iOS application, but Ionic Framework and AngularJS is rapidly becoming a thing of the past. Lately, anything Angular is all the rage and that includes frameworks that use it like Ionic 2. This inspired me to update my previous tutorial for the latest and greatest.

Let’s take a step back though. Why would one want to use local notifications in their mobile application? Well, one example might be in iBeacon detection. An iBeacon comes into range and a notification might show. That is just one of many examples. Let’s also not confuse local notifications with push notifications. Local notifications have no interaction with a service like Firebase Cloud Messaging (FCM) or Apple Push Notification Service (APNS).

We’re going to see how to schedule notifications and perform tasks based on various actions around the notifications.

Working With Shared Providers In An Ionic 2 Mobile App

When developing an Ionic 2 application there are often scenarios where it probably isn’t a good idea to include repetitive source code in multiple application pages. A common example of this would be when it comes to database interaction in an Ionic 2 application. Sure you could establish a connection to the database on every page and query it, but it would probably make more sense to use it like a shared provider.

We’re going to see how to create a SQLite shared provider, often referred to as a shared service or sometimes a singleton class, in an Ionic 2 Android and iOS application using Angular.

Build An RSS Reader Mobile App With Ionic 2 And Angular

If you’re a long time follower of my blog you’ll remember I wrote an article about creating an RSS reader using Ionic Framework. That tutorial not only used the first version of Ionic Framework, but it now also uses a deprecated Google service, once known as the Google Feed API. Because of the deprecated API, it no longer works.

I still get a lot of people asking me about the creation of RSS readers, so I figured it was time to come up with a new solution. With Ionic 2 being all the rage, it makes sense to explore feeds with this version of the framework.

Here we’ll be building an RSS feed reader for Android and iOS using Ionic 2 and Angular with TypeScript.