Qualiopi
HTML5, CSS3 et JavaScript ES6+ : Le Socle du Développeur
Structurez avec HTML5, stylisez avec Flexbox/Grid et dynamisez vos interfaces avec JavaScript moderne (ES6+) et l'API DOM.
5 jours
3 500 € HT
Intéressé par cette formation ?
Contactez-nous pour planifier une session.
Objectifs pédagogiques
- Structurer des pages web sémantiques et accessibles.
- Créer des mises en page responsives complexes avec Flexbox et Grid.
- Écrire du code JavaScript moderne (ES6+) propre et performant.
- Interagir dynamiquement avec le DOM et gérer les données asynchrones (API).
- Appliquer les bonnes pratiques de nommage et d'organisation CSS (BEM).
Programme
Jour 1 : HTML5 et Sémantique Avancée
- Structure et Sémantique : Au-delà de la <div>, utiliser les balises sémantiques pour le SEO et l'accessibilité (A11y).
- Formulaires Modernes : Validation native, types de champs avancés et expérience utilisateur.
- Multimédia et SEO : Optimisation des images, intégration vidéo et balises Meta (OpenGraph).
- Atelier : Création de la structure d'une page de profil professionnelle accessible.
Jour 2 : CSS3 - Layout et Design Responsive
- Maîtrise du Layout : Flexbox et CSS Grid en profondeur pour des interfaces complexes.
- Le Box Model et le Positionnement : Comprendre les empilements (z-index) et les flux.
- Responsive Design : Media Queries, unités relatives (rem, em, vh) et approche "Mobile First".
- Atelier : Mise en page d'un dashboard complexe sans framework CSS.
Jour 3 : CSS Avancé et Méthodologies
- Variables CSS : Utilisation des propriétés personnalisées pour le thémage.
- Animations : Transitions et Keyframes pour améliorer l'expérience utilisateur.
- Architecture CSS : Introduction à la méthodologie BEM (Block Element Modifier) pour un code maintenable.
- Atelier : Création d'une bibliothèque de composants UI (boutons, cartes, modales) réutilisables.
Jour 4 : JavaScript Moderne (ES6+) - Les Bases Dynamiques
- Syntaxe ES6+ : Let/Const, Arrow Functions, Template Literals et Destructuring.
- Manipulation du DOM : Sélectionner, modifier et créer des éléments dynamiquement.
- Gestion des Événements : Propagation, délégation et écouteurs d'événements.
- Atelier : Création d'une application "To-Do List" interactive avec stockage local (LocalStorage).
Jour 5 : JavaScript Asynchrone et API
- Programmation Asynchrone : Comprendre les Promises et la syntaxe async/await.
- Communication Réseau : Consommer des données avec l'API Fetch.
- Modules JS : Organiser son code avec l'import/export.
- Atelier Final : Développement d'une application météo récupérant des données réelles via une API externe.
Prérequis
- Aisance générale avec l'outil informatique.
- Aucune connaissance préalable en programmation n'est requise, mais une curiosité pour le design et la logique est un plus.
Public cible
- Débutants souhaitant s'orienter vers les métiers du web.
- Designers UI voulant comprendre les contraintes techniques de l'intégration.
- Développeurs Backend souhaitant devenir Fullstack.
Prochaines sessions
Aucune session planifiée.
Contactez-nous pour organiser une session.
Contactez-nous pour organiser une session.
Prêt à vous former ?
Contactez-nous pour obtenir un devis personnalisé.