Ionic is an HTML5 SDK for mobile applications using Apache Cordova, allowing developers to code in HTML, Javascript, and CSS. Ionic provides out-of-the-box components for even faster development.

Environment Setup

For this setup, we will be configuring a Mac so we can create an Ionic project and install it on an iPhone.

Install Node JS

Using brew, we can call this command

sudo brew install node

Install Cordova and Ionic

sudo npm install -g cordova
Sudo npm install -g ionic

Test Installation

Create an Ionic template and run it by doing the code below.

cd ~
mkdir workspace
cd workspace
ionic start exampleApp tabs
cd exampleApp
ionic platform add ios
ionic serve

After you run the “serve” command, you should see something like this

Just point your browser to the dev URL and you should be good to go.

IDE – Sublime Text – configuring build

Once you get need to deploy your application to your IOS device, you can do this simple configuration in Sublime to avoid the hassle of typing in the build command for IOS.

Go to Tools > Build System > New Build System. This will open a new pane for you to create a command to run when you invoke build in Sublime.

        "shell_cmd": "/Users/<MacUser>/"

This will execute the shell script to do the build. Your will look like this.

#!/bin/bash -x
cd /Users/MacUser/workspace/exampleApp;
/usr/local/bin/node /usr/local/bin/ionic build ios;

Now hit F7 and see if the build works.


In the next installment Ionic Development – Part 2: Integrating Google Maps, we’ll show how to add Google Maps to your application.

Share This