Descriptif
AJAX et API Fetch : applications Web asynchrones est une formation de 1 jour (7 heures), de niveau intermédiaire, rattachée au domaine « Développement logiciel, informatique et Web ». Développer des interactions asynchrones dans le navigateur. Conçue et animée par des praticiens en activité, elle alterne apports ciblés (30 %) et mises en pratique (70 %) sur des laboratoires cloud individuels, avec des cas inspirés des secteurs banque, assurance et services publics. Disponible en inter-entreprises, en intra sur catalogue et en version sur mesure adaptée au contexte de l'entreprise.
Objectifs pédagogiques
À l'issue de la formation, le participant sera capable de :
- Principes
- Fetch
- JSON
- Gestion d'erreurs
- Sécurité
Programme détaillé
| N° | Contenus et activités | Durée |
|---|---|---|
| Jour 1 | ||
| 1 | Ouverture : attentes, rappel du modèle requête-réponse et ouverture de l'atelier en ligne — éditeur web et API d'exemple préchargés dans le navigateur | 0,5 h |
| 2 | De XMLHttpRequest à l'API Fetch : promesses, async et await, cycle de vie d'une requête, objet Response, en-têtes, méthodes HTTP, annulation avec AbortController | 1,5 h |
| 3 | Travaux pratiques : construire une recherche instantanée — appels Fetch, sérialisation et désérialisation JSON, rendu dans le DOM, annulation des requêtes devenues obsolètes | 2 h |
| 4 | Travaux pratiques : traiter les erreurs pour de vrai — distinguer les codes 4xx et 5xx d'une panne réseau, gérer le délai d'expiration, la relance, l'état de chargement et le message utilisateur | 1,5 h |
| 5 | Atelier sécurité et synthèse : CORS et requête préalable, cookies SameSite, envoi et stockage des jetons, protection anti-CSRF, injection dans le DOM et échappement des réponses — diagnostiquer les échanges et les en-têtes dans l'onglet réseau des outils de développement du navigateur, puis établir la check-list de mise en production | 1,5 h |
Méthodes pédagogiques
- Pédagogie active : 71 % du temps en pratique encadrée — laboratoires cloud provisionnés par participant, travaux pratiques guidés, fil rouge applicatif —, le reste en apports structurés, démonstrations commentées, cadrage et évaluation
- répartition calculée sur le déroulé détaillé de cette formation, et non annoncée de façon uniforme
- classe inversée avec prérequis sur le LMS
- apprentissage adaptatif selon le positionnement initial
- travaux en binômes
- classe virtuelle en séquences de 3 h 30 maximum sur Microsoft Teams
- support clair, complet et paginé remis à chaque participant
Technologies et outils mobilisés
JavaScript ES2023, API Fetch, JSON, AbortController, CORS, outils de développement du navigateur
Modalités d'évaluation et de validation
- Positionnement initial en ligne
- quiz de validation à chaque séquence
- évaluation finale des acquis (QCM et mise en situation)
- satisfaction à chaud
- questionnaire de transfert à 30 jours
- attestation de fin de formation
Plateforme, laboratoires et ressources
- LMS DATAROCKSTARS : parcours, supports numériques, quiz, évaluations, émargement par demi-journée
- laboratoires cloud individuels accessibles depuis un navigateur, sans installation, données fictives, détruits en fin de session
- bibliothèque O'Reilly (plus de 60 000 ressources)
- accès aux supports pendant 6 mois