Ionic Framework – Introduction and Installation Tutorial on Windows and Ubuntu

Seegatesite.com – Introduction and installation ionic framework on windows and ubuntu. Previously I had a lot to discuss creating android apps using android studio, but many obstacles that I have experienced since I was a beginner java programming. To create a quality application, I need a fundamental understanding of java programming. Okay, forget for a moment about the java programming and android studio. Maybe this time scripting programming such as php, html, javascript and angularJS the best for me. For that reason I did not give up to make mobile based application again, and my choice fell on the Ionic Framework.

Honestly, I was late for ionic framework technology . But it’s better late than never to learn.

What the Ionic Framework?

Ionic Framework is a framework created by devoted and focused on helping the process of making mobile applications (Hybrid Mobile Apps). Created and maintained by designers and developers who have a passion about web technologies. By leveraging the advantages of AngularJS, Ionic able to make mobile app development process with HTML5 becomes easier and amazing. What is the mobile hybrid? You only need 1x create applications and it can be used in smartphone platforms, such as Android, iOS. Compared with the jQuery framework, Ionic much faster.

Ionic using AngularJS, Node.js, SASS as its engine. As with most mobile framework, Ionic also has components / elements of the standard CSS used for smartphones, such as buttons, lists, cards, forms, range, tabs, and other grid.

AngularJS is a full MVC framework front-end, 100% Javascript, 100% client-side and is compatible with the desktop browser and mobile browser. I never discussed angularJS, because I still learning to use angularJS. I will discuss in other occasions.

That is a brief overview of ionic framework, if you want to try it please follow the next tutorial how to install ionic framework on windows and ubuntu

Ionic Framework installation on Windows and Ubuntu

1. Install Nodejs

For Windows users, make sure you have installed git

Then install the Node Js windows here

and for ubuntu users can use the package manager below

Node.js v4
curl -sL https://deb.nodesource.com/setup_4.x | sudo -E bash - sudo apt-get install -y nodejs

Node.js V5
curl -sL https://deb.nodesource.com/setup_5.x | sudo -E bash - sudo apt-get install -y nodejs

To check the installation of Node.js please open a command prompt (windows) or terminal (ubuntu) and type

node -v

if there is an error in windows

‘node’ is not recognized as an internal or external command, operable program or batch file.

Please set the Node.js PATH first on the Environment Variables

Select Start > Computer > System Properties > Advanced system settings > Environment Variables > System variables > PATH.

Add “C:\Program Files\nodejs ” without quote to the PATH variable.

and check your npm version

npm -v

if there is an error in windows

‘npm’ is not recognized as an internal or external command, operable program or batch file.

Please add the NPM path on Environment Variables

Add “C:\Program Files\nodejs\node_modules\npm\bin;” without quote to the PATH variable.

NOTE: Whenever you make changes to the PATH, or other environment variables, you must restart or logout for changes .

2. Cordova

Install cordova from command prompt or terminal

npm install -g cordova

And then check the cordova version

cordova -v

3. Java

Don’t forget to install java and setting the java path

Download Java

PATH Setting for Windows

“c:\Program Files\Java\yourjdkfolder;”

4. Ionic Framework

npm install -g ionic

Possible errors that occur when installing ionic is “cannot find module … ” blablabla… ( ‘bplist-parser’, ‘minimatch’, and etc ). When I installed ionic framework on windows machine everything was normal. But when i try install ionic framework to my ubuntu PC , i got this problem. We can solve this problem by install module one by one. with this script

npm install -g missing_module _name

But if all modules is missing, maybe you can download my ionic node module here and paste in you node modules folder