When it comes to accessing native functionality in Capacitor, we are generally able to use any of the thousands of existing plugins for Cordova. However, whilst most Cordova plugins will work fine without modification in Capacitor, not all of them will. One particularly popular Cordova plugin is Phonegap Plugin Push which allows you to register […]
Adding Icons & Splash Screens (Launch Images) to Capacitor Projects
Generating icons and splash screen images ends up being a much more difficult task than you might anticipate before doing it for the first time. The difficulty stems from the fact that there are a bunch of different devices that your application could be running on, a lot of which will have different resolutions/pixel density. […]
Deploying Capacitor Applications to Android (Development & Distribution)
Earlier this week, I released a guide to deploying Capacitor applications to iOS. In this tutorial, we are going to be doing the exact same thing, except we will be deploying an Android application built with Capacitor to Google Play. As was the case for the last tutorial, we are going to do this starting […]
Deploying Capacitor Applications to iOS (Development & Distribution)
In this tutorial, we are going to walk through how to use Capacitor to deploy iOS applications. We will be covering how to get a Capacitor application running on an iOS device for development, all the way through to creating a build for distribution on the App Store. We are going to do this starting […]
Using Cordova Plugins that Require Install Variables with Capacitor
Since Cordova is such a hugely popular framework with a massive ecosystem of plugins to access various native functionality, Capacitor is aiming to have backward compatibility with existing Cordova plugins. This means that if you are using Capacitor, you should be able to use any existing Cordova plugin with it. All you need to do […]
Using the Capacitor Filesystem API to Store Photos
When we take a photo on an iOS device, the resulting file is stored inside of a temporary folder called tmp. If we use the Camera API to retrieve a photo, the resulting URI will look like this: If we are interested in long-term storage then this isn’t the best solution. The way you approach […]
Create Native HTML5 Games with Phaser and Capacitor
Building HTML5 games with Phaser has been somewhat of a hobby of mine over the past few years, and I’ve even written a few tutorials about Phaser with a focus on developing HTML5 games for mobile. However, despite having created a few mostly finished games most of them never actually see the light of day. […]
Publishing a Web Component Using Stencil (And Using It Anywhere)
Over the past couple of weeks we have explored creating custom components within Ionic/Angular, and creating custom web components using Stencil. Although both behave very similarly, the key difference between creating an Angular component, and a Stencil component, is that Stencil generates generic web components that can be used anywhere. Angular components can only be […]
Using Google Maps and Geolocation in Ionic with Capacitor
Google Maps integration is consistently one of the most popular features of mobile applications. I’ve published tutorials on how to use Google Maps with Ionic many times in the past, but I wanted to revisit the basics again now that some time has passed. Previously, I have used Ionic and Cordova to build a Google […]
Publishing a Custom iOS Capacitor Plugin on NPM
Earlier this week, I published a tutorial that described how to use Capacitor to run custom iOS native code in Ionic. We built a Capacitor plugin that allowed us to automatically retrieve the latest photo on the user’s camera roll, resulting in an application that looked like this: In order to achieve this, we just […]
Running Custom Native iOS Code in Ionic with Capacitor
One of the limiting factors of the hybrid application approach is the reliance on a mostly community driven plugin ecosystem to access native functionality with Cordova. Most of the time you can easily find a Cordova plugin that provides the functionality you want. However, sometimes for more niche requirements you may struggle to find an […]
An Early Look at Capacitor (A New Native Bridge for Web Apps)
A short while ago, the Ionic team announced that they were working on a project called “Avocado” which later took on its official moniker of Capacitor. In this article, I want to introduce you to Capacitor and what it will do. I will get into the specifics soon (and we will build an example as […]