Ce cours est conçu pour vous fournir une immersion complète dans le monde du développement web front-end. L'objectif est de vous donner une compréhension solide et pratique des technologies, des outils, et des meilleures pratiques actuellement utilisées dans l'industrie.
Au cœur de ce cours se trouve un projet fil rouge, qui servira de plateforme d'application concrète pour les concepts abordés. Ce projet vous permettra de mettre en œuvre immédiatement les compétences acquises, renforçant ainsi votre compréhension par une pratique réelle et continue.
Vous serez initiés aux fondamentaux du développement web, y compris l'HTML, le CSS, et une introduction légère au JavaScript. Le cours abordera également des sujets essentiels tels que le responsive design, l'accessibilité, le SEO, et les pratiques de sécurité web, vous préparant ainsi à répondre aux exigences actuelles du marché.
Une partie importante du cours sera dédiée à la familiarisation avec les outils de développement modernes et les workflows. Cela inclut l'utilisation de VS Code, Git, Github, ainsi que des outils d'analyse et d'optimisation comme Lighthouse et Wave. Ces compétences sont cruciales pour une intégration efficace dans un environnement de développement professionnel.
À la fin du cours, vous aurez non seulement acquis des connaissances théoriques, mais aussi développé un projet web fonctionnel que vous pourrez présenter comme preuve de vos compétences. Ce projet servira également de point de départ pour votre exploration continue et votre apprentissage dans le domaine du développement web front-end.
- Comprendre l'histoire et la structure du web
- Installer et configurer les outils de développement essentiels
- Démarrer le projet fil rouge avec HTML et CSS
- Histoire et évolution du Web
- Architecture Client-Serveur
- Distinction Front-End / Back-End / DevOps
- Présentation des outils de développement web front-end
- Installation et Configuration de VS Code, Prettier, Live Server
- Introduction à HTML et CSS
- Présentation et vote pour le Projet fil rouge
- Création de la Structure de Base du Projet fil rouge
- Comprendre et appliquer les principes de design web
- Initier les apprenants à SASS et Figma
- Intégrer les designs dans le projet fil rouge
- Principes de Responsive Design et approche Mobile-First
- Introduction à SASS et ses avantages
- Utilisation de Figma pour les Wireframes et les Maquettes graphiques
- Application des Styles avec CSS/SASS dans le Projet
- Revue de code et feedback
- Maîtriser les fondamentaux de Git et Github
- Approfondir les compétences en CSS et SASS
- Utiliser l'inspecteur web pour le débogage et l'exploration
- Gestion des Issues et Versionnement du Projet
- Présentation de Git et Github, Gitlab, Bitbucket
- Techniques avancées en CSS/SASS
- Exploration de l'Inspecteur Web pour le développement et le débogage
- Revue de code et feedback
- Optimiser le site pour la performance, l'accessibilité et le SEO
- Comprendre et appliquer les règles du RGPD
- Utilisation de Lighthouse et Wave pour l'analyse de Performance
- Optimisation du Projet (Performance, Accessibilité, SEO)
- Finalisation des implémentations pour le Projet
- Revue de code et feedback
- Comprendre les bases de la Sécurité Web
- Comprendre les bases du recettage et du déploiement
- Déployer un Projet
- Introduction aux concepts de Sécurité Web
- Application des pratiques de Sécurité au Projet
- Introduction au recettage et au déploiement
- Déploiement du Projet sur Github Pages
- Présentation des Projets, discussion collective et feedback
- Quizz final