Ionic Framework is useful for building mobile apps like Android and iOS. This post will help you to install Node.js, Cordova and Ionic framework on your system in Ubuntu.
As Ionic Framework depends on cordova, you need to install it first. To install Cordova, make sure you have Node.js installed. Following step by step guide shows what to do to install ionic so that you can build your brand new ionic app right away. This post is intentionally made precise rather explaining much stuffs. Lets get going!
Install JDK 8:
sudo add-apt-repository ppa:webupd8team/java
sudo apt-get update
sudo apt-get install oracle-java8-installer
sudo apt-get install oracle-java8-set-default
If you don’t have cURL installed, then install it first:
If you want to install cURL from repositories, the cURL is in Ubuntu repositories.
To install or update nvm:
curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.8/install.sh | bash
wget -qO- https://raw.githubusercontent.com/creationix/nvm/v0.33.8/install.sh | bash
sudo apt-get install curl
Run the following set of commands to install curl 7.50.3 on Ubuntu 16.04 in Terminal.
The same procedure can be followed for Ubuntu 15.04, Ubuntu 14.04 and other Ubuntu Derivatives:
wget http://curl.haxx.se/download/curl-7.50.3.tar.gz tar -xvf curl-7.50.3.tar.gz cd curl-7.50.3/ ./configure
make sudo make install
Once installed We Can verify cURL using:
Preliminary Step for Installing Node:
First, log in to your server as your non-root user. Before doing anything else, let’s update the package database:
sudo apt update && sudo apt upgrade -y
There are a few methods which can be used to install Node.js on Ubuntu. We shall look at two methods.
Method 1 : Installing Bundled Node.js for Ubuntu
You will usually need
npm as well, so to install Node.js and
npm via Ubuntu default depositories, execute:
sudo apt install nodejs npm
Once the installation is completed, you may want to verify the version of Node.js installed:
:~ $ nodejs -v
You can also check the version of
$ npm -v
Method 2 : Installing Latest Node.js 9.x on Ubuntu
Instead of installing from Ubuntu default depositories, you may want to install the latest version of Node.js. To do that, you need to add the PPA (Personal Package Archive) maintained by NodeSource for Ubuntu.
curl -sL https://deb.nodesource.com/setup_9.x | sudo -E bash -
After adding the PPA, you can proceed to install Node.js which also includes
npm when you install using this method:
sudo apt install -y nodejs
After the installation is completed, you can verify the version of Node.js installed:
You can also check the version of
[secondary_label output] 5.5.1
For Method 2, in order to allow some
npm packages to work (like compiling code from source), you need to install the
sudo apt install build-essential
Method 3 : Installing Latest Node.js using NVM
If you require to install multiple, self-contained versions of Node.js, then you need to use the
nvm (Node.js version manager) method. Using the
nvm, you can install and select which Node.js version to use.
Firstly, we need to install some requisite packages from the Ubuntu repositories in order for
nvm to work:
sudo apt install build-essential libssl-dev
Once completed, we want to download and execute the
nvm installation script. The current version is <^>v0.33.2<^>, which you may want to substitute with the latest version by checking out their GitHub page.
curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.2/install.sh | bash
The script will create and clone the
nvm repository into
~/.nvm directory inside your home directory. It will also add source lines into your profile (either
nvm installation is completed, you need to log out from your Ubuntu and log in again in order for
nvm to work properly.
Next, we want to find out what versions of Node.js are available for installation:
nvm ls-remote [secondary_label output]. . .
v8.9.0 (LTS: Carbon)
v8.9.1 (LTS: Carbon) v8.9.2 (LTS: Carbon) v8.9.3 (Latest LTS: Carbon) v9.0.0 v9.1.0 v9.2.0 v9.2.1 -> v9.3.0
The latest version at the time of writing this tutorial is v9.3.0. You may see newer versions instead. To install Node.js v9.3.0, enter:
nvm install <^>9.3.0<^>
You may replace
9.3.0 with whichever version number you require. You can also repeat installing other versions as you wish.
nvm will use the most recently installed version. If you want to switch to another version, for example 9
.0.0, use the following command:
nvm use <^>9.0.0<^>
To check which versions have been installed, enter:
You can make any installation as the default version. For instance, if you want to make 9
.0.0 as the default version:
nvm alias default <^>9.0.0<^>
You can also select the default version by executing:
nvm use default
We have seen three methods to install Node.js on your Ubuntu server. While Method 1 is the easiest, you may want to choose Method 2 if you want to get the latest version of Node.js. If you need to run multiple versions of Node.js, then you need to use Method 3 to install.
Now use the following command to install Cordova on your system using npm command. It will install all other required node modules on your system.
sudo npm install -g cordova
If you are running a 64-bit version of Ubuntu, you’ll need to install the 32-bit libraries since Android is only 32-bit at the moment.
sudo apt-get install ia32-libs
If you are on Ubuntu 13.04 or greater, `ia32-libs` has been removed. You can use the following packages instead:
sudo apt-get install lib32z1 lib32ncurses5 lib32bz2-1.0
Install Ionic Framework:
Ionic provides and commands line utility for creating packages, build and start applications. Use NPM command to install Ionic framework on your system.
sudo npm install -g ionic
After completing the installation of the Ionic framework, use following command to check installed version.
ionic -v 3.1.9
Create Your Project:
Now, its time to create a new cordova project:
ionic start <projectname> blank
If you get Error: Cannot find module ‘xmlbuilder’, follow this step:
* Remove nodejs
* Delete the /usr/lib/node_modules (/usr/local/lib/node_modules) folder
* Reinstall nodejs
* Clear the npm cache (npm cache clean)
* Reinstalling ionic
Run App with Browser:
Go to your project root and run:
This will run demo app on your browser. While app is running, you can use following commands to do specific tasks needed:
#restart or r to restart the client app from the root
#goto or g and a url to have the app navigate to the given url
#consolelogs or c to enable/disable console log output
#serverlogs or s to enable/disable server log output
#quit or q to shutdown the server and exit
If you are ok with web view of your app, then you’re done. Above steps are all you needed. But if you want to test your app on emulator/real device, keep moving..
Install Android Studio/ Android SDK to work for Android:
Make sure you’ve Oracle JDK 8 installed in your system
Download and install android SDK from official site:
Go to the location where you set to download the file.
- Now you can see that a file called
android-sdk-linuxappears as if the following.
Enter the folder
Enter the folder
toolsand then copy the folder location.
Press the keys CTRL + ALT + T to open a terminal and then use the following command. Where
/home/ep/Downloads/android-sdk-linux/toolsis the location I copied previously. You can just type
cdand right click to past the location to the terminal.
Android will be run.
ClickInstall [Number] packages...
Accept and then click Install.
Press CTRL + ALT + T to open a new terminal and type :
Add the following to the top of the entire text and then save it. (Do not close the file)
Logout and relogin into Ubuntu.
We have now completely installed ionic into our ubuntu system and set up every essential configurations.