CouchDB and Ionic

CouchDB, PouchDB, and Ionic 2: Why PouchDB?

In the last tutorial, we started a new project using CouchDB and Ionic 2. We are working towards building a simple blogging application, and so far we have our CouchDB database set up, along with a CouchDB MapReduce view to retrieve all of the posts in the database by the date they were published, and […]

Expandable Header in Ionic 2

Creating a Custom Expandable Header Component for Ionic 2

One of my favourite pastimes is trying to implement cool looking user interfaces that people send me in Ionic 2. A little while ago, somebody sent through this example from AirBnB. I set out to build a simple implementation of this, and ended up with a custom component that looks like this: The header height […]

CouchDB and Ionic

Getting Familiar with CouchDB and Futon

Over the past few weeks, I’ve been working on writing a series of tutorials on how to use CouchDB and PouchDB in Ionic 2. This video tutorial is sort of an aside to that – I wanted to create a demonstration of creating CouchDB databases and playing around with the data a bit, just to […]

Elvis Operator in Ionic 2

Safely Displaying Data with the Elvis Operator

When building Ionic 2 applications, our classes and templates work hand in hand to render the view that the user sees. Our classes are able to define data that we can display in templates through property bindings, and our templates can trigger functions in our classes through event bindings. If you’re unfamiliar with the concept […]

CouchDB and Ionic

CouchDB, PouchDB, and Ionic 2: Starting a New Project

Over the past couple of weeks, I’ve been introducing some of the theory behind creating applications powered by CouchDB. As promised, this week we will finally start actually building something with it. Over the next few tutorials, we will be building a blogging application in Ionic 2 that uses CouchDB as its database and backend. […]

Security in Ionic

[VIDEO] Basic Security for Ionic & Cordova Applications

I recently wrote an article with some basic security advice for Ionic and Cordova applications, but I thought it would be worthwhile discussing those concepts in a little more depth. In this video tutorial, I talk through the concepts that I brought up in the security article. Here’s the video:Follow @joshuamorony Video Notes You don’t […]

Live Coding Drag Directive

“Live” Coding a Custom Directive in Ionic 2

I’m trying something a little bit different with this video. Most of the videos I create aren’t scripted, but I do have a general plan of attack before recording and, more or less, know what I am going to say and do. I’ve created multiple custom components and directives in the past, and have done […]

Phaser Collisions

Phaser Fundamentals: Handling Collisions

When building a game with Phaser you will likely have various objects on the screen. You might have the players character, a floor or some walls, some enemies, items, and so on. These entities are going to need to interact with one another in some way to make the game playable. If a player touches […]

Sending Post Request in Ionic 2

How to Send Data with POST Requests in Ionic 2

In the past, we have covered how to make a simple GET request to load data from a server, and for the most part, making a POST request is pretty much the same. There are a few key differences, though, including the fact that a POST request also includes a body, and there’s also a […]

Listening for Host Events

Listening to Events on a Host Element in Ionic 2

When creating a custom directive (and in other circumstances) you may be interested in listening for events that are happening on the host element. Let’s say for example that I created a custom directive that I wanted to attach to the <ion-content> component, like this: The host element, which is <ion-content> in this example, may […]

Testing in Ionic 2

E2E (End-to-End) Testing in Ionic 2: An Introduction

Over the past few weeks, I have been releasing a series of tutorials on creating automated tests for Ionic 2 applications. The tutorials so far have focused on how to apply the Test Driven Development (TDD) methodology to unit test an Ionic 2 application. If the concept of automated tests is new to you, or […]

CouchDB and Ionic

CouchDB, PouchDB, and Ionic 2: An Introduction

Databases. The creatures that often live somewhere in the cloud and hoard all of the data for your application. Although they can be troublesome to work with, they allow you to turn your isolated application into one that can share and communicate with the world. There are many different options available, and different options are […]

RxJS Observables

An Introduction to Observables for Ionic 2

Observables are one of those new tricky things you will almost certainly run into at some point when building an application with Ionic 2. They can seem a little weird and overwhelming at first, and you might wonder “why can’t we just stick to promises?“, but they are quite beautifully implemented. At a basic level, […]

Drag Directive in Ionic 2

Building an Absolute Drag Directive in Ionic 2

Recently I sat down to record a screencast of myself building out a new directive in Ionic 2. It was quite a simplistic directive, but the intent was to build it from start to finish with no prior planning involved so that I could show people the types of roadblocks I run into and the […]

List Reorder in Ionic 2

Reordering a List in Ionic 2

It’s super easy to create lists in Ionic 2, and it’s also super easy to allow a user to reorder them. With the addition of a simple attribute, you can turn your normal <ion-list> into a reorderable one. In this video tutorial, I walk through exactly how to create a reorderable list in Ionic 2. […]

TypeScript Errors

How to Fix Common TypeScript Errors in Ionic 2

Early on in the development of Ionic 2, the team decided to fully embrace TypeScript over plain ES6 JavaScript. All Ionic 2 projects use TypeScript by default, and it’s quite difficult to modify the project to be rid of TypeScript. TypeScript is really just JavaScript with some added bonuses, though, so there are not really […]

Sliding Content Drawer in Ionic 2

How to Create a Sliding Drawer Component for Ionic 2

Since I create a lot of content, I often ask for suggestions on tutorials I should write. If I find a suggestion is particularly interesting or I think it will benefit a lot of people, I’ll generally end up creating a tutorial at some point – so do feel free to suggest them. The other […]