Installing IONIC On Windows

In this article, we are going to install ionic and all its dependencies, in the last articles we got familiar with ionic framework. We have used Visual Studio Code to manage the code and used some directives; as we know ionic is a HTML5 mobile app development framework targeted at building hybrid mobile apps. Hybrid apps have many benefits over pure native apps, specifically in terms of platform support, speed of development, and access to 3rd party code. Ionic Framework official website states,

"Ionic apps aren’t meant to be run in a mobile browser app like Chrome or Safari, but rather the low-level browser shell like iOS’s UIWebView or Android’s WebView, which are wrapped by tools like Cordova/PhoneGap."

Now, we are going to walk through the process of downloading Ionic and installing all necessary dependencies for development. We can develop Ionic apps on any operating system like Mac OS X, Linux, and Windows. Because we are on Windows, make sure to download and install Git for Windows and optionally Console2. You will be executing any commands in this guide in the Git Bash or Console2 windows.

Install Git

Install Git

We are going to install Git and will be executing any commands in Git Bash.

commands

path

After complete install, it will launch Git Bash,

install

If it is not launching default, then we can also open it from Start, All Programs, Git, then Git Bash

Programs

Installing Cordova

Now we will install the most recent version of Apache Cordova, which will take our app and bundle it into a native wrapper to turn it into a traditional native app. Cordova command-line runs on Node.js and is available on NPM.

So first we need to install Node.js,

install

After completing the install of Node.js restart Git Bash and install Cordova.Apache Cordova is an open-source mobile development framework. It allows you to use standard web technologies - HTML5, CSS3, and JavaScript for cross-platform development. Applications execute within wrappers targeted to each platform.

$ npm install –g cordova

install

install

We are developing for Android and have to make sure we have the following installed and set up.

  • Java JDK
  • Apache Ant
  • Android SDK

Install Java JDK

Install the most recent Java JDK. And creating an environment variable for JAVA_HOME pointing to the root folder where the Java JDK was installed. So, if we installed the JDK into C:\Program Files\Java\jdk7, set JAVA_HOME to be this path. After that, add the JDK's bin directory to the PATH variable as well. Following the previous assumption, this should be either %JAVA_HOME%\bin or the full path C:\Program Files\Java\jdk7\bin

Install


Install

Install Apache Ant

Apache Ant's build files are written in XML and they take advantage of being open standard, portable and easy to understand. To install Ant, download zip , extract it, move the first folder in the zip to a safe place, and update your PATH to include the bin folder in that folder. Path can be => last path; C:\apache-ant-1.9.6\bin;& then press Ok.

Install

Install

Install

Install Android SDK

Installing the Android SDK is also necessary. The Android SDK provides the API libraries and developer tools necessary to build, test, and debug apps for Android.Cordova requires the ANDROID_HOME environment variable to be set. This should point to the android-sdk directory. For android SDK I have installed android studio.

sdk

After completing the installation, create ANDROID_HOME environment variable,

variable

Now set ANDROID_HOME to the path.

path

Now install the ionic, to install it simply run:

$ npm install –g ionic

run

After completion, Congratulations! We have installed ionic successfully with all it dependencies to create a Cordova project somewhere on the computer for coding our app: on windows platform. In this article we not only focused  on how to install the ionic framework, weeven  made our windows platform ready to make new apps using Cordova and Ionic.

References
 
Read more articles on Ionic

Up Next
    Ebook Download
    View all
    Learn
    View all