Développement d’applications et de sites web pour mobiles
Objectifs
- Savoir définir l'architecture d'une application pour mobile
- Comprendre les spécificités d'HTML, JavaScript et CSS propres au développement mobile
- Être capable de stocker des informations dans une base de données sur le mobile
- Savoir faire interagir l'application avec les fonctions de base du téléphone
Programme
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 native : 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 aller/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 coeur 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é
- Insérer du CSS3 pour les transitions, les arrondis
- Gérer un seul CSS pour plusieurs appareils (téléphones, tablettes)
- Graphisme grâce aux Canvas
- Multi-Touch
- Géolocalisation et utilisation de l'API Google Maps
Présentation du framework mobile : iUI
- Présentation globale
- Avantages / inconvénients
- 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
- 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
- JavaScript : gérer les évènements des composants iUI
- JavaScript : appels AJAX
- JavaScript : DOM et fenêtres iUI
- Envoi de formulaires iUI en Ajax
Présentation du framework mobile : JQuery Mobile
- Présentation de JQuery
- 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.)
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
Déployer son application sur l'App Store et le Google Play avec PhoneGap
- Présentation de PhoneGap
- Multi-plates-formes ?
- Principes techniques
- Téléchargement
- Configuration avec XCode pour une application iPhone
- Configuration avec Eclipse pour une application Android
- Exécution sous émulateur
- Utiliser toute la hauteur de l'écran
- 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
Please login to get access to the quiz
Back to Développement web – Frontend