← Retour aux formations

Développement Web & No-Code

HTML5 : maîtriser les API JavaScript

Intermédiaire
Développement Web & No-Code

À propos de cette formation

Cette formation propose une approche concrète des API JavaScript introduites par les spécifications HTML5. Les participants apprennent à gérer la persistance des données côté client, à concevoir des applications fonctionnant sans connexion, à exploiter différents modes de communication avec le serveur dont les Web Sockets, à implémenter le glisser-déposer et à utiliser l'API de géolocalisation.

Objectifs de la formation

  • check_circleAssurer la persistance des données côté client avec les API de stockage HTML5
  • check_circleConcevoir des applications capables de s'exécuter sans connexion réseau
  • check_circleMettre en œuvre la communication bidirectionnelle client/serveur via les Web Sockets
  • check_circleImplémenter des interactions de type glisser-déposer dans une interface web
  • check_circleExploiter l'API Geolocation pour déterminer et utiliser la position de l'utilisateur

Programme détaillé

Module 1 — Introduction

  • Tour d'horizon des apports d'HTML5 : éléments sémantiques, nouvelles balises et améliorations des formulaires
  • Sélecteurs CSS avancés : ciblage d'éléments par classe et par sélecteur
  • Travaux pratiques : recherche d'éléments par positionnement et par classe

Module 2 — Gestion de la persistance

  • Panorama des stratégies de stockage côté client
  • Stockage local (localStorage), en session et en base de données embarquée
  • Création de bases de données et exécution de requêtes
  • Outils d'administration SQLite et opérations SQL disponibles
  • Travaux pratiques : création d'une table produit et interrogation par requêtes

Module 3 — Gestion du cache

  • Conception d'applications fonctionnant sans connexion réseau
  • Création et configuration du fichier Manifest
  • Activation et gestion du mode déconnecté
  • Événements du gestionnaire de cache : déclencheurs offline et online
  • Travaux pratiques : mise en œuvre d'un mode hors ligne sur une application

Module 4 — Communication Client/Serveur

  • Communication cross-domain et échange de messages entre documents
  • API PostMessage pour la transmission de données inter-documents
  • Modes de communication serveur : polling, long-polling et streaming
  • Réception d'événements serveur avec l'API EventSource
  • XMLHttpRequest Level 2 : suivi de progression et communication multidocuments
  • Protocole et API Web Sockets pour la communication temps réel
  • Travaux pratiques : implémentation et comparaison des protocoles client/serveur

Module 5 — Gestion du glisser/copier

  • Fonctionnement du glisser-déposer (Drag'n'Drop) en HTML5
  • API native de gestion du Drag'n'Drop et attribut draggable
  • Propriétés de comportement et événements associés
  • Périmètre d'utilisation : possibilités et contraintes
  • Transfert de fichiers et d'images par glisser-déposer
  • Travaux pratiques : implémentation d'un panier géré par glisser-déposer

Module 6 — Géolocalisation

  • Présentation de la géolocalisation dans les navigateurs modernes
  • Sources de données de localisation et niveaux de précision
  • Utilisation de l'API Geolocation pour récupérer et traiter la position
  • Gestion des données personnelles et respect de la vie privée

Prérequis

Posséder une bonne maîtrise de HTML et de JavaScript.