Jour 1 - Exercice de placement
Vous retrouverez les fichiers et consignes de l'exercice ici :
Le zip de l'exercice
Remise à niveau
Jour 2 - Zoning HTML et Conditions
Les métiers du web :
Le contenu du cours
Organiser les fichiers de son projet Intégration et JavaScript :
Le contenu du cours
La maquette dont on fait le zoning ensemble :
Le fichier
La correction
La maquette dont vous devez faire le zoning tous seuls :
Le fichier
La correction
Les consignes de l'exercice sur les conditions :
Les consignes
Jour 3 - Projet Site dont vous êtes le héros
Vous retrouverez les consignes du projet ici :
Les consignes du projet
Vous retrouverez les fichiers du projet ici :
Le zip du projet
Vous trouverez une correction possible du projet ici :
Le zip de la correction
Jour 4 - Boucles, tableaux et fonctions
Vous retrouverez le cours sur les boucles et tableaux ici :
Le cours boucles et tableaux
Vous retrouverez les consignes des exercices sur les boucles et tableaux ici :
Les consignes des exercices boucles et tableaux
Vous retrouverez les corrections des exercices sur les boucles et tableaux ici :
Les corrections des exercices boucles et tableaux
Vous retrouverez le cours sur les fonctions ici :
Le cours fonctions
Vous retrouverez les consignes des exercices sur les fonctions ici :
Les consignes des exercices fonctions
Vous retrouverez les corrections des exercices sur les fonctions ici :
Les corrections des exercices fonctions
Jour 5 - Projet CV HTML
Vous retrouverez les consignes du projet ici :
Les consignes
Vous retrouverez la maquette bleue du CV ici :
La maquette bleue
Vous retrouverez la maquette rouge du CV ici :
La maquette rouge
Vous retrouverez la maquette du formulaire ici :
La maquette du formulaire
Vous retrouverez la correction du projet ici :
La correction
Jour 6 - Sélecteurs CSS et Manipulation du DOM en JS
Vous retrouverez les consignes de l'exercice CSS ici :
Les consignes CSS
Vous retrouverez la maquette de l'exercice CSS ici :
La maquette CSS
Vous retrouverez les fichiers de l'exercice CSS ici :
Les fichiers HTML & CSS
Vous retrouverez la correction de l'exercice CSS ici :
Le fichier CSS
Vous retrouverez le cours sur la manipulation du DOM en JS ici :
Le cours JS
Vous retrouverez les consignes des exercices en JS ici :
Les exercices
Vous retrouverez les fichiers de l'exercice JS ici :
Les fichiers HTML, CSS & JS
Vous retrouverez la correction de l'exercice JS ici :
Le fichier JS
Jour 7 - Les Events en JS
Vous retrouverez la démo ici :
La démo JS
Vous retrouverez les explications de la démo ici :
Les explications de la démo
Vous retrouverez les consignes des exercices ici :
Les consignes
Vous retrouverez les fichiers des exercices (+ la démo) ici :
Les exercices
Vous retrouverez les consignes du mini projet ici :
Les consignes
Vous retrouverez les fichiers du mini-projet ici :
Les fichiers
Vous retrouverez la correction du mini projet ici :
La correction
Jour 8 - Projet Mini Paint en JS
Vous retrouverez les consignes du projet ici :
Les consignes
Vous retrouverez les fichiers du projet ici :
Le zip du projet
Jour 9 - Utilisation de Git & Exercices de Debug
Vous retrouverez les explications sur Git ici :
Les explications Git
Jour 10 : Exercice Intégration & Dynamisation JS
Les consignes de l'exercice d'intégration ici :
Les consignes d'intégration
Vous retrouverez la maquette normale de l'exercice ici :
La maquette normale
Vous retrouverez la correction de l'intégration de la maquette normale ici :
La correction
Les consignes de l'exercice de dynamisation ici :
Les consignes de dynamisation
Vous retrouverez la maquette sections inactives de l'exercice ici :
La maquette sections inactives
Jour 11 : Exercice Validation de formulaires
Les consignes de l'exercice de validation ici :
Les consignes
Vous retrouverez la maquette avec les erreurs de l'exercice ici :
La maquette erreurs
Jour 12 : Media Queries & Responsive
Vous retrouverez le cours sur les media-queries :
Le cours
Vous retrouverez les consignes des exercices ici :
Les consignes des exercices
Vous retrouverez les fichiers des exercices ici :
Les fichiers des exercices
Vous retrouverez la correction des exercices ici :
Le fichier CSS à ajouter
Vous retrouverez les consignes du mini-projet ici :
Les consignes
Vous retrouverez les fichiers du mini-projet ici :
Les fichiers
Jour 13 : Créer une scrollbar
Vous retrouverez les consignes et infos du mini-projet ici :
Le cours
Vous retrouverez les fichiers du mini-projet ici :
Les fichiers
Intégration
Module 1 - Jour 1 : HTML : structure de page et de contenu
L'enquête de satisfaction à remplir :
L'enquête
L'extension Chrome à installer :
HTML 5 Outliner
Le validateur HTML du W3C :
W3C Markup Validation
Le cours sur les balises de structure de la page :
Le cours sur la structure des pages
L'image de l'exercice 1 de reconnaissance des balises
L'image 1
L'image de l'exercice 2 de reconnaissance des balises
L'image 2
L'image de l'exercice 3 de reconnaissance des balises
L'image 3
Le cours sur les balises de structure du contenu :
Le cours sur la structure des pages
Les consignes des exercices de structure de contenu :
Les consignes
Le lien de l'article de Wikipédia que vous devez transformer en page HTML :
L'article Wikipédia
Le PDF de l'article de Mediapart que vous devez transformer en page HTML :
L'article de Médiapart
Le contenu de l'article du blog de ma boite que vous devez transformer en page HTML :
L'article de blog
Le lien du thème que vous devez transformer en page HTML :
Le thème
Module 1 - Jour 2 : CSS Positionnement et Mise en page de texte
Le cours sur le positionnement :
Le cours sur le positionnement
Le cours sur la mise en page de texte :
Le cours sur la mise en page
Les exercices sur le positionnement :
Les exercices sur le positionnement
Maquette exercice 1 :
La maquette de l'exercice 1
Maquette exercice 2 :
La maquette de l'exercice 2
Maquette exercice 3 :
La maquette de l'exercice 3
Maquette exercice 4 :
La maquette de l'exercice 4
Le template de l'exercice 5 :
Le template de l'exercice 5
Module 1 - Jour 3 : HTML Les formulaires
Le cours sur les formulaires :
Le cours sur les formulaires
Un peu plus de CSS :
Le cours sur le CSS
Les consignes des exercices sur les formulaires :
Les consignes des exercices sur les formulaires
Maquette de l'exercice 1 :
La maquette
Maquette de l'exercice 2 :
La maquette
Maquette de l'exercice 3 :
La maquette
La démo du mini-projet :
La démo
La maquette du mini-projet :
La maquette
Module 2 - Jour 4 : CSS Grid & CSS Flex
Le cours sur CSS Grid :
Le cours sur Grid
Le cours sur CSS Flexbox :
Le cours sur Flex
Reset & Normalize :
Reset & Normalize
Initiation à Sass :
Le cours sur les bases de Sass
Les consignes des exercices Grid :
Les consignes
Maquette exercice 1 :
La maquette de l'exercice 1
Maquette exercice 2 :
La maquette de l'exercice 2
Maquette exercice 3 :
La maquette de l'exercice 3
Le template à intégrer avec Grid, Flex et Sass :
Le template
Module 2 - Jour 5 : Mini projet Yepify
Les consignes :
Les consignes
Les images :
Les images
La Maquette de la homepage
La maquette de la home
La Maquette de la page pricing
La maquette du pricing
Une correction possible de Yepify
La correction
Module 2 - Jour 6 : CSS : Gradients, pseudo classes et pseudo éléments
Le cours sur les gradients :
Le cours gradients
Le cours sur les pseudo classes et éléments :
Le cours pseudo classes & pseudo éléments
Les consignes des exercices sur les gradients :
Les consignes gradients
La maquette de la page de blog à intégrer :
La maquette blog
La maquette de la page article à intégrer :
La maquette article
Les consignes pour l'exercice blog :
Les consignes blog
Module 2 - Jour 7 : Les Media en HTML & Les backgrounds en CSS
Le cours sur les media en HTML :
Le cours sur les media
Le cours sur les background :
Le cours sur les background
Les exercices sur les background :
Les exercices sur les backgrounds
starwars.jpg :
L'image star wars
starwarsdark.jpg :
L'image star wars dark
Le template à intégrer :
Le template
Consignes du mini-projet :
Le template
Module 3 - Jour 8 : Le Responsive et les Media Queries
Vous retrouverez le cours sur les media-queries ici:
Le cours
Les consignes pour le mini-projet Yepify Responsive:
Les consignes
La maquette responsive de la home:
La maquette de la home
La maquette responsive du pricing:
La maquette du pricing
Si vous avez fini Yepify : voici du bonus a intégrer format desktop et format mobile:
Le bonus
Correction responsive Yepify:
Correction
Module 3 - Jour 9 : Mini Projet Responsive
La home à intégrer (vérifier les résolutions) :
Home
La liste de cours à intégrer (vérifier les résolutions) :
Liste de Cours
La page d'un cours à intégrer (vérifier les résolutions) :
Page d'un cours
Module 3 - Jour 10 : Bootstrap
Le cours sur Bootstrap :
Le cours Bootstrap
Les consignes de l'exercice sur Bootstrap :
Les consignes Bootstrap
Module 4 - Jour 11 : Format SVG et Animations CSS
Le cours sur les animations :
Le cours animations
Le cours sur le format SVG :
Le cours SVG
Consignes des exercices d'animation :
Les consignes animations
Fichier des exercices d'animation :
Les fichiers animations
Fichier des exercices SVG :
Les fichiers SVG
Consignes des exercices d'animation SVG :
Les consignes animations SVG
Une bonne librairie d'animations CSS gratuite :
Animate CSS
Module 4 - Jour 12 : Accessibilité Web
Le cours sur l'accessibilité web :
Le cours accessibilité
Le cours sur les attributs aria :
Le cours aria
La homepage à intégrer :
La homepage
La page de liste d'articles à intégrer :
La page de liste d'articles
La page de détails d'un article à intégrer :
La page détails d'un article
Module 4 - Jour 13 : SEO et Metadata
Le cours sur les métadonnées :
Le cours metadata
Précisions sur Open Graph :
Le cours Open Graph
Le site à intégrer :
Le site à intégrer
Module 5 - Jour 14 : Mini projet : fabriquer une librairie de composants
Consignes pour la création de la librairie de composants :
Les consignes
Module 5 - Jour 15 : Projet de Groupe
Composition des groupes :
Composition des groupes
Sujet groupe 1 :
Sujet groupe 1
Sujet groupe 2 :
Sujet groupe 2
Sujet groupe 3 :
Sujet groupe 3
Sujet groupe 4 :
Sujet groupe 4
Module 5 - Jour 16 : Projet de Groupe
Module 5 - Jour 17 : Révisions
La maquette à intégrer :
La maquette
Les images et codes couleur :
Les assets
La police sur Google Fonts :
Police Montserrat
JavaScript
Module 1 - Jour 1 : Introduction au JavaScript comparaisons, conditions et boucles
Le cours d'introduction :
Intro
Web
JavaScript
Variables et types
Opérateurs
Exercices variables et types :
Exercices variables et types
Le cours d'algorithmie :
Comparaisons
Conditions
Boucles
Exercices boucles et conditions :
Exercices boucles et conditions
Mini projet :
Mini projet le nombre mystère
Module 1 - Jour 2 : Tableaux, objets et fonctions
Le cours sur les tableaux :
Les tableaux
Exercices sur les tableaux :
Exercices sur les tableaux
Le cours sur les objets :
Les objets
Exercices sur les objets :
Exercices sur les objets
Le cours sur les fonctions :
Les fonctions
Exercices sur les fonctions :
Exercices sur les fonctions
Exercices bonus :
Exercices bonus
Module 1 - Jour 3 : Mini Projet : base utilisateur
Le sujet :
Mini projet base utilisateurs
Module 2 - Jour 4 : Interactions avec le DOM
Le cours :
Le cours
Les fichiers des exercices :
Les fichiers
Les consignes :
Les consignes
Exercices composants UI :
Les consignes
Module 2 - Jour 5 : Mini Projet Interface Administrateur
Le sujet :
Mini projet interface admin
Module 3 - Jour 6 : Canvas et timers
Les cours :
Le cours sur les timers
Le cours sur les canvas
Les exercices :
Les exercices sur les timers
Les exercices sur les canvas
Les fichiers des exercices canvas
Module 4 - Jour 7 : La POO en JavaScript
Le cours :
Le cours sur la POO
Les exercices :
Les exercices sur la POO
Les exercices de soutien :
Les exercices de soutien
Module 4 - Jour 8 : Mini Projet Pizzeria
Les consignes :
Les consignes du projet
Les fichiers :
Les fichiers du projet
La correction :
La correction du projet
Module 4 - Jour 9 : JSON, localStorage et sessionStorage
Le cours :
Le cours sur JSON et le storage
L'exercice / mini-projet :
Les consignes de l'exercice / mini projet
Les fichiers de l'exercice
Module 4 - Jour 10 : Projet Jeu dont vous êtes le héros
Composition des groupes :
Composition des groupes
Consignes :
Consignes
Module 4 - Jour 11 : Projet Jeu dont vous êtes le héros
Module 5 - Jour 12 : Vue JS
Cours Vue JS :
Vue JS Bases et Data Binding
Vue JS Conditions et Boucles
Vue JS Formulaires
Exercices : Exercices du jour 1
Soutien : Exercices de soutien, tableaux, boucles et objets
Correction Soutien : Correction des exercices de soutien
Module 5 - Jour 13 : Vue JS
Cours Vue JS :
Vue JS Components
Vue JS Props
Exercices Vue JS :
Exercices Vue JS Components et Props
Module 5 - Jour 14 :
Le sujet :
Sujet
Module 6 - Jour 15 : Projet Yepages
Le sujet :
Consignes Projet Yepages
Module 6 - Jour 16 : Projet Yepages
PHP
Module 1 - Jour 1 : du JS au PHP
Variables et types :
Le cours
Les exercices
Conditions :
Le cours
Boucles :
Le cours
Les exercices
Fonctions :
Le cours
Echo :
Le cours
Mini projet Bulletin de notes :
Les consignes
Mini projet Usine de robots :
Les consignes
Module 1 - Jour 2 : require et formulaires
Mini Projet Routing :
Les consignes
SQL - Jour 3
Les cours :
Introduction
SQL et MySQL
SELECT
JOIN
INSERT
UPDATE
DELETE
UML - Jour 4
Le cours :
Modélisation d'une base de données
Exercices :
Exercice de modélisation
Mini-projet :
Mini projet modélisation
Module 2 - Jour 5 : la POO
Les classes :
Le cours
Les exercices
PDO :
Le cours
Les exercices
La table users pour les exercices
Soutien :
Les consignes
Module 2 - Jour 6 : pratique POO
Module 2 - Jour 7 : sessions et chiffrement POO
Les cours :
La session en PHP
Manipuler des mots de passe
Le mini-projet Authentification :
Les consignes
Module 2 - Jour 8 : Mini Projet POO
Le mini-projet Site Admin :
Les consignes
Module 2 - Jour 9 : Héritage et MVC
Les cours :
L'héritage en PHP
Le principe du MVC
Les schémas (c'est le même schéma y'a que la couleur qui change) :
Routing texte en blanc
Routing texte en noir
L'exercice :
Les consignes de l'exercice
Le tuto :
Tuto Routeur plus avancé
Module 3 - Jour 10 : Installation environnement local
Tutos Installation Local :
Installation pour Windows 11
Installation pour Windows 10
Installation pour Mac OS
Installation Chromebook
Le soutien :
Algorithmie
Correction Algorithmie
Classes et Bases de données
la base de données
Module 3 - Jour 11 : Héritage et MVC
Les cours :
L'héritage en PHP
Le principe du MVC
Les schémas (c'est le même schéma y'a que la couleur qui change) :
Routing texte en blanc
Routing texte en noir
L'exercice :
Les consignes de l'exercice
Le tuto :
Tuto Routeur plus avancé
Module 3 - Jour 12 : début Projet Distorsion
Les groupes :
Composition des groupes
Les consignes du projet :
Le sujet du projet
Exemple d'inté pour un salon :
Un exemple de salon
Module 3 - Jour 13 : Projet Distorsion
Module 3 - Jour 14 : Projet Distorsion
Module 3 - Jour 15 : fin Projet Distorsion
WordPress : jour 16
Le cours :
Développer pour WordPress
Les fichiers :
La maquette
Les consignes :
Les consignes du projet
WordPress : jour 17
WordPress : jour 18
Retour au JS : jour 19 fetch et Promise
Les cours :
C'est quoi une API
Fetch et Promise
Les consignes :
Mini projet API
La base de données :
Le fichier SQL
Correction :
Le Zip API + admin
Module 4 : jour 20 Symfony
Installation Symfony :
Installation Symfony
Création d'un projet Symfony :
Création d'un projet Symfony
Organisation dossiers Symfony :
Organisation dossiers Symfony
Consignes :
Consignes pour démarrer Symfony
Module 5 : Jour 21 : Symfony
Module 5 : Jour 22 : Symfony
Module 5 : Jour 23 : Symfony
Projet
Jour 1 - Organisation
Aide à la gestion de projet :
Github : Découpage en issues d'une fonctionnalité (milestone)
Exemple - Compte Rendu d'itération
Le routing
Mini projet Router :
Les consignes
La base de données
L'authentification
Mini projet Authentification :
Les consignes
Sécurité
Cours Failles de sécurité
Le cours
Les exercices