par Ben Rebah, Hassen
Eyrolles
-
-
Disponible - 681.226 BEN
Niveau 3 - Informatique
Résumé
Manuel pour apprendre à coder un site en tirant parti des dernières API proposées par le langage HTML 5 : canvas pour les dessins 2D, SVG pour les animations, les API géolocalisation, glisser/déposer, web storage, de cache ou les web workers. Des travaux pratiques permettent de s'entraîner. ©Electre 2018
- Autre(s) auteur(s)
- Contributeur(s)
- Éditeur(s)
-
Date
- DL 2018
-
Notes
- ma couv. porte en plus : "Canvas, SVG, géolocalisation, web storage, web workers..."
- API = Application programming interface
-
Langues
- Français
-
Description matérielle
- 1 vol. (XIV-294 p.) : ill.; ; 23 cm
- Collections
- Sujet(s)
-
ISBN
- 978-2-212-67554-2
-
Indice
- 681.226 HTML, CSS, XML, XSLT
-
Quatrième de couverture
-
La nouvelle référence sur HTML 5
Malgré l'importance qu'occupent les nouvelles API JavaScript de HTML 5 au sein des applications web actuelles, il n'existe que peu d'ouvrages qui détaillent et présentent ces nouvelles spécifications. L'objectif de ce livre est justement de devenir une référence sur ces fonctionnalités avancées en répondant à ce manque via la présentation de chacune des API les plus utiles de manière claire, explicite et conforme aux normes du W3C.
Cet ouvrage aborde les principaux sujets suivants : l'API canvas permet de dessiner des graphiques 2D, de manipuler des images et de créer des animations, l'API SVG sert à définir des graphismes vectoriels bidimensionnels, l'API Géolocalisation détermine la position d'un objet sur un plan ou une carte à l'aide de ses coordonnées géographiques, l'API Glisser-Déposer permet de déplacer des éléments graphiques d'une zone vers une autre à l'aide de la souris, l'API Web Storage offre aux applications web la possibilité de stocker des données localement dans une base de données côté client (au niveau du navigateur), l'API Application Cache, de moins en moins utilisée, consiste à rendre les applications web disponibles en cas de coupure de la connexion Internet et enfin l'API Web Workers pour exécuter du code JavaScript en parallèle.
Des TPs pour pratiquer
Des travaux pratiques présentent une synthèse des concepts traités dans l'ouvrage sous forme d'exercices corrigés. L'objectif de ces travaux pratiques est d'illustrer concrètement l'utilisation conjointe des différentes API HTML 5.
À qui cet ouvrage s'adresse-t-il ?
¤ Aux développeurs web, intégrateurs qui souhaitent mettre en oeuvre les nouvelles API d'HTML 5 et moderniser leurs bonnes pratiques
¤ Aux designers web qui souhaitent découvrir toutes les possibilités que leur offre HTML 5
-
-
Tables des matières
-
API HTML 5
Maîtrisez le Web moderne !
Hassen Ben Rebah
Benoît Mariat
Eyrolles
- Avant-propos1
- Objectifs est structure de l'ouvrage1
- À qui s'adresse cet ouvrage ?2
- Chapitre 1
Canvas3 - Déclaration d'un canvas4
- API de dessin 2D du canvas5
- Grille de coordonnées7
- Formes géométriques simples7
- Tracés et chemins10
- Tracer des lignes droites10
- Style de contour et de remplissage des lignes14
- Tracer des courbes16
- La méthode arc() 17
- La méthode quadraticCurveTo() 19
- La méthode bezierCurveTo() 21
- Tracer des chemins22
- La méthode arcTo() 24
- Tracer des rectangles avec la méthode rect()26
- Styles et modes de remplissage27
- Remplissage par une couleur unie 27
- Remplissage par un dégradé de couleur 29
- Remplissage avec un motif 31
- Manipuler des images33
- Dessiner des images 33
- Créer une image par pixel 37
- Lire et copier des pixels d'une image 38
- Appliquer des filtres et modifier des pixels d'une image 40
- Manipuler du texte42
- Quelques effets45
- Gérer la transparence 45
- Prise en charge de l'API canvas56
- Chapitre 2
Scalable Vector Graphics57 - Dessiner avec SVG 58
- Structure d'un document SVG60
- Éléments de groupement <g> 60
- Élément <symbol> 61
- Élément <defs> 62
- Élément <use> 62
- Élément <desc> 64
- Système de coordonnées64
- Viewport 64
- Attributs viewBox et preserveAspectRatio 65
- Formes simples 70
- Chemins72
- Remplissage et mise en forme 76
- Intégrer les propriétés de style77
- Sous forme d'attributs à l'intérieur d'une balise 77
- Sous forme d'une feuille de styles externe 78
- Sous forme d'une feuille de styles externe 79
- Sous forme de style intégré dans la balise de forme 80
- Motifs et dégradés de couleurs80
- Motifs 80
- Dégradés de couleurs 82
- Texte 85
- Mettre en forme du texte87
- Manipuler du texte87
- Texte multiligne 87
- Glissement de texte 88
- Rotation de texte 89
- Texte le long d'une ligne courbe 90
- Animation SVG 91
- Élément <animate>92
- Élément <animateColor>95
- Élément <set>97
- Élément <animateTransform>98
- Élément <animateMotion>101
- Prise en charge de l'API SVG103
- Chapitre 3
Géolocalisation105 - Principe 107
- Méthodes 107
- Récupérer les coordonnées d'une position 109
- Gérer les erreurs 111
- Options supplémentaires 113
- Géolocalisation sur une carte 114
- Prise en charge de l'API de géolocalisation 120
- Chapitre 4
Glisser-Déposer121 - Principe 121
- Événements 122
- Attribut draggable 122
- Objet Data Transfer 123
- Propriétés123
- effectAllowed 123
- dropEffect 124
- Méthodes125
- setData() 125
- getData() 125
- setDragImage() 126
- Exemple complet 126
- Glisser-Déposer des fichiers 128
- Déposer des fichiers du système d'exploitation vers le navigateur128
- Déposer des fichiers du navigateur vers le système d'exploitation129
- Objet FileReader131
- Méthodes 131
- Événements 131
- Propriétés 132
- Prise en charge de l'API Glisser-Déposer et de l'objet FileReader 134
- Chapitre 5
Stockage local135 - Objets Web Storage 136
- Interface Web Storage 136
- Manipuler des données vie l'interface Storage 137
- Exemple complet 140
- Prise en charge de l'API Web Storage 141
- Chapitre 6
Application web hors ligne143 - Structure du fichier Manifest 144
- Cache 145
- Network 145
- Fallback 146
- Assigner le Manifest au site web 147
- Gérer un cache 149
- API Application Cache 151
- Propriétés151
- Événements152
- Méthodes153
- Mettre à jour le cache 154
- Exemple complet d'utilisation du cache 154
- Prise en charge de l'API Application Cache 158
- Chapitre 7
Web Workers159 - Comprendre la programmation parallèle 160
- Programmation séquentielle160
- Programmation impérative 160
- Programmation événementielle 161
- Programmation parallèle162
- Communication par mémoire partagée 163
- Communication par passage de message 163
- Types de Web Workers 163
- Workers dédiés163
- Créer un Web Worker 164
- Gérer la communication d'un Worker : envoyer et recevoir des messages166
- Gérer un Worker169
- Restriction 169
- Espace global dans le Worker 169
- Terminaison d'un Worker 169
- Workers partagés171
- Créer un Web Worker partagé 171
- Gérer la communication des Workers partagés 173
- Service Workers176
- Cycle de vie 176
- Objet Promise 177
- Interfaces 179
- Compatibilité des objets 184
- Créer un Service Worker 185
- Manipulation des Web Workers 194
- Gestion des erreurs194
- Contexte d'exécution du Web Worker196
- Objet location 196
- Objet navigator 196
- Importation des scripts197
- Enchaînement des Web Workers198
- Prise en charge de l'API Web Worker200
- Chapitre 8
Travaux pratiques201 - TP 1 : logiciel de dessin 202
- Exercice 1 : Canvas202
- Énoncé 202
- Solution 203
- Exercice 2 : localStorage209
- Énoncé 209
- Solution 209
- Exercice 3 : shared Worker212
- Énoncé 212
- Solution 213
- TP 2 : jeu du Gomoku 223
- Exercice 1 : SVG224
- Énoncé 224
- Solution 224
- Exercice 2 : Web Worker231
- Énoncé 231
- Solution 231
- Exercice 3 : localStorage242
- Énoncé 242
- Solution 243
- Exercice 4 : Glisser-Déposer d'un fichier255
- Énoncé 255
- Solution 255
- TP3 : gestion d'infrastructure259
- Exercice 1 : Glisser-Déposer un élément259
- Énoncé 259
- Solution 260
- Exercice 2 : localStorage269
- Énoncé 269
- Solution 269
- Exercice 3 : géolocalisation277
- Énoncé 277
- Solution 278
- Index291
-
-
Origine de la notice:
- Electre
-
Disponible - 681.226 BEN
Niveau 3 - Informatique
