How To Create A Node.js Microservice For Your Ionic App

In my previous post I created an Ionic 2 app that reads the posts from a Facebook Page and displays them in the app. I also mentioned that hard coding the Access Token for the Facebook Graph API within the app wasn't ideal, since it can be stolen by anyone who decompiles your app. In this post we'll create a very simple Node.js service that will handle the call to the Facebook Graph API for us, so we don't need to include the Access Token in our Ionic app anymore. Read More

Ionic, Ionic 2+, Node.js, ES6

Bring Your Ionic App to Life: Getting Started with D3.js

Learn how to use D3.js with this guest post by Hunter Leaman, creator of the Rapid Prototyping with Ionic: Build a Data-Driven Mobile App course. Read on until the end for a special offer! Over the past few years, D3.js has emerged as the web standard for data visualization and charting by enabling developers to take full advantage of everything modern browsers have to offer, which is a lot… you can take a look at their examples to see for yourself (there are nearly 100 of them!). In this article, I’m going to demonstrate how to install, setup, and use D3.js in an Ionic application. Read More

Ionic, D3.js

How To Animate Your Ionic App With Animate.css And ngAnimate

Animate.css is a stylesheet that contains cross-browser animations to use in any type of hybrid app or website. ngAnimate is a module that allows you to create your own animations using CSS transitions/animations or JavaScript. It doesn't have any built-in default animations, it only adds triggers to elements for certain AngularJS directives. Sounds confusing? Don't worry, we'll have a look at how this works. Read More

Ionic, ngAnimate, Animations, Animate.css

How To Write Automated Tests For Your Ionic App - Part 1

Have you ever wasted hours trying to fix something you broke in your code because you made a change, didn't test it properly, and only find out it's broken days later? That happened to me recently while working on an Ionic app. I am a big fan of automated testing, but I kept putting it off for my Ionic project because I didn't have time to get familiar with the testing frameworks for Angular. Read More

AngularJS, Ionic, Testing, Karma, Jasmine, Protractor

How To Use PouchDB + SQLite For Local Storage In Your Ionic App

I was recently looking into local storage options for an Ionic app. From what I could find, the most popular choice is to use a SQLite database. However, I kept running into people mentioning PouchDB to store data locally and sync it with a server, but I didn't need a server for this particular app. PouchDB also uses a NoSQL approach to database storage, and I come from a SQL background, so I figured I should just go with SQLite. After reading a bit more, I realized that development would be a lot faster and easier with PouchDB, even if you only use it for local storage. Read More

AngularJS, Ionic, PouchDB, SQLite, Local Storage

How To Tweak The Keyboard For HTML5 Text Input Fields On iOS

If you're building hybrid apps or mobile websites, you probably already know that the keyboard on the device can be influenced by defining the correct type for your <input> fields. But did you also know that you can change the behaviour of the iOS keyboard, when it comes to auto-correction and auto-capitalization, with attributes? Let's have a look at how to do this! Read More

Mobile App, Ionic

How To Group Items In Ionic's Collection-Repeat

The Ionic Framework has a collection-repeat directive that you can use, instead of ng-repeat, when you need to display very large lists. I was looking for a way to group items in a collection-repeat list by date, more specifically by the combination of month and year. I had a look at the Ionic Demo for collection-repeat where they group the list by last name. We'll take that code and modify it to do grouping by date. Read More

AngularJS, Ionic