How to Install Ionic Mobile App Framwork on Ubuntu 18.04 LTS

Ionic is an open-source Framework that can be used for developing hybrid mobile apps using Web technologies like CSS, HTML5, and Sass. Ionic provies a powerful command-line interface that can be used for creating a project with a simple command. Ionic supports Android, IOS and the Universal Windows Platform for developing app. Ionic uses Cardova plugins to access Camera, GPS and Flashlight.

In this tutorial, we will learn to install Ionic framework on Ubuntu 18.04 (Bionic Beaver).

Requirements

• A server running Ubuntu 18.04 to your system.
• A non-root user with sudo privileges.

Install Node.js and Cordova

First, you will need to install Node.js to your system. By default, the latest version of the Node.js is not available in Ubuntu 18.04 default repository. So, you will need to add PPA for node.js to your system.

You can add the Node.js PPA using the following command:

sudo apt-get install python-software-properties -y
curl -sL https://deb.nodesource.com/setup_8.x | sudo -E bash -

Next, install the Node.js using the following command:

sudo apt-get install nodejs -y

Next, you will need to install Cordova to your system. You can install it with the following command:

sudo npm install -g cordova

Install Ionic Framework

Ionic comes with a convenient command line utility to start, build, and package Ionic apps. You can install it by just running the following command:

sudo npm install -g ionic

Once the Ionic is installed, you can check the version of Ionic using the following command:

ionic -v

Output:

3.20.0

Create Project with Ionic

Next, you will need to create a new Cordova project somewhere on the computer for the code for your app: You can do this with the following command:

ionic start HelloWorld blank

The above command will create a directory HelloWorld.

Next, change the directory to the HelloWorld and list the contents:

cd HelloWorld/
ls -l

You should see the following output:

total 260
-rw-r--r--   1 3434 3434     92 Jun  9 15:43 ionic.config.json
drwxr-xr-x 536 root root  20480 Jun  9 15:46 node_modules
-rw-r--r--   1 3434 3434   1135 Jun  9 15:43 package.json
-rw-r--r--   1 root root 224175 Jun  9 15:46 package-lock.json
drwxr-xr-x   6 3434 3434   4096 Jun  9 15:43 src
-rw-r--r--   1 3434 3434    519 May 30 23:39 tsconfig.json
-rw-r--r--   1 3434 3434    178 May 30 23:39 tslint.json

Next, enable Android platform and building the project for Android with the following command:

ionic platform add android
ionic cordova build android
ionic cordova emulate android

That's it! You can now easily build your app.