<Hmidi Hamdi>
+Hybrid Apps with AngularJS and Ionic
Framework
Hmidi HamdiWeb & Mobile DevlopperSoftware Engeneering @ ISSATSoFounder & Member @ IGC JSA @ JCertif Tunisia
Do you need Mobile Apps ?
More Plateforms ! More Problems
Native Apps
● Plateform specific ● Respective Devloppment Tools● Best Performance● Time Consuming● Expensive Devloppement
want to support all major plateforms even mobile web
You need cool web technologies
Hybrid Apps
● All Plateforms(iOS, Android, Windows Phone)● HTML5, CSS3 and JS● Limited Performance● Quick devlopment● Direct Access to Native APIs with Cordova.
Apache Cordova is a platform for building native mobile applications using HTML, CSS and JavaScript
PlateformsAndroid
Blackberry
FirefoxOS
iOS
Tizen
WebOS
Windows Phone 7
Windows Phone 8
PluginsBattery Status
Camera
Contacts
Device Orientation
Dialogs
File Transfer
Geolocation
Media Capture
Network Information
Splashscreen
Statusbar
Vibration
What is Angular JS
JavaScript MVW FrameworkFeatures : Directives, Filters, Two-way data
binding, Services, DI and Testability
What is Ionic
An Open source framework for developing hybrid mobile apps with Angular, Sass and
cordova
Best Friend with Angular
● UI Components are Angular Directives● Ready to work with your App
Ionicons
Lists
Complex Lits● Ng Directive● Show by swiping
Tabs
Side Menu
Slide Box
Action Sheet
Ionic Routing
Start, Build, Run and emulate
Android Building
● Install JDK .● Install Android SDK. ● Add Android SDK tools and plateform-tool to
Path variables.● Install Node JS.● Install Git.● Install Appache Ant.
Install Ionic & Cordova Globally
$ npm install -g cordova ionic
Ionic Templates
$ ionic start myApp blank $ ionic start myApp tabs $ ionic start myApp sidemenu
Clone Demo Project
$ ionic start AppName TemplateName
Add Platform, Build & Emulate
$ ionic platform add ios $ ionic build ios $ ionic emulate ios $ ionic serve --lab
Let’s Build
Q/A
Thank You !!!