Développement Web Front End (JavaScript avancé, jQuery, TypeScript, Angular)

Référence : T-ITLO-016

Infos pratiques

  • Durée : 5 jours soit 35 heures
  • Population visée : Ouvrier – Employé – Employé qualifié – Cadre – Cadre supérieur
  • Public concerné : Toute personne souhaitant apprendre à faire du développement Web Front End en utilisant le langage JavaScript, la bibliothèque jQuery, ainsi que d'autres outils

Programme

Objectifs pédagogiques

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

  • Identifier les usages du JavaScript ;
  • Implémenter des algorithmes simples en JavaScript ;
  • Réagir aux actions de l'utilisateur ;
  • Modifier le DOM de manière appropriée ;
  • Connaître les mécanismes du développement objet en JavaScript ;
  • Créer des librairies en JavaScript ;
  • Utiliser les fonctions de base du framework jQuery ;
  • Implémenter des algorithmes simples en TypeScript ;
  • Mettre en oeuvre le framework d'Angular ;
  • Créer des composants, services et mettre en oeuvre la navigation dans une application Angular.

Pré-requis

Avoir suivi la formation "Développement d'applications Web Front End (HTML, CSS, Responsive Web Design, Bootstrap, JavaScript et jQuery)", ou posséder les connaissances et compétences équivalentes.

Objectifs opérationnels et contenu de la formation

Introduction au JavaScript

  • Le JavaScript jusqu'à aujourd'hui
  • Le mode d'exécution du JavaScript
  • L'écosystème de JavaScript
  • Introduction au langage JavaScript
  • Démonstration : Variables et fonctions
  • Les éléments essentiels à l'écriture d'un code en JavaScript
  • Démonstration : Structures de code et objets JavaScript
  • Travaux pratiques : Réaliser 3 exercices simples destinés à valider les connaissances sur les fondamentaux du JavaScript
  • Quiz - QCM de validation des acquis

Le contrôle du DOM par le JavaScript

  • Qu'est-ce que le DOM ?
  • L'API pour manipuler le DOM
  • Intégrer du JavaScript dans une page HTML
  • Démonstration : Manipulation du DOM
  • Les objets JavaScript disponibles dans une page Web
  • La gestion des événements
    Démonstration : Gestion des événements
  • Travaux pratiques : Réaliser une application capable de gérer des savoirs inutiles
  • Quiz - QCM de validation des acquis

Développer des librairies en JavaScript

  • Créer un objet
  • Démonstration : La création d'un objet
  • Créer des classes
  • Démonstration : La création d'une classe
  • L'héritage en JavaScript
  • Démonstration : Le mécanisme d'héritage
  • Travaux pratiques : Faire évoluer l'application de gestion des savoirs inutiles en utilisant des concepts avancés du langage JavaScript
  • Les conflits entre librairies
  • Démonstration : Les conflits entre librairies
  • Les contextes d'exécution
  • Démonstration : L'encapsulation des librairies
    La spécialisation des méthodes et les closures
  • Démonstration : Les closures
  • Le stockage local
  • Démonstration : Le stockage local
  • Travaux pratiques : Faire évoluer l'application de gestion des savoirs inutiles en utilisant des concepts avancés du langage JavaScript
  • Les traitements asynchrones
  • Démonstration : Les callbacks
  • Les promesses
  • Démonstration : Les promesses
  • Travaux pratiques : Créer une application Radar permettant de déterminer la vitesse d'écriture de l'utilisateur
  • Quiz - QCM de validation des acquis

Utiliser une librairie du marché : jQuery

  • Le curriculum vitae de jQuery
  • Intérêt et usage de jQuery
  • Installation
  • Débuter avec les sélecteurs
  • Démonstration : Les sélecteurs
  • Evénements du DOM
  • Démonstration : Les événements
  • Bien utiliser jQuery
  • Démonstration : Le chargement de la page
    Manipulation du DOM
  • Les méthodes utilitaires de l'objet racine
  • Démonstration : La modification du DOM
    AJAX
  • Démonstration : AJAX
  • Travaux pratiques : Faire évoluer l'application de gestion des savoirs inutiles en utilisant des concepts avancés du langage JavaScript et la librairie jQuery
  • Quiz - QCM de validation des acquis

Les bases du TypeScript

  • Le curriculum vitae de TypeScript
  • Pourquoi TypeScript ?
  • La transcompilation
  • Démonstration : La transcompilation et l'exécution
  • Les variables et les énumérés
  • Démonstration : Les variables et les énumérés
  • Les classes et l'héritage
  • Les interfaces
  • Démonstration : Les classes
  • Les génériques
  • Démonstration : Les génériques
  • Les modules
  • Démonstration : Les modules
  • Les expressions lambda
  • Démonstration : Les expressions lambda
  • Travaux pratiques : Ecrire des classes et interfaces permettant de mettre en place une application de vente aux enchères
  • Quiz - QCM de validation des acquis

Les bases d'Angular

  • Historique
  • Angular CLI
  • Créer, exécuter et organiser un projet
    Démonstration : Création et exécution d'un premier projet Angular
  • Architecture générale
  • La liaison de données
  • Démonstration : La liaison de données
  • Les composants
  • Démonstration : Création d'un composant
  • Les directives
  • Démonstration : Utilisation des directives
  • Les pipes
  • Démonstration : Utilisation des pipes
  • Travaux pratiques : Créer une application de messagerie simple à l'aide d'Angular
  • Les services
  • Démonstration : Mise en place de la couche de service
  • La programmation réactive avec RxJS
  • Démonstration : Programmation réactive
  • Les formulaires
  • Démonstration : Formulaires
  • Travaux pratiques : Rendre interactive l'application de messagerie simple à l'aide d'Angular
  • La navigation et le routage
  • Démonstration : Navigation et routage
  • L'utilisation de services Web REST
  • Démonstration : Utilisation de services Web REST
  • Travaux pratiques : Mettre en place une navigation entre différentes vues de l'application et rendre persistants les messages sur un serveur Node à l'aide d'Angular
  • Quiz - QCM de validation des acquis

Méthodes et moyens

 Explications théoriques suivies de pratiques guidées puis de mises en autonomie


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)

Méthodes d’évaluation des acquis

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.

Profil formateur

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.

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.

Accessible à tous

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.