Formation - Développement JavaScript "Moderne"

Référence : 38WIbwIMk2eb

Durée : 35 h sur 5 j

L'objectif de cette formation est d'apprendre à développer des pages Web modernes tirant profis de toutes les nouveautés en termes d'HTML5, de CSS3 mais surtout de JavaScript avec sa spécification ES6 (EcmaScript 6)

Détails de la formation

Méthodes et outils pédagogiques

Nombre de stagiaires limité pour plus de proximité et de meilleurs échanges
Un poste de travail par stagiaire équipé selon les besoins de la formation
Alternance apports théoriques, exercices et échanges

Objectifs de la formation

Au terme de la formation, vous saurez :

Comprendre les différences entre les différentes versions de JavaScript.
Maîtriser la Programmation Orientée Objet en JavaScript Moderne (ES6).
Comprendre et utiliser les apports de jQuery.
Utiliser JSON pour synchroniser un navigateur avec son serveur HTTP.
Manipuler les principales API JavaScript.

Méthodes d'évaluation

Evaluation formative par le biais de mises en situation nécessitant la participation active du stagiaire et délivrance d’une attestation de fin de formation remise à chaque stagiaire

Les plus

Grande expérience terrain du formateur qui permet d'échanger sur son retour d'expérience et d'illustrer les propos d'exemples réels

Pré-requis

Cette formation s'adresse aux développeurs objets souhaitant évoluer vers le développement d'application web. Pour suivre ce stage, il est nécessaire d'avoir quelques connaissances de bases en HTML et CSS.

Modalités d'enseignement

En présentiel
En distanciel

Public cible

Tous publics

Programme

Rappels sur les technologies Web

- Le W3C : World Wild Web Consortium
- Rappels sur le langage HTML
- Rappels sur le langage CSS

Introduction à JavaScript

- Historique des versions JavaScript
- La compatibilité des navigateurs
- ES6 : une nouvelle manière de coder en JavaScript.

Les fondamentaux

- La déclaration des variables
- Différences entre var, let et const
- Les opérateurs et les instructions du langage
- La déclaration de fonctions

POO (Programmation Orientée Objet) ES6

- Définition d'une classe
- Définition de constructeurs
- Définition de méthodes
- Définition de propriétés

Introduction à DOM (Document Object Model)

- Présentation du modèle DOM
- Ajout, modification et suppression de noeuds dans le DOM
- La manipulation des données de styles
- Mise en oeuvre d'effets visuels

La gestion moderne des événements

- Ancienne approche VS approche moderne.
- L'objet d'événement
- La propagation des événements

Utilisation de jQuery

- jQuery VS Javascript
- Write less, do more
- Manipulation du DOM via jQuery
- Gestion des événements via jQuery
- Utilisation d'effets spéciaux jQuery
- Le module jQuery UI

Communiquer avec une source de données distante

- Introduction à JSON
- Introduction à AJAX (Asynchronous JavaScript And Xml)
- Sérialiser, désérialiser, envoyer et recevoir des données avec XMLHTTPRequest
- Simplifier le code Ajax avec jQuery
- Appels de services web RESTful/JSON

Implémenter des communications en temps réel à l'aide des web sockets

- Fonctionnement des web sockets
- Utiliser l'API socket web avec JavaScript pour se connecter, envoyer, recevoir et gérer les événements

L'API Web Worker

- Exécuter un traitement asynchrone et garantir l'isolement pour les opérations sensibles
- Utiliser les API "Web Worker" à partir de code
- JavaScript pour créer, exécuter et suivre le processus "Web worker"

Les autres API JavaScript

- L'API des Canvas
- L'API de Drag'n Drop
- L'API multimédia (audio, vidéo)
- L'API de localisation
- L'API des Storages
- L'API Indexed DB
- L'API WebGL

Mode Hors Ligne

- Le fichier de manifest
- Détecter le mode Hors Ligne
- Mise en cache avancée avec AppCache
- Stocker en local avec WebStorage