Bien développer pour le Web 2.0
Publié le 06 October 2008
Bonnes pratiques Ajax - Prototype, Script.aculo.us, accessibilité, JavaScript, DOM, XHTML/CSS
Christophe Porteneuve
Eyrolles
Collection : Blanche
2e édition
674 pages
45,00 EUR
Extraits du livre
Adieu, soupes de balises et combinaisons de JavaScript propriétaires qui polluaient le Web 1.0... Place à des applications accessibles et ergonomiques, des scripts portables et du balisage sémantique : créer des interfaces bluffantes et interactives à la Web 2.0 (Gmail, Google Maps, Flickr, Netvibes...) est l'occasion d'instaurer de bonnes pratiques de développement - pour travailler mieux, plus vite, et dans le respect des normes.
Christophe Porteneuve livre dans cet ouvrage plus de dix années d'expérience en développement et en qualité web. Il rappelle les fondamentaux techniques du Web 2.0 (XHTML, CSS, JavaScript, DOM...), décrit l'usage des frameworks de développement dédiés Prototype et script.aculo.us dans leur version la plus récente, et explore le cœur d'Ajax, XMLHttpRequest, ainsi que la question des contenus et services externes (services web, API REST et flux de syndication RSS et Atom). Outre une réflexion sur l'accessibilité et l'ergonomie, il explique comment conjuguer toutes ces technologies dans le cadre d'une méthodologie de développement cohérente et qualitative.
Cette deuxième édition augmentée, entièrement mise à jour pour tenir compte des récentes évolutions des standards, illustre la technologie de la réutilisation d'API JavaScript tierces ("mashups") et explore en détail le débogage JavaScript côté client de vos applications web.
À qui s'adresse cet ouvrage ?
- Aux développeurs web qui doivent actualiser leurs connaissances et découvrir les technologies du Web 2.0 ;
- À ceux qui souhaitent explorer en profondeur les bibliothèques Prototype et script.aculo.us
- À tous ceux qui souhaitent acquérir une méthodologie cohérente de développement web, combinant technologies de pointe, qualité et accessibilité
Sommaire
- Web 2.0 et standards du Web
Mythes et rumeurs
Intérêts stratégiques
- Rappels JavaScript
Opérateurs méconnus
Exceptions
Héritage de prototypes
Binding
Idiomes intéressants
Fonctions et objets anonymes
Simuler des espaces de noms
Bonnes pratiques d'écriture
- Manipulations dynamiques avec le DOM
Niveaux DOM
Ordre des noeuds
Scripter au bon moment
Pas d'extension propriétaire
Gestion propre des événements
Accommoder MSIE
Capture et bouillonnement
Besoins fréquents : décoration automatique de labels, validation automatique de formulaires
- Prototype : simplicité, portabilité et élégance
Accès au DOM
Tableaux et tableaux associatifs
Itérateurs
String enrichi
Des tableaux surpuissants : conversions, extractions, transformations
Éléments étendus
Manipulations des styles et classes
Modification de contenu
Parcours de hiérarchies
Positionnement
Manipulation de formulaires
Événements
- Déboguer du JavaScript
Démarrer sur Firefox avec Firebug
MS Script Debugger
Visual Web Developer Express
Outils IE8
Outils Safari 3
Opera Dragonfly
- Ajax, ou l'art de chuchoter
XMLHttpRequest
Anatomie d'une conversation Ajax
Préparer un échange asynchrone
ActiveX versus objet natif JavaScript
Créer l'objet requêteur, décrire et envoyer la requête, recevoir et traiter la réponse
Types de réponse : XHTML, XML, JS, JSON... XPath
GoogleAJAXSLT
- Ajax avec Prototype
Ajax.Request
Ajax.Response
Ajax.Updater
Différencier la mise à jour entre succès et échec
Ajax.PeriodicalUpdater
Petits secrets supplémentaires
- Script.aculo.us pour l'ergonomie
Effets visuels
Invocation
Options communes
Fonctions de rappel
Files d'effets
Glisser-déplacer avec Draggable et Droppables
Tri de listes
Complétion automatique de texte
Avoir du recul sur Ajax
Ajax et l'accessibilité
- Services web et REST
Contraintes de sécurité
API REST
Exemple d'Amazon.fr
De XML à XHTML : la transformation XSLT
API météo
API Flickr
- Flux RSS et Atom
Récupérer et afficher des flux
Feuille XSLT
Traiter des quantités massives de HTML encodé
Mashups
100 % côté client
Google Maps
Google Chart
- Annexes
XHTML sémantique
CSS 2.1
- Le "plus" de l'expert : savoir lire une spécification
Les recommandations du W3C
Les RFC de l'IETF
- Développer avec son navigateur web
Problèmes de cache
WebDeveloper
IE Developer Toolbar
Outils IE8
Outils Safari 3
Outils Opera
- Les autres frameworks JavaScript
jQuery
Dojo
YUI
MooTools
