JAVASCRIPT Développer des applications Web Mixte : présentiel / à distance

• Intégrateurs Web

• Connaître les notions fondamentales de la programmation (Algorithmie)
• Connaître les notions fondamentales de la création de pages Web HTML

A l'issue de cette formation, l'apprenant sera capable de :

• Intégrer un script à une page HTML
• Utiliser les types primitifs du langage Javascript et leurs fonctions
• Utiliser le DOM pour parcourir et modifier la structure d'une page
• Gérer des événements utilisateur
• Valider les données saisies dans un formulaire
• Stocker des données dans le navigateur
• Échanger des données avec un serveur via des API REST
• Exploiter l'API FileReader pour lire des fichiers en local
• Interagir avec des contenus multimédias
• Mettre en œuvre l'API de géolocalisation

Introduction

• HTML, CSS et JavaScript : Les 3 langages du navigateur
• Rôle du JavaScript dans un site Web
• Caractéristiques de JavaScript et relations avec le standard ECMAScript
• Support de JavaScript dans les différents navigateurs
• Imbrication de JavaScript dans HTML
• Conventions de formatage et de codage
• Console, débogage et outils des navigateurs
• Environnement de développement et de débogage

 

La syntaxe JavaScript

• Déclaration des variables
• Les types de données
• Les tableaux
• Les opérateurs et expressions
• Les structures de contrôle
• Les fonctions : déclaration et appel
• Les objets globaux : String, Date, RegExp, Array

 

L'approche objet en JavaScript

• Fonctions anonymes et encapsulation
• Objets
• Propriété prototype
• Fonctions flèche
• Destructuration
• Casses et héritage
• Constructeurs et accesseurs

 

Les objets du navigateur

• Les principaux objets du DOM
• window, document, history, location, navigator
• Déboguer et générer des logs avec l'API Console
• Contrôler la version et tester la compatibilité du navigateur

 

Interagir avec le DOM

• Notion de nœud et d'arborescence de nœuds
• Parcourir et rechercher des éléments avec l'API Selector (querySelector() et querySelectorAll())
• Modifier la présentation et le contenu du DOM
• Modifier la structure du document
• Modifier un élément HTML

 

Gestion avancée des événements

• Intercepter les événements avec la fonction addEventListener()
• Comprendre la propagation des événements
• Objet Event
• Création d'événements personnalisés

 

Validation des formulaires côté client

• Ecrire et lire dans les champs des formulaires
• Mettre en place des champs obligatoire
• Valider les informations saisies
• Mise en œuvre des expressions régulières
• Activer et désactiver le bouton d'envoi

 

Persistance des données en local

• Comprendre la différence entre les objets storage et les cookies
• L'API Storage
• Utilisation du contexte local storage en lecture/écriture
• Utilisation du contexte session storage en lecture/écriture
• Sauvegarder et restaurer l'état d'une page ou d'une application Web au chargement
• Mise en œuvre des bases de données SQLite ou IndexedDB

 

Communication réseau (AJAX, JSON et services REST)

• Définition et conception d'un service REST
• L'objet XMLHttpRequest2
• Configurer une requête AJAX
• Format d'échange JSON
• L'événement progress
• Gestion du cache en mode déconnecté
• Détection des événements online et offline

 

Nouvelles interactions utilisateur

• Mettre en œuvre les actions de glisser-déposer
• Ajouter des informations sur demande avec les éléments Details et Summary
• Activer les contenus modifiables
• Autoriser l'affichage plein écran

 

Gestion de fichier

• Découvrir l'API File
• Lecture/écriture de document sur le poste client
• Gestion d'événements avancés tels que les notifications et le glisser-déposer " système "

 

Interagir avec les contenus multimédia

• Contrôler la lecture des éléments audio et vidéo
• Créer des animations avec l'élément Canvas et l'API Draw2D

 

Mettre en œuvre la géolocalisation

• API Geolocation
• Obtenir les informations de positionnement
• Utiliser les API Google Maps
• Traduire une position en adresse physique
• Afficher une carte, etc.

 

Travaux pratiques

• Manipulation des données de type simple
• Transformation, mise en forme de texte
• Manipulation des dates
• Utilisation d'expression régulière
• Création d'un DataGrid HTML5
• Mise en place de la sélection des lignes
• Création, suppression de lignes
• Ajout de nouvelles lignes de données
• Création et validation d'un formulaire HTML5
• Validation native et JavaScript
• Validation en cours de saisie
• Contrôler l'envoi des données
• Gestion des données
• Stockage des données en local
• Chargement des données du tableau depuis le serveur Web
• Création de classes métiers en JavaScript
• Création d'objets métiers à l'aide d'un formulaire
• Affichage des données dans un tableau HTML
• Mise en place d'un Drag&Drop de fichier JSON
• Mise en œuvre des API JavaScript
• Géolocalisation
• Interaction avec un média
• Affichage de notification

 

Concepteur : ENI SERVICES - Diffuseur : Groupe Arkesys

• Intégrer un script à une page HTML
• Utiliser les types primitifs du langage Javascript et leurs fonctions
• Utiliser le DOM pour parcourir et modifier la structure d'une page
• Gérer des événements utilisateur
• Valider les données saisies dans un formulaire
• Stocker des données dans le navigateur
• Échanger des données avec un serveur via des API REST
• Exploiter l'API FileReader pour lire des fichiers en local
• Interagir avec des contenus multimédias
• Mettre en uvre l'API de géolocalisation

• Explications théoriques suivies de pratiques guidées puis de mises en autonomie.
• Exercices autonomes et réguliers pour assurer l'assimilation

Votre formation a lieu en présentiel :

• 1 vidéoprojecteur par salle
• 1 ordinateur

 

Votre formation se déroule à distance avec :

• 1 ordinateur
• 1 connexion Internet
• 1 adresse e-mail valide
• 1 équipement audio (micro et enceintes ou casque)
• 1 Webcam (facultatif – dans l'idéal)
• 1 deuxième écran (facultatif – dans l'idéal)

 

Votre formation se déroule sur notre plate-forme de formation avec :

• 1 ordinateur
• 1 connexion Internet
• 1 adresse e-mail valide
• 1 équipement audio (micro et enceintes ou casque - facultatif)

 

Support stagiaire :

À l'issue de la formation, les exercices et travaux pratiques réalisés, leurs corrigés ainsi qu'un support de cours dématérialisé sera fourni à chaque stagiaire par e-mail ou via la plate-forme FOAD.

L'acquisition des compétences de la formation se fait à travers le suivi du formateur tout au long de la formation (séquences synchrones et asynchrones). Elle s'appuie également sur la réalisation d'exercices et de TP. Enfin, des quiz s'ajoutent aux différents outils de validation de l'acquisition des compétences visées. Une évaluation est systématiquement réalisée par chaque stagiaire, à l'issue de la formation.

Nos formateurs sont certifiés à l'issue d'un parcours organisé par nos soins. Ils bénéficient d'un suivi de maintien et d'évolution de leurs compétences aussi bien au niveau technique que pédagogique.

Chacun de nos formateurs a bénéficié d'une formation spécifique à l'animation de classe virtuelle et à l'utilisation des solutions de formation à distance du Groupe ARKESYS.

Cette formation est accessible à toute personne en situation de handicap. Notre référent handicap prendra contact avec les stagiaires concernés pour adapter l'animation à leurs besoins et rendre l'apprentissage accessible à tous. Enfin, nos centres de formation sont accessibles aux personnes à mobilité réduite.