How To Install Ionic Framework On Ubuntu 20.04 / 19.10

We can install Ionic Framework On Ubuntu 20.04 / 19.10 using the repository. We will have to install nodejs on ubuntu. Let’s see, how to install the Ionic framework. so

Ionic Framework is an open-source Mobile UI toolkit for building high-quality mobile apps including frontend framework and angular, react, etc. so

How To Install Ionic Framework On Ubuntu 20.04 / 19.10

Before installing the Ionic Framework, we will update and upgrade the Ubuntu machine using the following commands. 

sudo apt update
sudo apt upgrade -y

Check Out: Install Monica Personal Relationship Management On Ubuntu 20.04

Install Nodejs on Ubuntu:

We will need to install the Nodejs and NPM on ubuntu 20.04. we can use the PPA repository. Use the below command and install it. 

sudo curl -sL https://deb.nodesource.com/setup_12.x | sudo -E bash -
sudo apt install nodejs

Check the version using the below command. 

ubuntu@ubuntu:~/Desktop$ node -v
v12.18.4

Install Cordova on Ubuntu:

Once you have installed the Nodejs on your machine and we need to install Cordova this will install the required modules on the machine. 

ubuntu@ubuntu:~/Desktop$ sudo npm i -g @ionic/cli
/usr/bin/ionic -> /usr/lib/node_modules/@ionic/cli/bin/ionic
+ @ionic/cli@6.11.9
added 218 packages from 157 contributors in 38.059s

Check Out: How To Install Youtube-dl To Download Videos on Ubuntu 20.04/19.10

Check the Cordova version with the below command. 

ubuntu@ubuntu:~/Desktop$ ionic -v
6.11.9

Create Ionic Application On Ubuntu:

1. We will create an Ionic application using the below command and you can choose the framework according to your requirements. 

ionic start

2. Provide your project name. 

3. Now select a start template.

ionic framework

Check Out: How To Launch EC2 Instances(server) On Amazon Cloud

4. Integrate your new app with Capacitor. 

ionic framework ubuntu

Once all the dependencies installed. we will receive the output like “Your Ionic app is ready! Follow these next steps:“. 

cd ./FirstIonicApp
ionic serve --host 0.0.0.0 --port 8100

You can also use “–disableHostCheck” with the above command. This will disable the host check. After starting the application, you will receive this message. 

[INFO] Development server running!

Local: http://localhost:8100
External: http://192.168.185.146:8100

Use Ctrl+C to quit this process

[INFO] ... and 42 additional chunks
[ng] : Compiled successfully.
[INFO] Browser window opened to http://localhost:8100!

[ng] Date: 2020-09-29T16:47:21.102Z - Hash: 7dac430faccf2c9a9c87
[ng] 61 unchanged chunks
[ng] Time: 8590ms
[ng] : Compiled successfully.

Check Out: How To Apply SSL Certificate On Load Balancer On Amazon Cloud

You can use any URL to access the Ionic apps in the browser. 

ubuntu install ionic framework

In a similar way, we can install the Ionic framework on ubuntu 18.04 /16.04. 

That’s it.

Share on:

I'm the founder of Curious Viral. I hope this blog will provide you complete information about Linux Technology & I would like to share my technical knowledge with you which I have learned during this period.

Other Posts You May Like...

Leave a comment