Le web expliqué : HTTP, HTTPS, cookies et sessions
Comprendre ce qui se passe quand on ouvre une page : requête et réponse HTTP, rôle de HTTPS et du certificat, cookies et sessions de connexion, et les attributs de sécurité des cookies.
HTML : créer un tableau de données (table) lisible et accessible
Construire un tableau HTML correct : table, caption, thead, tbody, th avec scope, fusion de cellules, mise en forme CSS en bandes, et défilement horizontal sur mobile.
HTML : créer sa première page web (structure, titres, liens, images)
Écrire une page HTML complète : doctype, head (titre, encodage, viewport), body, titres, paragraphes, listes, liens et images avec texte alternatif, puis l'ouvrir dans le navigateur.
HTML sémantique : header, nav, main, article, footer
Structurer une page avec les balises sémantiques HTML5 (header, nav, main, section, article, aside, footer) pour l'accessibilité et le référencement, au lieu de div partout.
HTML : créer un formulaire (input, label, validation intégrée)
Construire un formulaire HTML accessible : form, label associé, types d'input (email, number, date), select, textarea, attributs required, minlength, pattern, et bouton d'envoi.
Rendre un site accessible : les 8 règles essentielles
Les bases de l'accessibilité web : texte alternatif des images, labels de formulaires, contraste des couleurs, navigation au clavier et focus visible, titres hiérarchisés, liens explicites, et outils de test (Lighthouse, WAVE).
GitHub : proposer une modification avec une pull request
Le flux de travail GitHub : créer une branche, pousser ses commits, ouvrir une pull request, répondre à la relecture, fusionner, et contribuer à un projet qui n'est pas le sien avec un fork.
Publier un site gratuitement avec GitHub Pages
Mettre en ligne un site HTML/CSS gratuitement avec GitHub Pages : pousser le dépôt, activer Pages dans les paramètres, obtenir l'adresse github.io, et ajouter un nom de domaine personnalisé.
GitHub Actions : lancer ses tests automatiquement à chaque push
Créer un workflow GitHub Actions qui installe Python ou Node.js et lance les tests à chaque push et pull request, lire le résultat, et ajouter un badge au README.
Git : marquer une version avec un tag (et créer une release GitHub)
Créer des tags Git annotés pour marquer les versions (v1.0.0), comprendre le versionnage sémantique, pousser les tags, revenir à une version, et publier une release sur GitHub.
Git : mettre son travail de côté avec git stash
Utiliser git stash pour mettre de côté des modifications en cours, changer de branche pour une urgence, puis récupérer son travail avec stash pop, et gérer plusieurs stashs.
Git : explorer l'historique (log, diff, show, blame)
Consulter l'historique d'un projet Git : git log en graphe et filtré, git diff pour voir les changements, git show pour un commit, git blame pour savoir qui a modifié une ligne.
Git : ignorer des fichiers avec .gitignore (et retirer un fichier déjà suivi)
Écrire un fichier .gitignore pour exclure node_modules, .env, les fichiers de build et de l'éditeur, comprendre les motifs, et retirer de Git un fichier déjà commité avec git rm --cached.
Git : cloner un dépôt et travailler à plusieurs (clone, pull, push)
Récupérer un projet existant avec git clone, se mettre à jour avec git pull, envoyer ses commits avec git push, et comprendre l'erreur « rejected » quand quelqu'un a poussé avant vous.
Git : résoudre un conflit de fusion (merge conflict)
Comprendre pourquoi Git signale un conflit lors d'un merge, lire les marqueurs <<<<<<< ======= >>>>>>>, choisir la bonne version dans VS Code, puis terminer la fusion.
Git bisect : trouver le commit qui a introduit un bug
Utiliser git bisect pour retrouver rapidement, par dichotomie, le commit responsable d'une régression : marquer un commit bon et un mauvais, tester, et automatiser avec git bisect run.
Git : annuler une modification (restore, revert, reset, amend)
Les bonnes commandes Git pour revenir en arrière : annuler des modifications non commitées (restore), corriger le dernier commit (amend), annuler un commit publié (revert), revenir en arrière en local (reset).
Node.js : créer une petite API avec Express
Créer un serveur web et une API REST avec Node.js et Express : routes GET et POST, lecture du JSON envoyé, paramètres d'URL, codes de réponse, et fichiers statiques.
Garder ses clés secrètes hors du code : variables d'environnement et fichiers .env
Ne jamais écrire de mot de passe ou de clé d'API dans le code : utiliser les variables d'environnement, un fichier .env avec python-dotenv ou Node.js, et l'exclure de Git avec .gitignore.
Les accents s'affichent mal (é, �) : comprendre l'encodage UTF-8
Pourquoi les accents deviennent é ou � : comprendre UTF-8 et Windows-1252, préciser l'encodage en Python, HTML et dans VS Code, et réparer un fichier mal encodé.
Docker : mettre son application dans un conteneur (Dockerfile)
Écrire un Dockerfile pour une application Python ou Node.js : image de base, copie des fichiers, installation des dépendances, commande de lancement, construire l'image et lancer le conteneur.
Les outils de développement du navigateur (F12) expliqués
Utiliser les DevTools de Chrome, Edge ou Firefox : inspecter et modifier le HTML et le CSS, lire la console, analyser le réseau (requêtes, codes, temps), le stockage, et simuler un mobile.
CSS : variables (custom properties) et mode sombre automatique
Définir des variables CSS dans :root, les réutiliser avec var(), et ajouter un mode sombre automatique avec prefers-color-scheme, plus un bouton pour forcer le thème.
CSS : un site adapté aux téléphones (responsive, media queries)
Rendre un site responsive : balise viewport, approche mobile d'abord, media queries min-width, images fluides, unités relatives et clamp() pour les tailles de texte, et tester avec les outils du navigateur.