Alter The Ionic 2 Gulp Script To Include Browser JavaScript Files

Recently I found myself needing to add a JavaScript library to an Ionic 2 TypeScript project. Now you’ll probably recall that I’ve written two different articles regarding using JavaScript libraries in TypeScript project. I wrote about including a JavaScript library in an Ionic 2 app in a guest post I did, but the scenario had the JavaScript library coming from the Node Package Manager (NPM). I also wrote about including a JavaScript library in an Angular app, but the project structure is a little more web friendly in that scenario.

My new scenario is including a JavaScript file, rather than NPM package. The project structure in an Ionic 2 application is a bit different than others. We can’t just include JavaScript files wherever we want because the build process could very well wipe them out. Instead we have to change the Gulp build process for the Ionic 2 application.

We’re going to see how to alter the Ionic 2 Gulp script to allow us to include external JavaScript files in our project.

Create A Simple Todo List App Using Ionic 2 For Android And iOS

I’ve created a few tutorials around Ionic 2 while it was in its early alpha stage up until now. These tutorials explain how to use the bits and pieces that the framework or Angular offers, but I never demonstrated how to make a functional application. Seeing how to put the pieces together makes a huge difference when learning a new technology.

We’re going to see how to build a simple todo list type Android and iOS application using Ionic 2, Angular, and TypeScript.

Converting Your Ionic 2 Mobile App To NativeScript

As many of you know, I had been using Apache Cordova based frameworks such as Ionic Framework for a long time. They are convenient and easy to use when it comes to rapidly developing cross platform applications. The problem with using Apache Cordova frameworks such as PhoneGap, Ionic Framework and Onsen UI is the performance limitations that come with them, particularly because of their use of the platform web view.

NativeScript is a mobile development platform that I recently switched to because it eliminates the performance issues that people experience with web view based frameworks. This is because it doesn’t render your application in a web view. Instead the application gets compiled to native code giving the same performance you’d see in an app that was developed with Objective-C or Java.

Being that I spent a long time with Ionic Framework and Ionic 2, which uses AngularJS and Angular, I figured it would make sense to show how easy it is to convert your application to NativeScript, which also uses Angular. As an end result you’ll get a cross platform web application, built with a modern framework, that is native.

Send Emails In An Ionic 2 App Via The Mailgun API

Not too long ago I wrote about sending emails in an Ionic Framework app using the Mailgun API. To get you up to speed, I often get a lot of questions regarding how to send emails without opening the default mail application from within an Ionic Framework application. There are a few things that could be done. You can either spin up your own API server and send emails from your server via an HTTP request or you can make use of a service.

To compliment the previous post I wrote for Ionic Framework, I figured it would be a good idea to demonstrate how to use Mailgun in an Ionic 2 application.

Use The Device Camera In An Ionic 2 Android And iOS App

As I continue to port my Ionic Framework tutorials to Ionic 2, I figured it was time to discuss how to make use of the device camera within an application. There are often needs to obtain pictures within an application. Maybe you’re creating an application like Imgur, or maybe you just want to be able to obtain a profile picture. Like I mentioned, I had written a camera tutorial a few years back on how to use the camera in an Ionic Framework application.

This time around we’re going to see how to snap pictures within an Ionic 2 Android and iOS mobile application.

Use Font Awesome Icons In Your Ionic Android And iOS App

Creating your own in-app icons can be a real pain. Having to worry about all the different Android and iOS icon sizes is not a pleasant task, specially when web developers have it easy with icon packs like Font Awesome. Lucky for us, Ionic is a mobile web application, so we can enjoy the same benefits that web developers have.

Previously, I demonstrated how to include Font Awesome into an Ionic Framework 1 application, but that version of the framework is becoming old news because Ionic 2 is stealing the spotlight.

This time around we’re going to see how to use the 400+ icon fonts that Font Awesome offers in our Ionic 2 Android and iOS application.

Add Touch ID Authentication To An Ionic Mobile App

So you want to take advantage of your iOS devices touch id functionality? I don’t blame you because I find my iPad Air 2’s fingerprint reader incredibly useful. Previously I wrote about using touch id for authentication with Ionic Framework 1, but with Ionic 2 being all the rage now, I figured we were due for an update.

We’re going to see how to authenticate our Ionic 2 application using the iOS touch id features and Angular.