Post on 29-Jan-2018
#DevoxxFR @Audrey_Neveu @IonicFramework
Le Framework mobile hybride carrément addictif
Audrey Neveu - @Audrey_Neveu
#DevoxxFR @Audrey_Neveu @IonicFramework
A propos de moi
Devangelist @StreamdataIO
Co-Leader Devoxx4Kids France
@Audrey_Neveu
#DevoxxFR @Audrey_Neveu @IonicFramework
Introduction
#DevoxxFR @Audrey_Neveu @IonicFramework
Le problème
...
#DevoxxFR @Audrey_Neveu @IonicFramework
Les solutions
#DevoxxFR @Audrey_Neveu @IonicFramework
La nouvelle solution
+=
#DevoxxFR @Audrey_Neveu @IonicFramework
Chacun son rôle !
✓ Conception des interfaces➙ HTML5, CSS3, Sass, LESS,
Javascript➙ Ionic framework
✓ Logique métier➙ Angular JS
✓ Génération plates-formes cibles➙ Cordova
#DevoxxFR @Audrey_Neveu @IonicFramework
L’environnement
#DevoxxFR @Audrey_Neveu @IonicFramework
Command Line Interface
#DevoxxFR @Audrey_Neveu @IonicFramework
Ionic Lab
#DevoxxFR @Audrey_Neveu @IonicFramework
Gestion de dépendances
#DevoxxFR @Audrey_Neveu @IonicFramework
Gulp & Saas
#DevoxxFR @Audrey_Neveu @IonicFramework
Ionic start
#DevoxxFR @Audrey_Neveu @IonicFramework
Les templates
#DevoxxFR @Audrey_Neveu @IonicFramework
Structure d’un projet
#DevoxxFR @Audrey_Neveu @IonicFramework
Ionic run
#DevoxxFR @Audrey_Neveu @IonicFramework
Tester / Debugger
✓ Dans le navigateur : Serve➙ http://localhost:8100/➙ tout ne peut pas être émulé !
✓ Sur device ou émulateur : Run➙ option livereload [Beta] (-l) pour exécuter sur http://192.
168.1.1:8100/➙ option log console (-c) pour avoir les logs de l’application➙ option log server (-s)
#DevoxxFR @Audrey_Neveu @IonicFramework
chrome://inspect/#devices
#DevoxxFR @Audrey_Neveu @IonicFramework
Ionic build
#DevoxxFR @Audrey_Neveu @IonicFramework
Les services
#DevoxxFR @Audrey_Neveu @IonicFramework
Les composants
#DevoxxFR @Audrey_Neveu @IonicFramework
CSS
#DevoxxFR @Audrey_Neveu @IonicFramework
Ionicons
#DevoxxFR @Audrey_Neveu @IonicFramework
SplashScreen & Icon
#DevoxxFR @Audrey_Neveu @IonicFramework
ng-cordova
✓ File✓ Media✓ Camera✓ iBeacon✓ Calendar
✓ Geolocation✓ Bluetooth✓ OAuth✓ Contacts✓ HealthKit
✓ Push notifications✓ TouchID✓ Social sharing✓ Battery✓ ...
#DevoxxFR @Audrey_Neveu @IonicFramework
Demo
#DevoxxFR @Audrey_Neveu @IonicFramework
Toujours plus
#DevoxxFR @Audrey_Neveu @IonicFramework
View
#DevoxxFR @Audrey_Neveu @IonicFramework
Platform [Beta]
#DevoxxFR @Audrey_Neveu @IonicFramework
User
#DevoxxFR @Audrey_Neveu @IonicFramework
Push
#DevoxxFR @Audrey_Neveu @IonicFramework
Push
#DevoxxFR @Audrey_Neveu @IonicFramework
Analytics
#DevoxxFR @Audrey_Neveu @IonicFramework
Deploy
#DevoxxFR @Audrey_Neveu @IonicFramework
Package
#DevoxxFR @Audrey_Neveu @IonicFramework
Market
#DevoxxFR @Audrey_Neveu @IonicFramework
Creator
#DevoxxFR @Audrey_Neveu @IonicFramework
Retour d’XP
#DevoxxFR @Audrey_Neveu @IonicFramework
Bilan
#DevoxxFR @Audrey_Neveu @IonicFramework
Bilan
Intégration de nombreuses directives Angular …
… mais pas toujours à jour.
… parfois non finalisées
Livraisons régulières pour suivre les versions Angular
… mais des bugs ouverts depuis plusieurs mois
Doc plutôt complète …
#DevoxxFR @Audrey_Neveu @IonicFramework
A vous de jouer
IS YOUR FRIEND
#DevoxxFR @Audrey_Neveu @IonicFramework
Production ready? Oui, mais ...
✓ Support iOS 6, Android 4.1 et Windows 8 seulement
✓ Platform gratuit durant la beta seulement
➔ Idéal pour un prototype
#DevoxxFR @Audrey_Neveu @IonicFramework
L’avenir
#DevoxxFR @Audrey_Neveu @IonicFramework
Ionic 2.0 [Beta]
✓ Navigation améliorée
✓ Ionic Native
✓ Nouveau système de Theming
✓ Platform Continuity (Material Design)
✓ TypeScript Support
✓ ES6
✓ Animation System
✓ And more to come
#DevoxxFR @Audrey_Neveu @IonicFramework
Pour continuer
✓ www.nraboy.com
✓ www.gajotres.net
✓ gonehybrid.com
✓ devdactic.com
✓ www.surfinfoweb.com
@maxlynch
@adamdbradley
@Ionicframework
@ionitron
#DevoxxFR @Audrey_Neveu @IonicFramework
Merci !
Des questions ?