Getting Started with Ionic Framework

Ionic is a powerful, beautiful and easy to use open source front-end framework for developing hybrid (cross platform) mobile apps development. It is built on top of AngularJs (a client-side javascript framework), Syntactically Awesome Style Sheets (Sass) and Apache Cordova.

This is a quick start installation guide to get you up and running with Ionic and an introduction to the full list of Ionic starter templates.

Ionic’s ultimate goal is to make it easier to develop native mobile apps with HTML5, also known as Hybrid apps.

Install nodejs: http://nodejs.org/

npm install -g cordova ionic

Full list of Ionic starter templates

Start with a blank Ionic template

$ ionic start appName blank

Start with an Ionic tabs template

$ ionic start appName tabs

Start with a side menu Ionic template

$ ionic start myApp sidemenu

Start with an Ionic maps template

$ ionic start myApp maps

Start with an Ionic push notification template

$ ionic start myApp push

Start with an Ionic analytics template

$ ionic start myApp analytics

Start with an Ionic salesforce template

$ ionic start myApp salesforce

Start with an app containing ionic.io services

$ ionic start myApp io

Start with an app containing Ionic deploy

$ ionic start myApp deploy

A test of different kinds of page navigation

$ ionic start myApp tests

A complex list starter template

$ ionic start myApp complex list

Build and run app on iOS

1. Install iOS emulator
2. Change directory to app directory
3. Add iOS platform
4. Build app for iOS
5. Emulate app
6. Or run app on connected iOS device

$ sudo npm install -g ios-sim  
$ cd appName
$ ionic platform add ios
$ ionic build ios
$ ionic emulate ios
$ ionic run ios

Follow us on Twitter @ionicTnT