Overview of Ionic:
The beautiful, open source front-end SDK for developing hybrid mobile apps with HTML5. Ionic offers a library of mobile-optimized HTML, CSS and JS components, gestures, and tools for building highly interactive apps. Built with Sass and optimized for AngularJS.
Speed is important. So important that you only notice when it isn’t there. Ionic is built to perform and behave great on the latest mobile devices. With minimal DOM manipulation, zero jQuery, and hardware accelerated transitions, one thing is for sure: You’ll be impressed.
AngularJs is an open source web application framework maintained by Google and community and assist developers in creating single page applications. Its goal is to augment web applications with model-view-controller (MVC) capability in an effort to make development and testing easier. Ionic utilizes Angular in order to create a powerful SDK most suited to develop rich and robust applications. Ionic not only looks nice, but its core architecture is built for serious app development, and Angular ties in perfectly.
Sass is a scripting language that is interpreted into Cascading Style Sheets (CSS). Ionic’s coming with precompiled CSS file in starter project, which located in project’s www/lib/ionic/css directory, and is linked to the app. However, Ionic projects can also be customized using Sass, which gives developers and designers “superpowers” in terms of creating and maintaining CSS.
Ionic is modeled on popular native mobile development SDKs, making it easy to understand for anyone that has built a native app for iOS or Android. Just drop it in your code to get going, and push through Cordova when it’s ready. Develop once, deploy everywhere.
User Experience and Design
Clean, simple, and functional. Ionic has been designed to work and display beautifully on all current mobile devices. With tons of popular mobile components, typography, interactive paradigms, and a gorgeous (yet extensible) base theme, you’ll wonder how you lived without it.
Ionic Lab, Live Reload, View App
We can build and test our app in android and ios both side by side in browser. It’s support live reload also. No need to reload web page and install app in emulator or device. We can upload our app in ionic app center and share with anyone to view that app. Easy to view app in device using ionic view app.
Access Device Feature:
Battery Status, Camera, Contacts, Device Orientation, Dialogs, File Transfer, Geolocation, Media Capture, Network Information, Splash screen, Status bar, Vibration
Targeted Device Platforms
Android, iOS, Blackberry, FirefoxOS, WebOS, Windows
Environment Setup and App develop
Before we start on any development, NodeJS installation is important. You can download it from NodeJS website.
Ionic & Cordova
The below command should install all related modules and dependencies for ionic and Cordova.
E:\poc>npm install -g cordova ionic
Now Let’s Verify ionic by typing the below command:
You have installed ionic successfully !!!
Let make an App
Use the below command to create an ionic cordova app:
E:\poc>ionic start myApp tabs
Use the below command to run an myApp:
E:\poc>cd myAppE:\poc>ionic platform add android
E:\poc>ionic build android
E:\poc>ionic emulate android
Yes, that’s it. It is so easy to build a hybrid mobile application with ionic. For More detail and development tips please refer below URL.
Thank You !