Ionic Framework : How to create simple mobile application

Ionic Framework 

Why we need Hybrid Mobile Application

Hi All, today everyone wants to have their business on smartphone  using mobile application.By using mobile application one(company/seller) could be connected to customers 24 X 7 on their smartphones, so this would give their company value,revenue,popularity etc..
So before Hybrid Mobile Application, we were required to learn mobile OS specific language like Android,.Net,J2ME etc.. which would take lots of time in development as well as in testing.

Now using Hybrid Mobile Application we just need to learn

1. Java Script 
2. CSS 3
3. HTML 5

There are many frameworks available in the market for creating hybrid mobile applications like reapp,Ionic,SuperSonic etc.. We can choose any framework and start doing development. 

So I choose Ionic from a long list of frameworks, lets dive into this.

Getting Started With Ionic

Ionic is a powerful HTML5 native app development framework that helps you build native-feeling mobile apps all with web technologies like HTML, CSS, and Javascript.


Ionic is focused mainly on the look and feel, and UI interaction of your app.That means we aren’t a replacement for PhoneGap or your favorite Javascript framework. Instead, Ionic simply fits in well with these projects in order to simplify one big part of your app: the front end. Ionic currently requires AngularJS in order to work at its full potential. While you can still use the CSS portion of the framework, you’ll miss out on powerful UI interactions, gestures, animations, and other things.

Lets start building our first application using Ionic Framework.

Before start development we need to follow some installation steps :-

1. Install Node.js
2. Run npm install -g ionic cordova  using command prompt

This command will install Ionic as well as cordova . Now Its time to create mobile application in Ionic using ready-made app templates which are

Open command prompt and Run any as per the template you chose

• ionic start myApp blank
• ionic start myApp sideMenu
• ionic start myApp tabs

Lets Execute It

1. cd myApp
2. ionic platform add ios/android
3. ionic build ios/android
4. ionic emulate ios

If you are in development phase you can test your application using following command after 1st step without performing 2nd,3rd and 4th step.


ionic serve

above command will run your application on in-built local server and open your browser and run the application.