Formation Développement de sites Web orientés Mobiles

Contenu

Introduction au Web Mobiles

• L'arrivée des smartphones, aubaine ou calvaire pour le développeur web ?
• Application Web : avantages, inconvénients et limites
• Application Natives : avantages, inconvénients et limites
• Cycles de développement
• Architectures : Accélérer l'affichage de nos applications avec Amazon, App Engine ou une solution à base de Proxy
• Web Mobiles : Site internet ou applications web mobiles ?
• Tour d'horizon des frameworks pour mobiles : JQTouch, JQuery Mobile, Sencha Touch, iUI, ...

Rappels XHTML, CSS et JavaScript

• Liens avec ancres
• Les images : optimisation des allers/retour serveur et empilage avec z-index
• Gérer les blocs
• Sélecteurs CSS avancés (nth-child, ...)
• JavaScript : Rappels Syntaxiques
• JavaScript : Manipuler DOM, les évènements, ...

HTML5 : Les nouveautés au cœur du développement web pour mobiles

• Nouvelles gestions de blocs
• Bases de données côté client
• Transactions sur bases de données
• Stockage hors-ligne
• AJAX amélioré
• Graphisme grâce aux Canvas
• Multi-Touch
• Géolocalisation et utilisation de l'API Google Maps

Présentation du framework mobile : iUI

• Création de fenêtres, liens entre fenêtres
• Afficher des menus sous forme de listes
• Forcer le clavier virtuel
• Créer des fenêtres de dialogue, des alertes
• Thèmes iPhone grâce aux Panels
• La gestion des thèmes avec theme-switcher
• Les extensions iUI : nouveaux thèmes (Android, WebOS), listes de sélection, calendrier, ...
• Créer des formulaires iPhone-like
• JavaScript : navigation rapide entre pages, gérer les évènements des composants iUI, appels AJAX, DOM et fenêtres iUI
• Envoi de formulaires iUI en Ajax

Présentation du framework mobile : Sencha Touch

• Présentation, Setup d'une application
• Fonctionnement de l'affichage (panel, menu, boutons, liste)
• Chargement de données en AJAX à partir du serveur
• Formulaire, les différents champs
• Gestion des événements
• Google Maps dans Sencha Touch
• Mettre en place une architecture MVC sur ses applications Sencha Touch

Présentation du framework mobile : JQuery Mobile

• JQTouch ou JQuery mobile ?
• Fenêtres, barres d'outils, formulaires
• Listes avec ou sans séparateur
• Evènements, AJAX
• Design,  gestion des thèmes
• Gérer les tablettes (iPad, Android, etc.)

Déployer son application sur l'App Store, l'Android Market avec PhoneGap

• Présentation de PhoneGap
• Principes techniques, téléchargement
• Configuration avec XCode pour une application iPhone
• Configuration avec Eclipse pour une application Android
• Exécution sous émulateur
• Changer le nom et le logo de l'application
• Accéder en JavaScript aux fonctionnalités natives : Bip, Alertes, Vibreur, etc.
• Géolocalisation
• Accéléromètre
• Comparaison d'applications sous iPhone/Android/Blackberry
• Inscription, certificats et déploiement sous iTunes
• Inscription, certificats et déploiement sous Android Market

Méthodes pédagogiques

8 participants maximum, un poste par stagiaire et un support de cours est remis en fin de stage. La formation est constituée d'apports théoriques, de démonstrations et de mises en pratique basées sur des exercices.

Formateur

Formateur expérimenté spécialiste de la programmation Web.

Modalités de validation des acquis

Fiche d'évaluation en ligne permettant de valider les acquis.