The Ionic React Image Guide with Capacitor (Capture & Store)

In this tutorial, we will create a simple Ionic React photo gallery app that can be run and deployed on the web, iOS, and Android with the help of Capacitor.

Sign in with Apple using Supabase and Ionic Angular

Sign in with Apple has become a standard most websites implement, and with Supabase we can easily add this to our Ionic application!

Create Shared Element Transition in Ionic React App using Framer Motion

Learn how to use Framer Motion to create shared element transition in a React Ionic application. Follow along to create a card expansion animation.

How to Add In-App Purchases & Subscriptions to your Ionic App with Glassfy

If you want to monetise your Ionic app you can use the native iOS and Android platforms to integrate items to purchase, but you can make the whole process a lot more transparent with another tool.

How to Write Unit Tests for your Ionic Angular App

Did you ever wonder what the *.spec file that is automatically generated for your pages and services is useful for? Then this tutorial is exactly for you!

How to Secure your App with Ionic Identity Vault

If you are serious about your Ionic app development and want the most secure functionality when working with user data and APIs, you should take a closer look at Ionic Identity Vault.

Celebrating 5 Years Ionic Academy

Exactly today the Ionic Academy started 5 years ago – and to kick off the anniversary celebration week I’m offering the initial monthly discount from 5 years ago again!

Building an Ionic App with Firebase Authentication & File Upload using AngularFire 7

If you want a full blown cloud backend for your Ionic app, Firebase offers everything you need out of the box so you can setup your Ionic app with authentication and file upload in minutes!

How to Setup Deep Links With Capacitor (iOS & Android)

Taking your users directly into your app with a universal link on iOS or App Link on Android is one of the easiest ways to open a specific app of your Ionic page, and becomes a super easy task with Capacitor.

Build Your First Ionic App with Firebase using AngularFire 7

Using Firebase as the backend for your Ionic apps is a great choice if you want to build a robust system with live data fast, and by using AngularFire you can use a simple wrapper around the official Firebase JS SDK.

The Ionic Image Guide with Capacitor (Capture, Store & Upload)

Capturing, storing and uploading image files with Ionic is a crucial task inside many applications, even if it’s just a small avatar of a user. At the same time, the process to handle images and the filesystem can be challenging sometimes.

How to use Native Google Maps with Capacitor and Ionic

If you want to use Google maps with Ionic, you can either go the easy route with the Web SDK or use the Capacitor wrapper to include native Google Maps right in your Ionic app.

How to Build a Capacitor File Explorer with Ionic Angular

Working with the underlying filesystem on iOS and Android has always been challenging given the differences in both platforms, but with Capacitor you can take a simple approach that works for all platforms.

Building a Gmail Swipe to Delete Gesture & Animated FAB with Ionic Angular

We have previously created a basic Gmail clone with Ionic, but there are certain UI and especially UX elements missing that make the original app look so amazing.

Building a Gmail Clone with Ionic & Angular

In this new part of the Built with Ionic series we will explore the concepts used in the popular Gmail application to build a somewhat similar clone with Ionic based on dummy JSON data.

Ionic E2E Tests with Cypress.io

Since the Ioniconf 2020, Cypress caught my attention as a better E2E testing framework instead of Protractor for our Angular Ionic apps, and we’ll see why in this tutorial.

How to Cache API Responses with Ionic & Capacitor

If you don’t need the latest data and speed up loading times, a decent way to improve your performance is to cache API responses – and you can do it right away with some simple logic!

Uploading Files to Supabase with Ionic using Capacitor

When you work with a cloud backend like Firebase or Supabase, you sometimes need to host files as well – and the actual database is usually not the best place.

Building a Deliveroo Food Ordering UI with Ionic

Building complex UIs with Ionic can be challenging, so today we will tackle another big app and build an epic food ordering application design with Ionic Angular together!

How to Handle User Roles in Ionic Apps with Guard & Directives

When working with user accounts, you sometimes need to handle multiple user roles within your Ionic app or even specific permissions users might have

Ionic Responsive Design and Navigation for All Screens

You already know that you can create web and mobile apps from one codebase with Ionic, but having a responsive design that looks good on all platforms is sometimes challenging.

How to Integrate Supabase in Your Ionic App

If you have used Firebase in the past, you might have come across Supabase, an open source Firebase alternative that’s currently in Beta but getting a lot of great feedback.

Building the Netflix UI with Ionic

Building a complex UI with Ionic is not always easy, but can be learned by going through practical examples like we do today with the Netflix UI with Ionic!

How to Build a Simple Ionic E-Commerce App with Firebase

If you want to build an Ionic E-Commerce app, Firebase is a great backend alternative to existing shop systems. This is a quick yet still robust solution for a full blown shopping app!

Building the Spotify UI with Ionic

Building more complex Ionic interfaces isn’t always easy, so today we will take a look at another popular app and learn to build the Spotify Ui with Ionic!

Building the Twitter UI with Ionic Components

What if you could build any popular UI with Ionic components? This tutorial on building a Twitter UI with Ionic is the start to a new series of tutorials!

Building an Ionic JWT Refresh Token Flow

When you want to implement a more secure authentication with Ionic, the Ionic JWT refesh token flow is an advanced pattern with two tokens to manage.

Hosting an Ionic PWA with API Caching on Netlify

If you want to improve the offline experience of your Ionic PWA, it’s actually quite easy to not only cache the static assets but also cache the API calls inside an Ionic PWA!

How to Build Your Own Ionic Library for NPM

You find yourself creating custom components, pages and CRUD operations for your apps over and over? The solution might be to create your own Ionic library that you can install from NPM!

How to Add Ionic Facebook Login with Capacitor

Adding Ionic Facebook login to your app can help to quickly sign in users, and the setup required to make it work with Capacitor is actually not too hard!

Building an SQLite Ionic App with Capacitor

If you need to store more data than a few keys, you should pick the SQLite Ionic integration that you can easily use with Capacitor to add powerful SQL functionalities to your app!

How to add Capacitor Google Sign In to your Ionic App

If you need a social sign in inside your Ionic app, adding Capacitor Google sign in is actually a breeze to implement after some initial configuration.

Building an Ionic Firebase Chat with Authentication

If you want to get started with Ionic and Firebase, building a simple Ionic Firebase chat is the first thing you can do that’s easy to achieve and yet powerful at the same time!

The Essential Ionic Image Zoom Guide (Modal & Cards)

Adding Ionic image zoom is often a requirement in apps, but the implementation isn’t very well documented. In this tutorial we will implement a simple Ionic image zoom based on the Ionic slides!

Ionic App Navigation with Login, Guards & Tabs Area

Most apps require a certain kind of boilerplate code, with login, introduction page, routing and security – and that’s what we will create in this tutorial.

How to Create an Ionic PWA with Web Push Notifications

If you plan to build a website or PWA with Ionic, you can’t rely on standard push notifications. But instead, you can easily integrate web push instead!

How to Use Firebase Analytics with Ionic

Since you might already use Firebase in your project, why not use the analytics functionality it provides in combination with Google?

How to Build Your Own Capacitor Plugin for Ionic

When you work with a framework like Capacitor, you should know how it works internally, and how you can overcome challenges even if there’s not a plugin out there for your needs.

Practical Ionic - Build Real World Applications

It’s difficult to implement best practices and connect functionality based on simple tutorials. That’s why I created a new book for you – a practical guide to building real Ionic applications.

The Ultimate Ionic Server Side Rendering Guide (SSR)

Ionic server side rendering wasn’t really possible in the past, but recently this became possible thanks to a new package by the Ionic team.

The Push Notifications Guide for Ionic & Capacitor

To send push notifications to your users with Ionic and Capacitor you don’t need a specific service, but you need to configure a bunch of things upfront to make it work.

How to Build an Ionic 5 Calendar with Modal & Customisation

Having a calendar component in your Ionic app could be an essential element for your whole app experience, and while there’s not a standard solution, there are a lot of free components we can use.

How to use Ionic In App Purchase with Capacitor

If you want to use Ionic In App Purchase to earn additional income from your apps, you can use the Capacitor plugin for IAP but you also need some additional setup upfront.

Ionic 5 Image Upload with NestJS & Capacitor: Capacitor App

This is the second part of a mini series on image upload with Ionic. In this part we’ll create an Ionic app with Capacitor so we can upload image files from the browser and iOS & Android apps!

Ionic 5 Image Upload with NestJS & Capacitor: The API

Image upload is one of the most common use cases in your Ionic app, and to show you everything you need, we’ll build both the API and app together!

How to Apply Instagram like Photo Filters with Ionic & Capacitor

When you want to manipulate the images like Instagram with a Photo Filter within your Ionic app there are multiple ways to achieve a filtered photo effect, but the approach we are using today will make it unbelievable easy for you!

Building Ionic Desktop Apps with Capacitor and Electron

If you want to build your Ionic app for multiple platforms you can not only build it for iOS, Android and a web app – you can also use the same code for building a desktop application!

How to use Wordpress API Authentication with Ionic

If you want to use WordPress API authentication and connect your Ionic app to it, most likely you also want to make user of the users your page already has (or use it as a simple backend for your next app).

How to Create an Email List with Firebase, Sendfox and Ionic

If you want to integrate an email list for your app or website, you have countless options – but today I’ll show you a really simple way to make everything work with Firebase cloud functions!

How to Setup Universal Links in Ionic (iOS & Android)

It is possible to open your iOS and Android app directly through special Universal Links or even a standard link these days – but the setup isn’t super easy.

How to Build a PWA QR Code Scanner with Ionic for iOS & Android

If you want to build a QR scanner into your Ionic app, you are using a Cordova plugin most of the time. But what if you want to use it as a website, or perhaps PWA?

How to Create a Horizontal Navigation for Ionic Desktop Views

When you want to use your Ionic app as a website it’s not just enough to fill the available space – some UI element should simply be different.

How to Upload Files from Ionic to Firebase Storage

Firebase can be used in a lot of ways, and besides the database the second biggest feature might be its cloud storage.

Building an Authentication System with Ionic 4 and NestJS

Whether you celebrate Christmas or not, today is your happy day as I’ve prepared this special for all Devdactic followers!

How to Build Ionic 4 Chart.js Apps with

When you want to display charts inside your application, there’s a variety of great packages out there that you can use so the question comes up, which one should I use?

How to Build a Canvas Painting App with Ionic 4

The canvas is a very mighty element, which you can use for all kind of functionalities ranging from image manipulation to creating a painting app.

The Ionic 4 Media Files Guide (Images, Movies & Audio)

Working with files in Ionic has traditionally been one of the biggest challenge, since iOS and Android both handle them quite different.

How to Build a Shopping Cart with Ionic 4

When you are building a shopping app with Ionic there is no way around having a decent cart. And displaying a cart plus keeping track of all items can be challenging depending on your data.

Building an Ionic 4 JWT Login with Tab Bar & Angular Routing

Building an Ionic 4 JWT login flow is one of the basic things most apps have these days, but there are tricky elements that can make or break your app.

How to Build an Ionic 4 File Explorer

Working with files in Ionic and Cordova applications can be painful and sometimes complicated, so today we want to go all in on the topic!

How to Create & Publish an Angular Library with Ionic Components

When your application becomes bigger, separating different elements into a library and reusing them across your projects is almost always necessary.

Building an Ionic Multi App Project with Shared Angular Library

There is not a lot of documentation around the topic of Ionic Multi app projects, but it can be a powerful way to create a white label solution for your clients when you have all the projects in one workspace.

How to Import & Export CSV Data using Papa Parse with Ionic

Working with CSV data is a common business case, and although a mobile device and screen is not the perfect view for a table, we can still work with the data in an acceptable way!

Building an Ionic 4 Pokédex with Search, Infinite Scroll & Skeleton Views

While we focus on different detailed aspects of Ionic in most tutorials, today I wanted to offer a more holistic approach that everyone can follow to integrate some of the most common features into an Ionic 4 app.

Getting Started with Ionic 4 and Socket.io

Working with Sockets has become super easy over the years, and although it might sound intimidating first we’ll learn how to easily use it in combination with Ionic 4!

Understanding Angular Routing in Ionic Apps

While the Angular Router has been around for quite some time, Ionic developers only started to use it since version 4 (or before if you were into pure Angular as well). Because some of the UI patterns are not that easily transferred to the new way of routing many of you had problems during the […]

How to Create Custom Ionic 4 Animations & Transitions

You might have heard that you can customise everything inside your Ionic app.. and this also counts for animations, especially how your components appear!

Getting Started with Angular Material in Ionic 4

When you have built websites with Material design before you might have already used the Angular Material components, but have you thought about using them with Ionic?

Building an Ionic Firebase Location Tracker with Capacitor & Google Maps

With Capacitor 1.0 just days ago released it’s time to get into it – and what would be a better scenario than refreshing and updating one of the most read tutorials?

How to Send Push Notifications to Your Ionic 4 App With OneSignal

Push notifications have become pretty much standard and needed for almost any app, but many people still fear the setup process as it was very cumbersome in the past.

How to Host Your Ionic App as a Website on Firebase & Standard Web Servers

By now you might have heard that your Ionic application is basically a website that can run on all platforms where the web is supported. But how do you actually go about this?

How to Build an Ionic 4 App with SQLite Database & Queries (And Debug It!)

If your app needs a solid database or you already got data that you want to inject in your Ionic application, there’s the great underlying SQLite database inside that week can use just like any other storage engine to store our data.

How to Build A Simple Ionic 4 Wordpress Client

As basically the whole internet is powered by WordPress, chances are high you have to interact with it at if a client approaches you for a mobile app.

How to Build an Ionic 4 Calendar App

Because there is still no calendar component directly shipping with Ionic 4 it’s time to revisit how to build one yourself using a great package we already used in a previous post.

How to Build An Ionic 4 App with Firebase and AngularFire 5

Your favorite tech combinations is back! Firebase continues to be the leading hosting platform in Ionics 2018 Developer Survey and it’s no wonder – getting started is super easy and you get the benefits of a real backend in only minutes!

10 Tools & Services Every Ionic Developer Should Know

We live in great times where we can use free frameworks and tools, even additional services with powerful tools, to create and realise our own apps without any real cost besides hardware and time!

5 Animation Packages You Can Immediately Use Inside Your Ionic App

With Ionic and Angular you have a lot of options when it comes to animations inside your app. You can actually get started with Angular Animations or any other package that you can install in a matter of minutes!

Building an Eisenhower App with Ionic 4 Drag and Drop

There are many ways to add some drag and drop functions to your Ionic app, but using the Dragula package has been my favorite so far and something you enjoyed with Ionic 3 previously as well.

JWT Authentication with Ionic & Node.js - Part 2: The Ionic App

Authentication for Ionic apps is mandatory in a great amount of apps so we can’t talk enough about the topic. Also, this approach works almost the same for pure Angular apps without Ionic so it’s definitely something you should know about!

JWT Authentication with Ionic & Node.js - Part 1: The Auth Server

There’s almost no topic that has appeared more often on this blog than user authentication and this new and updated guide will hopefully enable you to build your own Ionic app with user authentication!

How to Build an Ionic 4 Offline Mode App

To build an Ionic 4 Offline Mode app you have to use a package or get creative, but inside the post you will see how everything works to take your app offline and still use it.

Dynamic Ionic 4 Slides with Shopping Cart

When you work with structured data that is distributed in different categories and elements, chances are high you have looked out for a nice interface that allows to open/collapse categories while also allows to slide items horizontal in a visual appealing way.

The Ionic 4 Images Guide (Capture, Store & Upload with POST)

If your app is working with images and you need to handle both local files and upload files things can get a bit tricky with Ionic. Especially as debugging the filesystem and paths is cumbersome, it’s not automatically clear how everything needs to work.

How to Create a Simple Ionic 4 Firebase App with AngularFire

The Ionic 4 Firebase combination remains one of the most used in terms of a cloud backend, and today we will use the latest version of Ionic with the AngularFire RC11 to build a simple todo application!

Building a Basic Ionic 4 Login Flow with Angular Router

It’s time for Ionic v4 content, and what fit better than the all-time classic login flow example? With Ionic 4 it becomes a lot easier to protect our apps the real Angular way using the Angular Router.

Is Ionic the Right Choice for My Project?

Ionic has been around for quite some years and with the latest release of version 4 it becomes an even better option for developing hybrid apps than it was already. Still, there are drawbacks and scenarios where Ionic might not be (or should not be) your first choice.

Building an Ionic Spotify App - Part 3: Native Spotify Integration

Over the last months we had a series on using Spotify with Ionic and to conclude this series one more post follows that how to truly use the full power of Spotify by combining all previous elements.

Creating an Ionic Table With ngx-datatable

If you are working with a lot of data you might have encountered the problem of presenting this data in an Excel like way as table inside your Ionic app. Although the Ionic table is not always the most recommended for mobile apps, especially in times of PWAs having the ability to create a table […]

10 Simple Ionic Hacks

Even years after starting with Ionic we can learn something new that can safe us time or just make it easier for us to work with Ionic. From time to time I stumble upon a quick fix to an issue I lived with for a long time, therefore I wanted to document those Ionic hacks […]

Building an Ionic Spotify App - Part 2: Spotify API

After our initial setup for the Spotify OAuth dialog we are now ready to create a simple Ionic Spotify client that can access the Web API of Spotify to retrieve all kinds of information about the user, playlists or tracks!

Building an Ionic Spotify App - Part 1: OAuth

After a recent comment under a video of my YouTube channel I was challenged to build an app with Spotify integration – and the process was everything but easy.

Building an Ionic OCR App with Tesseract

If you need some sort of text recognition inside images for your app you’ll come across the two most popular libraries called Ocrad and Tesseract. Both of them work pretty good out of the box so why not add the OCR functionality to your Ionic app?

Building an Ionic Geolocation Tracker with Google Map and Track Drawing

Within your Ionic App you can easily track the position of your users with the Ionic Geolocation plugin. It is also easy to add a Google Map to your app, so why not combine these 2 features into a useful app?

Ionic Canvas Drawing and Saving Images as Files

Working with the canvas can be challenging, but there are amazing things you can’t build using it like this little drawing application which can also save your amazing paintings inside the apps folder and load all of them again!

Loading Dynamic Components with Ionic & Angular ComponentFactoryResolver

Recently one member of the Ionic Academy asked for help regarding a tough situation: How to display dynamic components based on a JSON object structure you might get from an API?

Celebrating One Year Ionic Academy

Almost exactly one year ago on March 28. the Ionic Academy opened doors for the first time and has ever since been the coding school for all Ionic interested developers (and those who want to become Ionic Developers).

How to Publish a Custom Ionic Module With NPM

Have you ever thought about creating your own custom Ionic Module? Wouldn’t it be nice to publish a part of your work and distribute it through NPM? Truth is, it’s actually more easy than you might think!

Building a Calendar for Ionic With Angular Calendar & Calendar Alternatives

Recently I was in need of a Calendar Component for one of my Ionic apps. Although there are some premade options available, none of them really solved all my needs out of the box. So I tried Angular Calendar..

How to Visualise Firebase Data with Chart.js and Ionic

We’ve seen many Firebase realtime apps with chats, shopping lists and the classic todo list. But there’s so much else that can benefit from the live updates and sync of your data. What if we could visualise Firebase Data?

Increase Ionic Scroll Performance with Virtual Scroll & Infinite Scroll

When working with Ionic we mostly use the classic Ionic list and iteration patterns we know about. However, if you have a lot of data to display it makes sense to keep an eye on the Ionic Scroll Performance of your application.

How to Store Files on Firebase Storage with Ionic

We all know that Firebase is pretty amazing when it comes to realtime updates of your data. But what Firebase is also great for is uploading data and files to the private Firebase Storage each of your Apps has!

10 Common Ionic Problems & Error Messages (And How to Fix Them)

We have all seen many error messages while developing our Ionic apps. Some appear more frequent, others appear only on very special occasions. But especially for beginners these messages can be challenging as the meaning of Ionic Problems is not always clear.

How To Increase Your Teams Efficiency with Ionic Pro

If you’re taking the hybrid route for your app development project you’ll save time compared to multiple separate native projects. What if you could save even more time by introducing another suite of tools called “Ionic Pro” to your team?

Ionic AWS S3 Integration with NodeJS - Part 2: Ionic App

For long time the Amazaon Web Services (AWS) have been around and people love to use it as a backend or simply storage engine. In this series we will see how we can build an Ionic AWS App which can upload files from our Ionic app to a S3 bucket inside AWS with a simple […]

Ionic AWS S3 Integration with NodeJS - Part 1: Server

For long time the Amazaon Web Services (AWS) have been around and people love to use it as a backend or simply storage engine. In this series we will see how we can build an Ionic AWS App which can upload files from our Ionic app to a S3 bucket inside AWS with a simple […]

How to Deploy Ionic Apps as Website to Heroku

Our Ionic App is in itself a simple website, and if you want to build your project for mobile and as a webpage, there’s an easy way to make your app available to the whole world with Heroku which allows to deploy Ionic apps (and all other web contents!).

Ionic Image Upload and Management with Node.js - Part 2: Ionic App

This is the second post of our Ionic Image upload series! Last time we were building the Node.js backend and API routes, now it’s time to actually use them from a real Ionic app to upload images, display a list of images and delete single images!

Ionic Image Upload and Management with Node.js - Part 1: Server

In times of Instagram and the constant need to share our food and cat images, the image upload function inside an Ionic app is one of the most requested tutorials. A while ago you saw how to implement image upload with PHP backend and today it’s time to take this to the next level by […]

How to Parse, Visualise and Export CSV Data with Ionic

Recently I came up with a new app idea and had to find a way to display and edit CSV data inside an Ionic app. There is no general way to achieve the visualisation like inside Excel, but actually there is an easy approach we can use to work with CSV data inside Ionic.

How to Use the YouTube API with Ionic

If you want to use a Google Service like the YouTube REST API you have the chance to make requests even without going through a full user authentication and OAuth process.

Building an Ionic Chat with Socket.io

There are many ways to build a chat application with Ionic. You could use Firebase as a realtime database, or you can use your own Node server with some Socket.io, and that’s what we gonna do today to build a realtime Ionic Chat!

Building an Ionic Fitness App with iOS HealthKit Integration

If you want to create the next killer lifestyle fitness app, chances are high you want to log your measurements into the official Health app on iOS using HealthKit.

How to Add Ionic In App Purchases For iOS

Many apps offer them, and the most successful apps live from it: In app purchases. Who has never bought some coins, crystals or anything in his favorite game?

Case Study: Realtime Image Sharing App with Ionic and Firebase

We often go through various code examples for different use cases with Ionic here, but we seldom talk about building real world apps, where we most certainly encounter different problems then inside our little sandbox tutorials. Let’s talk about a simple image sharing app with Firebase!

How to Combine Ionic Side Menu and Tabs Navigation

The navigation inside Ionic projects is in general quite simple, but once you try to combine different navigation patterns things can get really tricky. Especially one case happens a lot in reality, which is using an Ionic Side Menu and a Tab Bar navigation together.

Ionic Google Login with Firebase

Google Sign-In has become one of the most used authentication methods out there, and this is in part because of how easy it is to the users to sign-in across multiple devices without managing passwords. This article explains the simple steps to implement Ionic Google Login for your apps.

How to Use Ionic SQLite Queries & Pre-Populated Database

Although the Ionic Storage package is great to store almost any kind of data, many of the readers wrote they are using MySQL on the backend side and need some more equivalent storage inside their Ionic app so we’ll go for an Ionic SQLite App today.

How to Build an Ionic Calendar App

Out of the box there is no Ionic Calendar component to display a classic calendar inside your app, but what if you want to give people the chance to add events and display everything inside a good-looking view?

Dynamic Theming Your Ionic App

Theming your Ionic app is an awesome way to quickly change the styling for all parts of your app. But what happens if you want to change your styling while running, like toggling a day or night mode?

15 Reasons Why You Should Develop Ionic Apps

If you plan to develop your next app and are undecided whether you go for native or a cross-platform framework, this guide will give you 15 rock solid reasons you should think of Ionic as your framework of choice.

Building an Ionic Twitter App With Timeline and Tweets

Building an Ionic Twitter App is really interesting, and from the number of responses and the times how often I’ve written a Twitter post I’m pretty sure this updated one for Ionic 3+ is really needed.

How to Build An Ionic App with Firebase and AngularFire 4

When it comes to building an Ionic app with a solid backend, the current choice for many people is Firebase, and most of the time combined with AngularFire. And for reasons.

How to Add Ionic Animations Using Angular (2 Different Ways!)

One of the most viewed articles on Devdactic is about Animations for Ionic Apps. Today we will take look at 2 different but both great ways to easily create Ionic Animations using Angular!

Building Your Own Ionic Wordpress Client with WP-API

If you are familiar with WordPress you know that since a few versions ago all instances have a public REST API. Of course I had to jump in when I saw a new WordPress API wrapper library for Angular 2+, created by the awesome Julien Renaux which we will use to build our Ionic WordPress […]

Why I Switched to Ionic (And Never Regret My Decision)

It’s not like native development is bad. Swift itself is a beautiful language, and even Android Studio is not that bad anymore, so how comes more and more people switched to Ionic?

Building an Ionic Image Gallery With Zoom

The image gallery is a classic pattern used in many applications which need to display any kind of grid with pictures or photos to the user. If you have specific requirements, there might not be an out of the box solution that works fine for you, that’s why we will create our own Ionic image […]

Protecting Your App With Ionic Auth Guards

Recently I dig into authentication with Ionic a bit more and found a rather unrepresented topic that can actually help to secure your app really easy. I stumbled upon the Ionic Auth Guards while working on a new JWT Authentication course for the Ionic Academy.

Automatic Ionic 2 Builds For iOS Using Fastlane

When your project get’s close to release, it’s time to think about decent ways to build your Ionic app. Of course you can do this by hand, but if you are having multiple apps and configurations this can get out of hand very fast. Also, the iOS upload process takes time – which you actually […]

Preview of the Ionic Academy

Let’s face the truth: Learning to code is challenging and can sometimes be frustrating. You can get lost in your self studies and reach a point where you loose interest and focus on something else because you simply can’t find anymore fun in it.

Ionic 2 Push Notifications In Detail

The topic of Ionic 2 Push Notifications was requested many times on my original guide to Push Notifications with Ionic 1, and maybe even the most asked about feature right after user authentication.

Rapid Prototyping with Ionic 2 and Node.js - Part 3

If you have developed an app with Rapid Prototyping you want to get it out into the hands of other people. But what’s the easiest way to do so without already submitting your unfinished app? And what about your backend?

Rapid Prototyping with Ionic 2 and Node.js - Part 2

Ionic 2 is an awesome framework for building out your MVP with Rapid Prototyping. Not only you can benefit from the speed of the framework, you also get the advantages of Angular 2 and a cross platform app for iOS and Android in no time.

Rapid Prototyping with Ionic 2 and Node.js - Part 1

Do you know how fast you can actually develop a really solid MVP prototype including a frontend and working backend these days? It’s amazing.

The Complete Ionic Images Guide (Capture, Store & Upload)

In this guide to Ionic images we will learn to capture images from library & camera, copy files on your device and build a simple PHP upload to a server.

Building a Signature Drawpad using Ionic

Some time ago I wrote a tutorial on building a signature pad using Ionic 1, and today we are going to do the same but now it’s time for Ionic and Angular 2+!

Simple Ionic Login with Angular 2+

Almost every mobile app nowadays has a login, and using Ionic 2 and Angular it’s pretty easy to craft the UI and logic for a simple Login. My post on simple login with Ionic 1 is one of the most viewed articles, so with the stable release of Ionic 3 already it’s time for an […]

Building Your Own Simple RSS Reader with Ionic

Parsing RSS data is not a simple task given that most feeds are based on XML. Within this post we will build a simple RSS reader with Ionic 2 using the Yahoo API to transform our feeds into more readable JSON.

The Ultimate Ionic 2 Cheatsheet

The Ionic CLI was and still is awesome. With Ionic 2 coming, it time to update my previous very popular Ionic Framework 1 cheatsheet to include all the great options you currently have to build hybrid apps!

How To Build Ionic Tinder Cards Using Angular 2 Swing

The Ionic tinder card swipe feature is a highly request UI behaviour and my previous post about the use of it with Ionic 1 was very popular. For Ionic there is not yet an official component from the Ionic team, but with some help from a different library we can achieve almost the same results.

Building Ionic Image Upload With PHP Server

Capturing, storing and uploading images with Ionic is one of the most used functions. Everyone wants to take photos and work with them inside their app, but in my previous guide about using images with Ionic many people encountered problems on Android. Others needed a backend to upload images. And the code is a bit […]

How to Build Ionic 2 Drag and Drop using Dragula

Having drag and drop functionality in your mobile app is very common, but it’s not really inlcuded in the standard Ionic stuff. I looked around and found a great library called Dragula which gives AngularJS apps great features.

10 Myths about Hybrid Development (and how to correct them)

“Hybrid apps are slow” was possible the first and most often heard argument I encountered when the discussion was about going hybrid instead of native. There was and sometimes still is an invisible barrier of ignorance.

The Complete Ionic Push Notifications Guide

Ionic Push Notifications, once again. My previous articles on this topic had the most comments and questions ever, so as the way of using this has changed again a bit to the current Beta status, we will put everything from starting with dummy push notifications to real iOS and Android push notifications inside this article.

RESTful API User Authentication with Node.js and AngularJS – Part 2/2: Frontend App

In this second part of our User Authentication series I will show you how to hook up a frontend to our REST API backend. We will craft a little Ionic app with AngularJS, but the code and concept is almost the same for a pure AngularJS webapp.

Real iOS Push Notifications with Ionic Push

I got a lot of requests on a tutorial showing how to use the Ionic.io Push notification service in a real example. Today I will finally show you how fast it can be to integrate iOS push notifications inside your Ionic Framework app!

How To Easily Use The Twitter REST Api With AngularJS

The Twitter REST Api is quite well documented, still there are many problems how to to call the routes, how to authenticate and in general how to use it. I wanted to simplify the Twitter integration, so I created a AngularJS library acting as a wrapper: ngTwitter.

How To Create An Advanced Ionic Gallery with Image Zooming

Presenting images in whatever form you like is a standard job inside an app. If you want to create an image gallery, things get a bit tougher. Additional, if you want image zooming inside your standard gallery view, your head might explode without the proper knowledge. Let me present you an easy way how to […]

Easy Ionic Push Notifications With Ionic.io In 15 Minutes

Everyone uses push notifications. Not you? Well, you are lucky as Ionic helps us to include push notifications in our hybrid apps in absolutely no time. Follow my tutorial to include Ionic push notifications as fast and easy as possible! You will be surprised how fast it is.

The Complete Guide To Images With Ionic

It can be a bit challenging and frustrating to handle local file URLs when working with images or media files in your app. In one of my articles I described how to capture and store images with Ionic, but there have been a lot of questions regarding saving and accessing those files later. Additional,

AngularJS User Authentication Inside Your Ionic App

Implementing a login and user authentication system for your AngularJS app seems to be one of the hardest problems people encounter. My article on a simple login with Ionic and AngularJS is the far most viewed article on this blog, every day! As the mentioned article only describes a basic system for a very low […]

Adding Frosted Glass Effect to your Ionic Framework App

The frosted glass effect is a smart way to have an overlay above your content while still seeing that there is something in the background. If you are an iOS user, you will have noticed this effect in places like when you pull down your notifications.

showWhenState: Conditional Elements In Ionic by State

A while back I released an Ionic Ion called ionic-ion-showWhen with the purpose of showing or hiding an element based on the size of the screen.

Swipeable Cards with the Ionic Framework

Swipeable cards are nowadays used very often in mobile applications as a feature to navigate through a list of items/images. In a recent tutorial I explained how to create Tinder Style Cards with Ionic. This time, I will show you how to get swipeable cards like seen in the jelly app. To get this neat […]

Shrinking Headers Like Facebook With the Ionic Framework

Shrinking headers have become very popular in apps like Facebook, where you need to scroll much content. When you start scrolling, the headers disappears very smooth to grant your users more space on the screen to read the actual content.

The Ionic Framework Cheatsheet

So you have played around with the Ionic Framework for a while? You might have recognised that there are some reoccurring command line statements. There are many times when I need a special flag or option, so I made a little Cheatsheet to have all options at hand. On this way I can focus on […]

How To Make A HealthKit App With Ionic and ngCordova

Since the release of the iOS 8 SDK, developers have access to the HealthKit App and its services. Through this service you can read and write body data like weight, height or store a complete sports workout session. To implement this feature in your Ionic app, you can make use of the ngCordova wrapper for […]

Animations For Your Ionic App with Move.js

Apps not just live from a large amount of functions and options they provide (although this is most of the time recommended), but to a big amount the live from the user experience. Designing a great user experience can be quite challenging, so this time I want to show you how to make your app […]

Tinder Style Swipe Cards Optimization in Ionic

Tinder Styled cards have become very popular in the last time due to the success of the Tinder app. In a recent article on Nic’s Blog I explained how to make Tinder style swipe Cards with Ionic. Due to some feedback are here some things you experienced or wanted to know regarding the use of […]

Using Local Notifications In Your Ionic Framework App

Maybe you’re making an app that distributes reminders or requires some kind of notification.  You don’t necessarily need push notifications, but you would still like notifications. This could be a challenging task in native Android and iOS development. Lucky for us, we can make use of the Apache Cordova local notifications plugin created by Sebastian Katzer […]

Display Images and Video Player using Ionic

Lately I explained how to take photos and how to capture videos and store them within your apps directory. Due to a wish of you, this time I will show you how to present images and videos properly in your ionic app. Therefore, we will create a simple media popover using ionic modal overlay and […]

Capture and Store Videos with an Auto-generated Thumbnail in your Ionic App

Recording videos from your app can be a substantial part, and with Ionic and ngCordova it’s no problem at all! In this tutorial I will show you how to record videos through a video service, and use the returned video data to save the material inside your application folder. On this way, you can be […]

Simple Ionic Login With AngularJS

Many times you may want to have a login at the beginning of your app. Handling a login with Ionic and Angular is very straight forward. For the purpose of creating this Ionic Login Example, I will use a simple starting template from the Ionic guys und just add a login before the template app […]

How to Capture and Store Images with Ionic

From time to time you may want to capture images with your app, either from camera or from the users library. But just keeping a reference to it won’t help if the user deletes the images from hist photo library. Therefore, you need to store them local in your apps directory. I will make use […]