Description

Cette formation propose une vue d’ensemble des techniques de développement d’applications multiplateformes. Les participants découvriront les différences entre les applications web adaptatives classiques et les applications mobiles, ainsi que les principaux frameworks disponibles. Ils apprendront également à exploiter des fonctionnalités mobiles telles que le stockage de données et la géolocalisation

À qui s'adresse cette formation ?

Pour qui ?

Développeurs et chefs de projets mobilité.

Prérequis

• Bonnes connaissances du Web, d'HTML de CSS. Connaissances de base du JavaScript et du XML.

Les objectifs de la formation

• Identifier les spécificités d'une application mobile.
• Découvrir les solutions de développement mobile.
• Construire une application mobile complète.
• Comprendre le processus de publication d'une application mobile. Piloter un projet mobile.

Programme de la formation

• Rappels sur les technologies de base
  • Présentation des familles de terminaux : smartphones et tablettes, ainsi que leurs spécificités.
  • Rappels sur les technologies HTML, CSS et JavaScript.
  • Introduction aux outils de développement modernes : NodeJS, NPM, Bower, Gulp.
  • Présentation des moteurs de rendu WebKit et Gecko.
  • Rôle et intégration du user-agent.
  • Communication Ajax : apports et limites selon les environnements mobiles.
  • Outils de développement, de test et de simulation.
  • Travaux pratiques : mise en place d’un environnement de travail dédié au mobile.
• Solutions embarquées
  • Présentation des familles de terminaux : smartphones et tablettes, ainsi que leurs spécificités.
  • Rappels sur les technologies HTML, CSS et JavaScript.
  • Introduction aux outils de développement modernes : NodeJS, NPM, Bower, Gulp.
  • Présentation des moteurs de rendu WebKit et Gecko.
  • Rôle et intégration du user-agent.
  • Communication Ajax : apports et limites selon les environnements mobiles.
  • Outils de développement, de test et de simulation.
  • Travaux pratiques : mise en place d’un environnement de travail dédié au mobile.
• Différence entre application Web traditionnelle et mobile
  • Différences entre les navigateurs : moteurs JavaScript, CSS, limite des plug-ins (Flash, PDF.
  • ), autres spécificités.
  • Différence des tailles des écrans et solutions.
  • Différences matérielles (CPU, mémoire).
• Construction XHTML, HTML5
  • Les balises META et spécifiques : viewport et paramétrage dynamique des CSS.
  • Les balises traditionnelles de structuration des pages web.
  • Construction et mise en forme des tableaux.
  • Les liens et l’utilisation de l’attribut accesskey.
  • Gestion des images sur les terminaux : formats, poids et optimisation.
  • Les éléments textuels : p, span.
  • Les blocs div et canvas en HTML5.
  • Les formulaires et leurs composants.
  • Nouveaux types de champs (daterange, slider…).
  • Activation du clavier numérique selon les contextes.
  • CSS et importance du mode multicanal.
  • Positionnement des éléments et navigation dans la page (z-index, display…).
  • Apports de CSS3 en HTML5.
  • Simplification de la création et maintenance des CSS avec Bootstrap, Sass, Compass et Less.
  • Rôle du DOM dans le portage multi-terminaux.
  • Environnement mobile : capteurs, batterie, détection réseau.
  • Événements multitouch : gesture, touch, drag & drop.
  • Protocoles de communication : WebSocket, Ajax, et apport de Node.js.
  • Bibliothèque graphique : API de dessin (formes, lignes), gestion des couleurs et manipulation d’images.
  • Tests de conformité W3C et outils de validation.
  • Travaux pratiques : création de formulaires, boutons et composants ; gestion de la rotation via CSS ; événements tactiles ; drag & drop ; mini-applicat
• Stockage des données dans le mobile
  • Mise en place d’une stratégie de fonctionnement en mode déconnecté.
  • Utilisation du manifest et optimisation de la mise en cache des ressources des sites mobiles.
  • Bases de données embarquées : SQLite et IndexedDB intégrées au navigateur.
  • Langage SQL et outils d’administration associés.
  • Gestion et pilotage des données en JavaScript : création de tables et exécution de requêtes.
  • Utilisation de Google Gears pour les terminaux non compatibles HTML5.
  • Gestion du cache côté client pour le travail hors connexion : localStorage et sessionStorage.
  • Travaux pratiques : création d’un gestionnaire de notes avec stockage dans une base embarquée
• Cartographie et géolocalisation
  • Gestion de la carte Google Maps.
  • Options pour la prise en charge de la géolocalisation du mobile.
  • Travaux pratiques Affichage de la carte par rapport à la localisation du mobile et affichage de markers sur la carte.