A significant advancement in this domain is Capacitor, a powerful open-source framework that allows developers to create cross-platform mobile applications using web technologies. Capacitor is built on Apache Cordova (previously known as PhoneGap) and is now maintained by the Ionic team. It acts as a bridge between web technologies and the native features of mobile devices.
The process of creating mobile applications with Capacitor follows a simple workflow that leverages your existing web development skills. Here’s a brief overview:
- Install the Android SDK using Android Studio and set up your environment.
- Install Capacitor, add platforms, and sync your code—on the first launch, it will simply copy everything: HTML, CSS, JS, images, and it may even fetch code from your CDNs to package it all up.
- Use Capacitor’s APIs to access native device features like the camera, geolocation, or notifications.
- Customize the appearance and behavior of your application using standard frameworks like Bulma ; #tip Create a custom font with juste the right icons using Fontello;
- Test your app using Capacitor’s development server or by running it directly on physical devices or emulators. I couldn’t get Android Studio’s emulator to work—oh well, when you’re developing a web app, you don’t need an emulator anyway 😎
- Deploy your application to app stores and/or distribute it as an APK bundle for direct download. You can also distribute it as a web application.
In the shell:
npx cap build android
In Android Studio:
npx cap open android # hence $CAPACITOR_ANDROID_STUDIO_PATH
- Menu “Build” / “Generate Signed Bundle / APK”;
- Create a package signing key
- Choose “release”
- The installed APK is located at android/MonProjet/release/MonProjet-release.apk
And of course, your app remains usable on the desktop:
The days when mobile development required blood, sweat, and tears are long gone. Thanks to the emergence of tools like Capacitor, web developers can now venture into mobile development with confidence. If, like me, you’ve been coding increasingly powerful web apps for decades, you already have a solid foundation. Embrace this new power. You are a mobile developer 😎