Formation PhoneGap Cordova, développer des applications pour mobiles multi-plateformes

Cette formation PhoneGap Cordova vous permettra de maîtriser l’utilisation de ce framework JavaScript qui permet de développer une seule application pour la plupart des OS du marché dont iOS et Android en s’appuyant uniquement sur des technologies standard comme HTML5, CSS3 et JavaScript. Comme son nom l’indique, PhoneGap vise à combler le « gap » entre le développement web (HTML, CSS, JavaScript) et les applications mobiles natives (Java pour Android, Objective-C pour iPhone, C# pour Windows Phone) qui peuvent accéder aux fonctions spécifiques des équipements (caméra, vibreur, stockage local, etc.). Le framework se présente comme un ensemble de bibliothèques développées en langages natifs pour chaque OS et que l’on peut appeler comme s’il s’agissait de fonctions JavaScript « classiques ». Il est également possible de développer en langage natif ses propres briques et de les intégrer à PhoneGap. Les possibilités d’ajout illimité de ces plugins ont contribué au succès de PhoneGap. À l’inverse, le cœur de PhoneGap est modulaire et permet de n’activer que les modules nécessaires à l’application. L’application finale pourra donc être personnalisée et optimisée sur l’équipement mobile. Nous parlons bien d’application et une connexion WEB ne sera pas nécessaire pour afficher les pages dont le développement pourra s’appuyer sur les puissants effets visuels des technologies HTML5 et CSS3. Suite au rachat de PhoneGap par Adobe, l’ensemble du SDK cross-platform PhoneGap a été rebaptisé Cordova. Les nouveautés Cordova seront mises en œuvre dans cette formation.

Concrètement, dans cette formation PhoneGap Cordova vous apprendrez à :

• Comprendre la philosophie du développement avec PhoneGap (application hybride)
• Comprendre les différences avec une application native pure
• Comprendre l’architecture technique d’une application PhoneGap
• Générer une application pour iPhone, Android et Windows Phone
• Utiliser les capteurs d’un équipement
• Utiliser les ressources matérielles d’un équipement (appareil photo, fichiers, etc.)
• Utiliser les événements spécifiques à PhoneGap
• Développer vos propres plugins pour PhoneGap

Cette formation PhoneGap s’adresse aux développeurs d’applications mobiles et aux chefs de projets opérationnels.

Connaissances de base en développement web (JavaScript, HTML, CSS).
La connaissance des langages de développement Java ou Objective-C est un plus.

Les applications WEB sur mobile et tablette

• Exemple de Web Apps
• Les spécificités du développement mobile
• Comparaisons application native / application hybride
• Avantages inconvénients d’une application hybride
• Avantages inconvénient d’une application native
• Les différentes approches natives

Utilisation de HTML 5

• HTML5 : une nouvelle vision du langage
• Créer et structurer un document
• Gestion des formulaires
• Gestion de l’affichage des images multi-résolution
• Le dessin avec HTML5 et la balise canvas
• Les nouvelles API JavaScript
• Gestion des données côté client en HTML5
• Intégrer une carte Google Maps dans l’application

Le projet PhoneGap Cordova

• Les versions jusqu’ à la version 3.3.0
• Visibilité sur les prochaines évolutions
• Licences d’utilisation et de distribution
• Différences entre PhoneGap et Cordova
• Architecture détaillée d’une application PhoneGap/Cordova hybride
• Plates-formes mobiles supportées et caractéristiques

Mise en œuvre de PhoneGap

• Installer PhoneGap
• Première application hybride Hello World
• Installation du SDK spécifique pour iOS (Paramétrage du Mac, Xcode, etc.)
• Installation du SDK spécifique pour Androïd (JDK, environnement, SDK Androïd, Apache Ant, etc.)

Utilisation de Cordova en ligne de commande (interface CLI)

• Créer sa première application (cordova create, cordova platforms)
• Compiler son application (cordova build)
• Tester son application (cordova run, cordova emulate)

Utilisation de PhoneGap Cordova au quotidien

• Conseils sur le debuggage
• Utilisation de web Inspector
• Spécificité des OS
• Limites des tests depuis un émulateur
• Maîtriser l’utilisation de PhoneGAP pour de meilleurs performances

Utilisation des capteurs

• Vue d’ensemble des objets concernés (domaine d’utilisation, propriétés remarquables, conseils d’utilisation)
• PhoneGap versus HTML5
• Récupérer les mouvements de l’appareil selon les 3 axes (accéléromètre)
• Singularités de l’iPhone pour l’accéléromètre (intervalle d’écoute)
• Accéder à la position GPS du mobile (objets Geolocation et Position)
• Quelle garantie de l’API de géolocalisation ?
• Lire et enregistrer des fichiers audio avec l’objet Media
• Détecter l’orientation du device
• Gérer l’orientation avec media queries

Utilisation de ressources matérielles (appareil photo, système de fichiers, …)

Appareil photos et fichiers

• Problème d’accès aux fichiers suivant les plateformes (espace public/privée)
• Traiter les données reçues (type de l’image source)
• Que faire de l’image ?
• Obtenir le chemin du fichier à afficher
• Enregistrer une image
• Modifier la qualité d’une image
• Format des images et performances

Base locale des contacts

• Navigator.service.contacts.find
• Lire les données (ContactFields)
• Modifier un contact

Les événements

• Comprendre le chargement du code de PhoneGap (native, Javascript)
• De la bonne utilisation du chargement de PhoneGap (device ready)
• Passage de l’application à l’arrière plan (pause)
• Reprise de l’application (resume)
• Connexion et déconnexion d’Internet (online, offline)
• Gestion du bouton retour (backbutton)
• Comment redéfinir le comportement du bouton raccrocher sous Android (menubutton) ?
• Comment redéfinir le comportement de la recherche sous Android (searchbutton) ?

Développer un plugin PhoneGap/Cordova

Ajouter un plugin PhoneGap

• Deux façons différentes de faire la même chose
• Web Project Dev (depuis cordova 3.0 et la création de Cordova Command-line Interface (CLI))
• Native Platform Dev
• Le fichier config.xml
• cordova add/remove plugin
• Utilisation de plugman

Créer un plugin

• Différence entre les plate formes
• Gain en performance
• Les nouveaux services
• Quelques exemples concrets :
• – Plugin de cryptage natif
• – Plugin de traitement des QR Code
• – Plugin d’affichage de documents

Tous les exemples présentés s’accompagnent de manipulations et travaux pratiques de la part des participants. Vous développez une mini application de bout en bout qui reprend tous les points fondamentaux de la formation afin de disposer d’une maquette pédagogique opérationnelle à l’issue de la formation.