#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 ?