Description
Ce programme de formation vise à maîtriser l'utilisation des technologies web modernes, notamment HTML5, CSS3 et JavaScript. Il permet aux participants de comprendre le fonctionnement des sites et applications web, d'écrire et d'utiliser du code JavaScript, ainsi que de gérer l'interactivité et les événements. Les apprenants découvriront également les principes du responsive design et l'intégration de bibliothèques comme jQuery. Ce cursus s'adresse aux développeurs web débutants à intermédiaires souhaitant approfondir leurs compétences en développement front-end.
Objectifs
- Maîtriser l'utilisation des balises et feuilles de style HTML5/CSS3Ecrire et utiliser du code JavaScript Utiliser JavaScript pour gérer l'interactivité d'un site webGérer les évènements et les manipulations dynamiquesConstruire son site en Responsive DesignDécouvrir et utiliser une librairie Javascript
Récapitulatif
Public
Développeurs Web, architectes web, chefs de projet, webmasters…
Prérequis
Posséder des connaissances en langages HTML et CSS et en programmation structurée
Méthodes et modalités pédagogiques
Formation réalisée en Présentiel, Distanciel ou Dual-Learning selon la formule retenue.
Moyens et supports pédagogiques
Mise à disposition d'un poste de travail sur nos formations en Présentiel.
Mise à disposition de nos environnements de visio sur nos formations en Distanciel
Remise d'une documentation pédagogique numérique pendant la formation
La formation est constituée d'apports théoriques, d'exercices pratiques et de réflexions
Dans le cas d'une formation sur site Entreprise, le client s'engage à avoir toutes les ressources pédagogiques nécessaires (salle, équipements, accès internet, TV ou Paperboard...) au bon déroulement de l'action de formation conformément aux prérequis indiqués dans le programme de formation
Modalités de suivi et d'évaluations
Auto-positionnement des stagiaires avant la formation
Émargement des stagiaires et formateur par 1/2 journée
Exercices de mise en pratique ou quiz de connaissances tout au long de la formation permettant de mesurer la progression des stagiaires
Auto-évaluation des acquis de la formation par les stagiaires
Questionnaire de satisfaction à chaud et à froid à l'issue de la formation
Programme détaillé
Maîtriser l'utilisation des balises et feuilles de style HTML5/CSS3
- A l'issue de cette séquence, vous êtes capable d'expliquer le fonctionnement des sites web ou applications web. Vous identifiez le rôle des langages HTML, CSS et JS. Vous comprenez le rôle de Javascript dans les sites ou applications web. Vous savez définir le DOM.
- Rappels sur le fonctionnement d'un site internet ou d'une application web
- Environnement de développement
- Utiliser HTML5 avec CSS3 et Javascript
- Principes du DOM
Écrire et utiliser du code JavaScript (1/2)
- A l'issue de cette séquence, vous êtes capable de créer une page HTML qui charge des fonctionnalités JS. Vous identifiez que le JS peut s'exécuter côté serveur avec NodeJS. Vous savez définir NodeJS et la différence avec l'environnement d'exécution JS des navigateurs (DOM notamment).
- Exécution de Javascript
- Côté client : Appel d'un script dans une page web
- Côté serveur : Appel d'un script avec NodeJS
Écrire et utiliser du code JavaScript (2/2)
- A l'issue de cette séquence, vous êtes capable d'écrire du code javascript moderne avec les syntaxes du standard ES6 ou plus.
- Principes et nouveautés de ES6 et plus
- - Syntaxes de bases d'écriture du langage
- - Mots-clés (let, const)
- - Fonctions
- - Les fonctions fléchées
- - Les fonctions de manipulation de données : map, filter, forEach…
- - La programmation orientée objet en ES6
- - Définition des classes
- - L'opérateur new
- - Modification d'un objet : getter / setter
- - Héritage
- - Rétrocompatibilité
- - Table des compatibilités
- - Polyfills
- - Compilateurs
Utiliser JavaScript pour gérer l'interactivité d'un site web
- A l'issue de cette séquence, vous êtes capable d'utiliser l'API DOM pour modifier une page HTML. Vous savez lire et/ou écrire des données au format JSON.
- Introduction à l'API DOM
- Format de données JSON
- Insérer ou récupérer des données dans les pages (balises data, etc.)
Gérer les événements et les manipulations dynamiques
- A l'issue de cette séquence, vous êtes capable d'écouter des évènements sur une page web. Vous savez gérer des traitements asynchrones et savez manipuler ou identifier le fonctionnement des requêtes AJAX.
- Gérer les évènements
- - Ecouter les événements
- - Réagir aux événements
- Notion de callback
- Introduction aux traitements asynchrones et requêtes AJAX
Construire son site en responsive design
- A l'issue de cette séquence, vous êtes capable d'identifier les apports de Javascript pour l'affichage responsive. Vous savez utiliser les matchMedia.
- La méthode matchMedia (équivalent des Media Queries pour JavaScript)
- La détection des périphériques avec le User-Agent
- Rétrocompatibilité (tables de compatibilité et polyfills)
Découvrir et utiliser une librairie JavaScript
- A l'issue de cette séquence, vous êtes capable d'intégrer et utiliser JQuery. Vous identifiez la différence entre une librairie et un Framework.
- Utiliser jQuery
- - Utilité du Framework
- - Sélecteurs
- - Gestion des événements
- - Appel de données avec ajax
- - Rendu dans le dom
- - Les limitations de jquery
- - Importer jquery dans des classes es6