Rossi Oddet
Rossi Oddet Développeur | Formateur IT

Formation Cordova à l'Ecole des Mines de Nantes

Formation Cordova à l'Ecole des Mines de Nantes

Nous étions les 23, 24 et 27 février à l’Ecole des Mines de Nantes1 pour donner une formation sur Apache Cordova2.

90% de pratique

Cette formation est pensée comme une immersion dans l’écosystème d’Apache Cordova avec une partie théorique succincte. Son objectif est d’initier les participants à Apache Cordova à travers le développement d’une application Conference avec les fonctionnalités suivantes :

  • Consulter les informations des différentes sessions, des présentateurs, …
  • Consulter les informations du téléphone : version de l’OS, réseau connecté, …
  • Ajouter ou Supprimer un présentateur de ses contacts
  • Prendre des photos d’une session
  • Evaluer une session
  • Ajouter des commentaires à une session
  • Et des fonctionnalités issues de l’imagination par les participants

Profil des participants

Les participants sont des élèves ingénieurs en dernière année d’alternance. Ils ont une bonne pratique des technologies Web en Entreprise. Ils sont très familiers de JQuery, Bootstrap, …

Le parti pris

Les formations sur Phonegap/Cordova sont souvent associées à l’apprentissage de modules graphiques : JQuery Mobile, Kendo UI, …

Dans cette formation, les choix suivants ont été faits :

  • Les participants utilisent les technologies qu’ils connaissent (JQuery, Bootstrap, …)
  • Cordova est utilisé uniquement pour ce pour quoi il est fait : accéder aux ressources matérielles, générer des livrables pour les différentes plateformes, …

L’idée derrière est de bien dissocier Cordova des modules graphiques du marché et surtout confronter les participants aux problématiques liées au mobile (qui peuvent être transparentes lors de l’utilisation d’une bibliothèque graphique). Cordova impose une seule contrainte dans le développement d’une application Web : insérer une référence à cordova.js lorsque des API de Cordova sont utilisés. Tout le reste, c’est de la cuisine interne du développeur.

Android comme plateforme de test

Le choix de la plateforme mobile de test n’a pas été très difficile. Le SDK Android a l’avantage de pouvoir s’installer sur différents OS : Windows, Mac, Linux, …

Il y avait une hétérogénéité dans le choix du système de déploiement :

  • L’émulateur fourni par le SDK Android. Ses performances restent déçevantes.
  • L’émulateur Genymotion 3, plus performant que l’émulateur Android.
  • L’émulateur iOS (un étudiant a fait le choix d’utiliser le SDK iOS).
  • Un smartphone Android.

Cordova, Phonegap, Kezako ?

Nous sommes revenus sur :

  • L’histoire commune à Phonegap et Cordova.
  • Leurs différences de nos jours.
  • L’intérêt d’utiliser ce type de plateforme
  • Des exemples d’applications hybrides
  • L’installation de Cordova et les premières commandes utiles

Du code ! Du code !

Le développement de l’application Conference est lancé.

Les données (sessions, présentateurs) sont issues de la dernière édition du BreizhCamp4.

La stack technique Web : JQuery, Bootstrap, Material Design for Bootstrap5, …

  • Etape 1 : Créer les différentes pages Web de l’application

Initialisation de l'application Conference

  • Etape 2 : Installer le plugin Device et créer une page technique qui affiche les informations du téléphone

Page technique de l'application Conference

  • Etape 4 : Gérer les événements “Back” sous Android

  • Etape 5 : Ajouter et supprimer un présentateur de ses contacts via le plugin Contacts API Contacts Cordova

  • Etape 6 : Donner la possibilité à l’utilisateur d’ajouter une photo à une session API Camera

  • Etape 7 : Gestion du stockage des photos dans l’appareil mobile

A partir de cette étape, les étudiants doivent exploiter leurs créativités pour trouver comment présenter les prochaines fonctionnalités.

  • Etape 8 : Donner la possibilité à l’utilisateur d’évaluer une session (mettre une note)

  • Etape 9 : Pouvoir ajouter des notes ou commentaires à une session

  • Etape 10 : Ajout de nouvelles fonctionnalités issues de la créativité des participants

Bootstrap, Material Design for Bootstrap et Cordova

Cette session a permis d’évaluer l’utilisation de Bootstrap & Material Design for Bootstrap dans un projet Cordova.

Si ces librairies graphiques ont permis d’avoir un visuel agréable rapidement et une productivité dans les développements, les aspects animations ont été très décevants et pas du tout penser pour le mobile.

Des composants tels que le slider sont à la limite de l’utilisabilité :)

JQuery pour faire du Single Page Application est à la fois une tristesse et un exercice intéressant en terme d’organisation de code Javascript.

Un point sur le Web Mobile

Nous avons pris le temps de faire un point global sur le Web Mobile :

  • Une comparaison entre Natif, Hybride et Web
  • L’évolution du support d’HTML 5 ces dernières années
  • Les tendances en faveur du Web sur mobile

Le contenu de cette partie est en très grande partie inspiré de la présentation que j’ai faite lors du dernier JCertif Tunisie6.

Conclusion

Une expérience très enrichissante avec des étudiants motivés. Je vais devoir maintenant évaluer leurs travaux, une autre partie très intéressante du travail d’un formateur professionnel : Donner une note à un développeur (un prochain sujet ?…).

Ressources

comments powered by Disqus