Posts in category Intermediate

Making Phone Calls to Contacts with Ionic in one go

thumbnail ionic contacts call

Thanks to cheap costs from unlimited phone plans, calling someone is not expensive as it used to be. Adding more ways of communication in a mobile application can improve the User Experience.

Adding Sounds using HTML5 and Native Audio in Ionic

thumbnail sound html5 ionic native audio

‘member Flash? This is what we are going to use because it’s the best technology in the world… just kidding. Back in the days Flash was very helpful, we were able to make animations, audio players and so much more! Then came HTML5 and people started wondering why they could watch their videos without crashes🤔.

How to Automatically Generate Icons and Splash Screens Wi...

thumbnail-automatic-icon-splash-screen

There are more than 24,000 Android devices and around 33 iOS devices. Manually generating icons and splash screens to fit every need seems a hard task right? Fear not my friends! There is a way to automate it! Let’s start by installing everything we need and creating a project: Ionic has a service that will generate the icons and splash […]

Analyzing the Ionic AWS Full-Stack Starter: Custom APIs

thumbnail ionic aws stack

In the previous tutorials here and there, we analyzed the amazing Ionic AWS Full-Stack Starter project. Accessing pre-built methods from AWS services like S3, Cognito or DynamoDB is super cool, but what do we do if we need some custom methods? Do we create another Node.js server on the side?

Analyzing the Ionic AWS Full-Stack Starter: The Features

thumbnail ionic aws stack

In this tutorial we will see how the application makes good use of the Providers we analyzed previously. The application is divided in two parts: The authentication process The tasks manipulation Many intermediate Ionic concepts are present here, if you have any issue, you can have a look at my book to quickly update your knowledge.

Analyzing the Ionic AWS Full-Stack Starter: Configuration...

thumbnail ionic aws stack

I have used both Ionic and AWS for years now. Both technologies are (mostly) free and awesome. Ionic is the badass framework to build cross-platform mobile applications and AWS gives us the tools to host, cache, manipulate files with authentication and many more services in the cloud. So what’s the result if both companies allied together to create a project: the […]

Action Range and spooky Sounds in an AR Ionic app with Wi...

thumbnail ionic Augmented Reality wikitude action range logs

Augmented Reality worlds bring more possibilities than traditional websites. In a previous tutorial, we only triggered actions when the user selected a marker, this a basic interaction: user clicks on something, something else happens. In this tutorial we will create an ActionRange which will trigger an alarm sound as soon as the user enters an area: our Danger Zone ;).

Logging and Displaying Real-Time Distance in an AR Ionic ...

thumbnail ionic Augmented Reality animation wikitude

We are human and can make mistakes. When it comes to debugging an application, logging is the most important feature to detect them. Let’s be honest, I have been carried away by this awesome AR technology and should have done this tutorial a while ago (mea culpa). We will get this done in this tutorial. Alongside with real-time distance tracking. Having the […]

Parallel Animations in an AR Ionic App using Wikitude

thumbnail ionic Augmented Reality animation wikitude

As I said in a previous Angular 2 tutorial. Animations can make or break your UX. Too much of them and your application looks like a Vegas Casino (although this can be an interesting idea for an Augmented Reality application). None and your app will be missing the little spark to make it stand out. In this tutorial we have a look at how to […]

Marker Selection and Property Modification in an Augmente...

thumbnail ionic Augmented Reality marker wikitude

Having some Markers is cool, but we need to be able to modify them! In this tutorial we dive into some basic modifications by changing the content and associating a new image when tapping on a Marker.