I haven’t developed a mobile application for almost a year, today I need to start a new mobile application. For the particular application I am building Ionic will be a good fit, and not having developed with Ionic for a few years I was keen to try out the new features in Ionic 5.
I had a couple of issues, in getting my workstation configured correctly to use Ionic and Android, so I thought I would just cover the steps I had to go through just to save others who may face the same pain.
A prerequisite to using IONIC is that that you will need Node.JS installed. If you have not installed Node on your workstation yet, I recommend you install it making use of Node Version Manager (nvm),
Install Java 8
Android requires the installation of Java on your machine, it also appears that specifically this needs to Java 8.
Install Android Studio
You will also need to install Android Studio, although you may not necessarily use it to develop with, it seems it is a bit of necessity when it comes to developing Android Applications, primarily because it enables you to install and configure the Android SDK.
Jetbrains provide a great guide to installing and configuring Android Studio
Also ensure you follow the instructions on Update the IDE and SDK Tools which will guide you through the process of installing the Android SDK.
Install SDK Man and Gradle
SDKMAN! is a tool for managing parallel versions of multiple Software Development Kits on most Unix based systems. It provides a convenient Command Line Interface (CLI) and API for installing, switching, removing and listing Candidates.
Once you have SDK Man installed you can install Gradle, an open-source build automation system that builds upon the concepts of Apache Ant and Apache Maven and introduces a Groovy-based domain-specific language instead of the XML form used by Apache Maven for declaring the project configuration.
Gradle is used by Ionic to build your Android Application. Installing Gradle using SDK Man is super easy. Just use
Set your Environment Variables
You will now need to configure your environment variables in your
Open your bash profile, using any text editor, personally I prefer to use gedit to edit it
Then paste the following environment variables, assuming you have installed all everything using their default locations.
Save and close file. then ensure your current terminal window is refreshed with new values either by closing and opening a new window or just simply using
With all the pre-requisites now installed you can now install Ionic framework, simply using the following node package manager commands
This command may take a little time to complete, depending your system and internet connection.
Check your version of ionic installed using
in my case the command returns
5.2.8 but this will obviously vary depending on date etc you installed the framework
Start a new ionic project
You are now ready to start developing your first ionic based project and create your first project using
This will generate a new folder which will contain all the new project files making use of a Blank project template.
Once the project is opened we now need to add the android platform to the project. In the Integrated Terminal window of your preferred IDE use the following command to do so.
If you have previously installed WebStorm, it is is a good idea to refresh the installation in order for WebStorm to pick up the new references etc.
This is easily done by simply executing the
./webstorm.sh in your
/bin of your Webstorm installation directory
After this command has completed you will notice a new folder appears in your project explorer named
You can now run the application using ionic serve to see it action in your browser.
Build for android
You are now able to build your application for deployment to android using the following command
Configure an Emulator
It is highly likely that you will want to execute your APP using an emulator so you can see your App running as if it was running on the device. You will need to use the Android Studio to create an Emulator for which ever device you wish to target.
It is worth taking the time to read through the documentation on Run apps on the Android Emulator
The above is list of configuration options I had to carry out in order to get my Ubuntu Desktop configured to start developing Android applications. I didn’t find these details documented together in one place, and instead I had to stumble across them piecing them together from several blog posts.
Hopefully I have saved you that frustrating process. If I missed anything please let me know.