Formation Les API de HTML 5 et CSS 3 - Pour les développeurs – Centre de formation M2i
M2i Formation

Découvrez notre formationLes API de HTML 5 et CSS 3 - Pour les développeurs

Présentiel

3 jours (21 heures) - HT5-CSS3

(33)
Accueil  ›  Formations Informatique  ›  Langages et développement  ›  Développeur Web HTML 5, CSS 3 et JavaScript  ›  Les API de HTML 5 et CSS 3 - Pour les développeurs

Objectifs pédagogiques

  • Connaître les API HTML 5 et leur utilité
  • Valider des formulaires avec WebForms 2
  • Dessiner avec Canvas et SVG
  • Gérer la déconnexion
  • Communiquer avec les WebSockets
  • Gérer les tâches longues avec les WebWorkers
  • Réaliser des animations avec CSS 3
  • Comprendre le Responsive Design et les liens entre HTML 5 et la mobilité.

Niveau requis

Avoir suivi le cours JVS-IN "JavaScript" ou pratiquer le langage JavaScript.

Public concerné

Développeurs, architectes, chefs de projets techniques.


Cette formation est éligible au CPF : code unique 237067

Formation éligible aux financements suivants :
ACAfdas, Opcalia Département télécoms

Paris La Défense02/12/20191 800 € HTDates proposées dans les agences M2iRéserver
Paris La Défense24/02/20201 800 € HTDates proposées dans les agences M2iRéserver
Paris La Défense25/05/20201 800 € HTDates proposées dans les agences M2iRéserver
Paris La Défense20/07/20201 800 € HTDates proposées dans les agences M2iRéserver

Afficher plus de dates

Sessions
planifiées
Sessions
ouvertes
Sessions
confirmées
Réserver
le stage

Certification : M2i Langages de Programmation (+ 120€)

Jour 1

Le Web version HTML 5

  • Définition et limites de HTML 5
  • Support des navigateurs
  • Modernizr et librairies pour la compatibilité
  • Impact sur les architectures Web
  • HTML 5 pour les mobiles

Structure des pages HTML 5

  • Simplifications
  • Doctype
  • Balises sémantiques
  • Micro formats

Exemples de travaux pratiques (à titre indicatif)

  • Ecriture d'une première application, rappeler les essentiels de HTML 5
  • Faciliter les développements à venir
  • Gérer les balises sémantiques et leur importance

WebForms 2

  • Nouveaux champs de saisie
  • Sliders, datalist et placeholder
  • Expressions régulières
  • Validation automatique
  • Validation dans le code

Exemples de travaux pratiques (à titre indicatif)

  • Traitement des zones de saisie en JavaScript
  • Maîtrise des formats et validation JavaScript
  • Exercices sur les expressions régulières

Jour 2

Multimédia et graphisme

  • Audio et vidéo
  • Canvas
  • SVG
  • WebGL

Exemples de travaux pratiques (à titre indicatif)

  • Création d'une application utilisant le Canvas pour animer la page
  • Manipulation programmatique du format SVG pour animer la page
  • Ajout de vidéo et d'audio au projet

Communications

  • XHR2
  • CORS
  • JSON
  • Messaging
  • WebSocket

Exemples de travaux pratiques (à titre indicatif)

  • Création d'un programme exploitant les façons actuelles d'échanger avec un serveur
  • Projet avec XmlHTTPRequest
  • Projet avec WebSocket et gestion des messages non sollicités
  • Traitement JSON au sein du programme

Webworkers

  • Modèle mono-thread
  • Worker API
  • Synchronisation
  • Shared Workers

Exemple de travaux pratiques (à titre indicatif)

  • Création d'un programme utilisant les Web Workers afin de paralléliser des traitements de calculs scientifiques

Fichiers et ressources locales

  • LocalStorage
  • SessionStorage
  • IndexedDB
  • File API

Exemple de travaux pratiques (à titre indicatif)

  • Exploitation, dans un projet, des fichiers exploités localement avec l'API LocalStorage et la base de données IndexedDB

Jour 3

Device API

  • Géolocalisation
  • Orientation
  • Batterie
  • Caméra et micro
  • WebRTC

Exemples de travaux pratiques (à titre indicatif)

  • Reprise des projets précédents et ajout de la géolocalisation
  • Affichage de cartes, gestion de la batterie et de l'orientation

CSS 3

  • Fonts
  • Sélecteurs CSS 3
  • Bordures
  • Couleurs et opacité
  • Transitions et transformations
  • Animations

Exemples de travaux pratiques (à titre indicatif)

  • Depuis un projet existant, animation de feuilles via la manipulation programmatique des sélecteurs CSS 3
  • Animation via les transformations et transition depuis JavaScript

Responsive Design

  • Vision OneWeb
  • Responsive Web Design
  • Progressive Enhancement
  • Media Query

Exemple de travaux pratiques (à titre indicatif)

  • Adaptation de l'application à la taille de l'écran grâce aux Medias Queries

Certification (en option)

  • Nos tests de validation des compétences font partie intégrante du processus d'apprentissage car ils permettent de développer différents niveaux d'abstractions.
  • Solliciter l'apprenant à l'aide de nos QCM, c'est lui permettre d'étayer sa réflexion en mobilisant sa mémoire pour choisir la bonne réponse. Nous sommes bien dans une technique d'ancrage mémoriel.
  • L'examen sera passé à la fin de la formation.

Les + de la formation

L'examen de certification (proposé en option) est en français.

Testez vos connaissances

Objectif : Ce test a pour objectif de tester vos connaissances sur le langage JavaScript et sa bibliothèque jQuery.

Complétez votre formation