Installing the Ionic framework

---

You can develop Ionic apps on any operating system you prefer. Ionic has been developed for the 3 major OS platforms viz. Windows, Mac OS X and Linux. You can build your entire App source codes on any platform.

However, when it comes to compiling and generating the distributable App, there is one limitation. On Windows or Linux you will only be able to generate the distributable App for Android. On a Mac OS X you will be able to compile both for Android as well as iOS. So, if you wish to develop Apps both for Android as well as iOS, you need a Mac Computer and install ionic framework on a Mac.

For the purpose of this article, I will discuss about installation and setup on a Windows computer, considering that a majority of users own a Windows computer.

Also, if you are a beginner App developer and do not own a Mac computer, there is no point in buying the expensive Mac machine at this stage. Spend some time building Android Apps on a Windows PC and once you have acquired a decent level you can invest in a Mac.

Please note that the app source code that you develop on a windows computer can be simply taken as it is on a Mac computer and compiled there to generate the iOS version of the App.

Minimum Requirements

Ionic is desgined to build Apps for iPhone (iOS 7+) and Android (4.1+) devices. At the minimum, you require the following software installed and setup on your computer to be able to build hybrid mobile apps using the Ionic framework.

1. Node Package Manager (npm)

This is the first software that you need to install. The Node package manager is the core software that will enable you to install the Ionic framework along with Cordova. Ionic is essentially a module of npm - npm is the default package manager for the JavaScript runtime environment Node.js. It gets installed automatically when you install Node.js. Hence, to install npm, you need to install Node.js.

NPM includes a command line interface through which you can interact with a remote registry by firing various npm commands. It will allow you to utilize and incorporate ready made JavaScript modules in your applications by downloading them from the registry.

1. Visit nodejs.org and download the recommended version of Node.js. This will download the Windows installer.
   
2. Run the installer by clicking at the .msi file that you downloaded.
3. Follow the guided installation process. Use the default installation preferences.
4. Restart your computer.
5. Test to ensure that the Node package manager has been installed correctly. A simple check would be to simply run the following commands from your Windows Command Prompt:
   

    c:\> node -v
   

   This will output the version number of Node, such as:

    v6.9.5
   

   
   You can further check if npm is installed by running the following command:
   

    c:\> npm -v
   

   This will output the version number of npm, such as:

    3.10.10
   

2. Git Bash

Git is a free and open source distributed version control system. While building your apps you will need to execute commands in the Git Bash. Git for Windows provides a Bash emulation used to run Git from the command line. Linux/Unix users would already be familiar with the Bash interface. Git also provides a GUI interface. However, for our purposes we only need the command line interface.

On Windows, download and install Git for Windows from the Git-SCM website. The moment you visit this website, it will auto-detect your windows version and start the download process. Just follow through the steps, as shown below:

Now that Git Bash is installed, you can invoke this CLI by simply right-clicking on any folder in Windows Explorer.

3. Ionic CLI & Apache Cordova

Ionic apps are created and developed primarily through the Ionic CLI (Command Line Interface), and use Cordova to build and deploy on the app store as a native app. Apache Cordova takes our app and bundles it into a native wrapper to turn it into a traditional native app. The Ionic CLI makes it easy to start, build, run, and emulate Ionic apps.

Now that you have successfully installed npm and Git Bash, you are ready to install ionic and cordova.

1. First create a folder under which you will store all your App projects.
2. Right-click on your App root folder and click at Git Bash Here

   

   

3. Now, with one command you can install both Ionic CLI & Codova.

    $ npm install -g ionic cordova
    

   The -g switch ensures that ionic and cordova are installed globally. On Mac or Linux, the command will be prefixed with sudo.

    $ sudo npm install -g ionic cordova
    

   Wait patiently for a few minutes until you get back the $ prompt of Git Bash CLI. Once this installation is complete you are ready to start building your Ionic Apps. However, to make life easy, we will install a few more software...

4. IDE - Visual Studio Code

For development convenience, you require a smart code editor. There are several editors available. However, I would recommend Visual Studio Code. Visual Studio Code is a source code editor developed by Microsoft. VS Code is available for Windows, Linux and Mac. It provides a smart IDE (Integrated Development Environment) with support for debugging, embedded Git control, syntax highlighting, intelligent code completion, snippets, and code refactoring.

Here is the link for downloading VS Code - https://code.visualstudio.com/download. Spend some time at their website to understand how to install and set it up. it is fairly straight forward.

5. Android SDK

Android SDK is required for publishing your App for Android. It is also required for testing your Apps in a Mobile Phone Emulator.

For building native apps for iOS and Android, each platform has certain features and installation requirements so that you get the most out of your Ionic and Cordova development. Depending on the platforms you wish to develop for, you will need to install some platform-specific tools. Follow the Cordova platform guides for Android and iOS to make sure you have everything needed for development on these platforms.

After you have installed all of the above 5 sets of software, you are ready to embark on your App Development mission. In subsequent articles, I will demonstrate how you can build mobile apps, through real world examples of some simple mobile apps.

---