Diapositiva 1
MILAN 20/21.11.2015
MILAN 20/21.11.2015 - Grenzi Lucio
MILAN 20/21.11.2015
MILAN 20/21.11.2015 - SPEAKERS NAME
Leave your feedback on Joind.in!
https://m.joind.in/event/codemotion-milan-2015
Use Ionic framework to develop mobile applications
Lucio Grenzi
Who is this guy
Freelance
Front end web developer
Over 10 years of programming experience
Open source addicted
Github.com/dogwolf
Overview
Native vs Web vs Hybrid app
Ionic intro
Ionic CLI
UI Components
Demos
I want build a new app!
https://www.flickr.com/photos/johnjoh/448665548/
Native apps
More platform, more problem
Language is specific to platform => codebase separation
Dimisihing the return
Web apps
Are website that looks like an app
Run by a browser
Native-like functionality in the browser
Hybrid apps
Embed HTML5 apps inside a thin native container
They can take advantage of the many device features
available.
Single base code (HTML 5 + Css + Js)
Apache Cordova
Open-source framework
Run HTML/JavaScript based applications
Native device functionality is exposed via JavaScript APIs
Does not include UI Components
Cordova architecture
https://blog.codecentric.de/en/2014/11/ionic-angularjs-framework-on-the-rise/
ngCordova
collection of 70+ AngularJS extensions
built on top of the Cordova API
Made build, easy deploy, test Cordova apps
http://ngcordova.com/
Ionic framework
Build mobile apps faster with the web mobile you know and
love
Modern web skills
Supported devices
Planned
Android 4+
IOS 6+
Ionic Architecture
https://blog.codecentric.de/en/2014/11/ionic-angularjs-framework-on-the-rise/
Powered by AngularJs
develop rich and robust applications
create a powerful SDK
extend HTML vocabulary for your application
fully extensible
Sass
Give your app the appropriate look and feel
CSS can be quickly manipulated
Standalone CSS (indipendent of JS framework)
Ionic's adoption in numbers
Over 20.000 stars on GitHub (Top 40 project)
600.000+ Ionic apps have been started from the CLI
Ionic CLI was downloaded 208.114 times in the last month
Released v1.0 on May 2015
How to get started
Install Ionic
First install node.js
Install Android ADT / iOS Xcode
Open console and type $ npm install -g cordova ionic
Start a project
$ ionic start iorun blank
Comprehensive app structure Ready for deploy and building
Run it
$ cd iorun$ ionic platform add android$ ionic build android$
ionic emulate android
Ionic built-in elements
List
Complex Lists
Collection repeat
Navigation
Tabs
Swipe menu'
Action sheet
Ionicons
Ionic box
Ready-to-go hybrid development environment for building mobile
apps with Ionic, Cordova, and Android
https://github.com/driftyco/ionic-box
Choose your Android version
Bootstrap.sh
Android version adoption
https://developer.android.com/about/dashboards/index.html
Ionic Lab
Ionic Creator
Ionic Market
Getting started guideionicframework.com/getting-started
Documentationionicframework.com/docs
Visit the Community Forumforum.ionicframework.com
Contribute on GitHubgithub.com/driftyco/ionic
Questions?
https://www.flickr.com/photos/derek_b/3046770021/
https://www.flickr.com/photos/wwworks/4759535950/
