Ionic Framework
Angular JS-based, Open Source
- Performance obsessed
- Mobile-looking
- Industry standard
- Two way data binding
- Built on existing technologies you love
http://ionicframework.com/
http://ionicframework.com/getting-started/
http://ionicframework.com/docs/
What is Ionic?
Ionic Technology Stack
- Familiar tools
- Access the device with cordova plugins
OnsenUI
-
Speed
-
Built with angular
-
Shorter learning curve
-
Drag and drop studio
-
Jquery tolerant
http://onsenui.io/
- Community
Why Ionic over OnsenUI?
- Ionic's Showcase
- Angular support and Theme
- Mature features and CSS components
What is Inside?
- Ionic CSS
- Ionic Icons
- Ionic Directives
Ionic CSS
- Elegant yet very lightweight
<div class="list">
<div class="item item-divider">
Candy Bars
</div>
<a class="item" href="#">
Butterfinger
</a>
</div>- 3D animations, HW accelerated.
- sass-based f or custom theming
- 500 f ree icons (ionicons)
http://ionicf ramework.com/docs/
Ionic Directives
- Mobile Navigation and Interactions
<ion-list>
<ion-item ng-repeat="item in items"
item="item"
can-swipe="true"
option-buttons="itemButtons">
</ion-item>
</ion-list>- Services for gestures and navigation
http://ionicframework.com/docs/api
Ionic Navigation
- based on UI-Router
- UI Gallery
- Sub-Views
- Navigation History
http://showcase.ionicframework.com/
Ionic Tooling
npm -g install ionic
ionic start myApp tabs
cd myApp
ionic platform add ios
ionic build ios
ionic emulate iosPhoneGap based build chain
Go live!
http://192.168.194/IonicSajee/index.html
SWAGGER
Make your API accessible
Documentation
•No standard
•Ad-hoc attributes
•Managed manually
•Not up to date
Swagger is…
- Technology
- A framework for producing,consuming
The Swagger Specification
- JSON to specify metadata
- JSON to specify API structure
- JSON schema for the model specification
- Machine readable
- Language agnostic
Swagger - API Listing
Subtitle
API Listing - Annotations
API Details
Test the API
