Mobile Day 2015
Cordova
Cellenza Microsoft
Lionel NIMONG @lionelthemonk
Aurélien GALTIER @AurelienGaltier
Cordova
Cellenza Microsoft
Lionel Nimong
Consultant Mobile
@lionelthemonk
Aurélien Galtier
Consultant Mobile
@AurelienGALTIER
Cellenza Microsoft
Comment nous le faisons :
• Formation continue
• Partage de
connaissance
• Partenariats
Cellenza en que...
Cellenza Microsoft
Programme Mobile Day
9h – 9h30 Welcome Café
9h30 – 10h30 Keynote d’ouverture : Mobilité, enjeux d’aujou...
Cellenza Microsoft
Cellenza Microsoft
Sommaire 1 Cordova
2 Web Mobile
3 Ionic
Cellenza Microsoft
Qu'est-ce que Cordova ?
Permet de créer des applications mobiles
C’est de l’hybride (Interprété et nati...
Cellenza Microsoft
Historique PhoneGap ….
Cordova est le projet PhoneGap développé par la société Nitobi
Nitobi est rachet...
Cellenza Microsoft
Qui utilise Cordova ?
Cellenza Microsoft
Aujourd’hui les applications existantes
Cellenza Microsoft
Cordova, plus concrètement…
Cellenza Microsoft
L’installation
Gestionnaire de paquets NodeJS
Utilisé pour Cordova
Cellenza Microsoft
Structure de l'application cordova
Cellenza Microsoft
Les WebView
UIWebView
(et non WKWebView)
Webkit
(android.webkit.WebView)
Classique IE
Cellenza Microsoft
Démo
Cellenza Microsoft
Application Café à 1 euro
Cellenza Microsoft
Application Café à 1 euro
Cellenza Microsoft
Application Café à 1 euro
Cellenza Microsoft
Application Café à 1 euro
Cellenza Microsoft
Application Café à 1 euro
Cellenza Microsoft
Application Café à 1 euro
Cellenza Microsoft
Application Café à 1 euro
Cellenza Microsoft
Démo
Cellenza Microsoft
Application Café à 1 euro
Cellenza Microsoft
Démo
Cellenza Microsoft
Responsive design
C’est toujours aussi rapide ?
Cellenza Microsoft
Responsive design
Adapté a toutes les plateformes
Même site et fonctionnalités
Site dynamique
Cellenza Microsoft
Single Application Page
Une seule page web
Pure code en HTML/JavaScript
HTTP/REST API WEB
Cellenza Microsoft
JavaScript
Cellenza Microsoft
JavaScript
MVVM
MVC
IOC
TDD
Cellenza Microsoft
Si c’est pas SPA
Navigation via les liens du navigateur
Une page HTML par vue
Cellenza Microsoft
Les plugins
WEB NATIF
Le pont entre le web et le natif
Cellenza Microsoft
Les plugins
Cordova est modulaire
Contient une grille de compatibilité
Un plugin pour chaque
fonctionna...
Cellenza Microsoft
Comment en ajouter
Ligne de commande
Ou Visual Studio
Cellenza Microsoft
Son propre plugin
Et si jamais j’ai un besoin un
peu trop spécifique ???
Cellenza Microsoft
Son propre plugin
Cellenza Microsoft
Son propre plugin
Le dossier du plugin
Cellenza Microsoft
Démo
Cellenza Microsoft
Son propre plugin
Partie C#
Partie JavaScript
Cellenza Microsoft
Qu’est ce que Ionic ?
Aujourd'hui de nouveaux outils construits autour de cordova (ionic/reapp)
Beaucou...
Cellenza Microsoft
Qu’est ce que Ionic ?
Surcouche de Cordova
UI pour mobile
Ergonomique
Basé sur AngularJS
Cellenza Microsoft
Comment utiliser Ionic ?
Ligne de commande
Seulement IOS et Android
Emulateur Android standard
Template...
Cellenza Microsoft
A quoi cela ressemble
Android menu en haut
Ios menu en bas
Cellenza Microsoft
Démo
Cellenza Microsoft
Avantage/Inconvénient
Avantages :
Gratuit
Intégré a Visual Studio
Compétence web
BootStrap en mobile ra...
Cellenza Microsoft
Dans quel cas l’utiliser ?
A utiliser :
Si vos équipe font du web
Si votre applis est une SPA
Avoir une...
Cellenza Microsoft
Questions
?
Prochain SlideShare
Chargement dans…5
×

MobileDay - Parcours 1 Hybride (Cordova)

679 vues

Publié le

Mobile Day by Microsoft & Cellenza - 25 Juin 2015. Parcours 1 Hybride Mobile (Cordova)

Publié dans : Mobile
0 commentaire
1 j’aime
Statistiques
Remarques
  • Soyez le premier à commenter

Aucun téléchargement
Vues
Nombre de vues
679
Sur SlideShare
0
Issues des intégrations
0
Intégrations
4
Actions
Partages
0
Téléchargements
44
Commentaires
0
J’aime
1
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive
  • Beaucoup de jeux (taichi panda, mafia wars,
  • Démo de cordova, hello world en ligne de commande
  • Qu’est ce que l’application café ? (Avec capture d’écran)
  • Qu’est ce que l’application café ? (Avec capture d’écran)
  • Qu’est ce que l’application café ? (Avec capture d’écran)
  • Qu’est ce que l’application café ? (Avec capture d’écran)
  • Qu’est ce que l’application café ? (Avec capture d’écran)
  • Qu’est ce que l’application café ? (Avec capture d’écran)
  • Qu’est ce que l’application café ? (Avec capture d’écran)
  • Démo de cordova, hello world en ligne de commande
  • Qu’est ce que l’application café ? (Avec capture d’écran)
  • Démo de cordova, hello world en ligne de commande
  • Qu’est ce que une SPA ? ….
    On choisis Angular JS Pourquoi on l’a choisis
  • On peut utiliser n’importe quel des framework javascript
    Jquery
    ReacJS
  • On peut utiliser n’importe quel des framework javascript
    Jquery
    ReacJS
  • Parler de ASP.Net MVC
    Comment faire la migration
    Reutiliser CSS/Javascript
    Redevelopper HTML
  • Démo de cordova, hello world en ligne de commande
  • Démo de cordova, hello world en ligne de commande
  • MobileDay - Parcours 1 Hybride (Cordova)

    1. 1. Mobile Day 2015 Cordova Cellenza Microsoft Lionel NIMONG @lionelthemonk Aurélien GALTIER @AurelienGaltier Cordova
    2. 2. Cellenza Microsoft Lionel Nimong Consultant Mobile @lionelthemonk Aurélien Galtier Consultant Mobile @AurelienGALTIER
    3. 3. Cellenza Microsoft Comment nous le faisons : • Formation continue • Partage de connaissance • Partenariats Cellenza en quelques mots Cellenza est un cabinet de conseil, d’expertise technique et de réalisation, exclusivement dédié aux technologies Microsoft et aux méthodes agiles. Notre passion, la technologie. Nous sommes des experts Microsoft, agilistes par nature, passionnés par notre métier. Consultants, coachs et/ou formateurs, nous avons à cœur de partager avec la communauté un savoir technique et méthodologique, mais aussi nos valeurs
    4. 4. Cellenza Microsoft Programme Mobile Day 9h – 9h30 Welcome Café 9h30 – 10h30 Keynote d’ouverture : Mobilité, enjeux d’aujourd’hui 10h30 – 11h30 La Mobilité selon Microsoft 11h30 – 11h 45 Pause café 11h45 – 12h45 Retour d’Expérience Client 12h45 – 13h45 Pause Déjeuner 13h 45 – 14h45 Web & Hybride Mobile Natif Natif Cross- Platform Back- Office 14h45 – 15h00 Pause 15h00 – 16h00 Web & Hybride Mobile Natif Natif Cross- Platform Back- Office 16h00 – 16h15 Pause 16h15 – 17h15 Web & Hybride Mobile Natif Natif Cross- Platform Back- Office 17h15 – 17h30 Pause 17h30 – 18h00 Conclusion
    5. 5. Cellenza Microsoft Cellenza Microsoft Sommaire 1 Cordova 2 Web Mobile 3 Ionic
    6. 6. Cellenza Microsoft Qu'est-ce que Cordova ? Permet de créer des applications mobiles C’est de l’hybride (Interprété et native) Le langage utilisé est HTML/CSS3/Javascript
    7. 7. Cellenza Microsoft Historique PhoneGap …. Cordova est le projet PhoneGap développé par la société Nitobi Nitobi est racheté par Adobe qui créé Cordova fork de PhoneGap Adobe laisse le moteur en open source et ce concentre sur des plugins avancés. Adobe® PhoneGap™ Build Adobe PhoneGap Enterprise The PhoneGap Developer App
    8. 8. Cellenza Microsoft Qui utilise Cordova ?
    9. 9. Cellenza Microsoft Aujourd’hui les applications existantes
    10. 10. Cellenza Microsoft Cordova, plus concrètement…
    11. 11. Cellenza Microsoft L’installation Gestionnaire de paquets NodeJS Utilisé pour Cordova
    12. 12. Cellenza Microsoft Structure de l'application cordova
    13. 13. Cellenza Microsoft Les WebView UIWebView (et non WKWebView) Webkit (android.webkit.WebView) Classique IE
    14. 14. Cellenza Microsoft Démo
    15. 15. Cellenza Microsoft Application Café à 1 euro
    16. 16. Cellenza Microsoft Application Café à 1 euro
    17. 17. Cellenza Microsoft Application Café à 1 euro
    18. 18. Cellenza Microsoft Application Café à 1 euro
    19. 19. Cellenza Microsoft Application Café à 1 euro
    20. 20. Cellenza Microsoft Application Café à 1 euro
    21. 21. Cellenza Microsoft Application Café à 1 euro
    22. 22. Cellenza Microsoft Démo
    23. 23. Cellenza Microsoft Application Café à 1 euro
    24. 24. Cellenza Microsoft Démo
    25. 25. Cellenza Microsoft Responsive design C’est toujours aussi rapide ?
    26. 26. Cellenza Microsoft Responsive design Adapté a toutes les plateformes Même site et fonctionnalités Site dynamique
    27. 27. Cellenza Microsoft Single Application Page Une seule page web Pure code en HTML/JavaScript HTTP/REST API WEB
    28. 28. Cellenza Microsoft JavaScript
    29. 29. Cellenza Microsoft JavaScript MVVM MVC IOC TDD
    30. 30. Cellenza Microsoft Si c’est pas SPA Navigation via les liens du navigateur Une page HTML par vue
    31. 31. Cellenza Microsoft Les plugins WEB NATIF Le pont entre le web et le natif
    32. 32. Cellenza Microsoft Les plugins Cordova est modulaire Contient une grille de compatibilité Un plugin pour chaque fonctionnalité
    33. 33. Cellenza Microsoft Comment en ajouter Ligne de commande Ou Visual Studio
    34. 34. Cellenza Microsoft Son propre plugin Et si jamais j’ai un besoin un peu trop spécifique ???
    35. 35. Cellenza Microsoft Son propre plugin
    36. 36. Cellenza Microsoft Son propre plugin Le dossier du plugin
    37. 37. Cellenza Microsoft Démo
    38. 38. Cellenza Microsoft Son propre plugin Partie C# Partie JavaScript
    39. 39. Cellenza Microsoft Qu’est ce que Ionic ? Aujourd'hui de nouveaux outils construits autour de cordova (ionic/reapp) Beaucoup de librairie/frameworks javascript facilitant le developpement mobile
    40. 40. Cellenza Microsoft Qu’est ce que Ionic ? Surcouche de Cordova UI pour mobile Ergonomique Basé sur AngularJS
    41. 41. Cellenza Microsoft Comment utiliser Ionic ? Ligne de commande Seulement IOS et Android Emulateur Android standard Template Visual Studio Windows Phone Emulateur Visual Studio Android
    42. 42. Cellenza Microsoft A quoi cela ressemble Android menu en haut Ios menu en bas
    43. 43. Cellenza Microsoft Démo
    44. 44. Cellenza Microsoft Avantage/Inconvénient Avantages : Gratuit Intégré a Visual Studio Compétence web BootStrap en mobile rapide Inconvénient Complexité (plugin …) Contexte web limitant (Performance, …) Même UX (Inconvénient/Avantage, …)
    45. 45. Cellenza Microsoft Dans quel cas l’utiliser ? A utiliser : Si vos équipe font du web Si votre applis est une SPA Avoir une applis mobile sur les stores rapidement Déconseillé : Si vous avez des besoins très spécifique mobile Si vous avez des interfaces très riches
    46. 46. Cellenza Microsoft Questions ?

    ×