Module 1Définir le rôle de JavaScript dans le développement
Chapitre 2 sur 15
Suivre le parcours d'une page web, de l'URL à l'affichage, et connaître les méthodes et codes HTTP.
Objectifs
Avec ce chapitre, tu sauras…
Quand tu tapes une adresse dans ton navigateur, des machines dans le monde entier échangent des messages en quelques millisecondes. Comprendre cet échange est indispensable : JavaScript intervient à la toute fin (dans ton navigateur) et, avec AJAX (chapitre 14), il saura lui-même discuter avec le serveur.
Leçon 1
[PC] [téléphone] [tablette] ← CLIENTS (navigateurs)
\ | /
\ | /
──────── RÉSEAU (Internet) ────────
/ | \
[serveur web] [serveur de base [serveur de
de données] fichiers] ← SERVEURS| Élément | Rôle | Exemples |
|---|---|---|
| client | envoie des requêtes et affiche les résultats | navigateur Chrome, application mobile |
| serveur web | reçoit les requêtes HTTP et renvoie les pages | Apache, Nginx |
| serveur d'application | exécute le code côté serveur | PHP, Node.js, Java |
| serveur de base de données | stocke et fournit les données | MySQL, PostgreSQL, MongoDB |
Vidéo · À regarder
FRHTML en 1 HEURE - Formation HTML complète en 2025
Melvynx · YouTube
Leçon 2
www.ofppt.ma.196.200.x.x.Leçon 3
Leçon 4
| Méthode | Rôle | Exemple |
|---|---|---|
| GET | récupérer une ressource | afficher une page, lire une liste de produits |
| POST | créer une ressource, envoyer des données | enregistrer un formulaire d'inscription |
| PUT | mettre à jour une ressource (ou la créer si elle n'existe pas) | modifier un profil |
| DELETE |
1Le rôle du DNS est de…
2Pour envoyer un formulaire d'inscription, on utilise plutôt…
3Le code 404 signifie…
4Le JavaScript d'une page s'exécute…
5HTTPS est…
6La méthode qui supprime une ressource est…
L'essentiel du chapitre
| supprimer une ressource |
| supprimer un commentaire |
| HEAD | récupérer seulement les métadonnées (en-têtes), sans le corps | vérifier qu'un fichier existe |
| Code | Signification | Famille |
|---|---|---|
| 200 OK | succès | 2xx : succès |
| 301 Moved Permanently | la ressource a changé d'adresse | 3xx : redirection |
| 403 Forbidden | accès interdit | 4xx : erreur du client |
| 404 Not Found | ressource introuvable | 4xx : erreur du client |
| 500 Internal Server Error | erreur dans le code du serveur | 5xx : erreur du serveur |
Vidéo · À regarder
FRApprendre le HTML - Tutoriel Pour Débutant (2h)
MaxCode · YouTube
La théorie du web expliquée par Melvynx : client, serveur et navigateur.
De l'adresse tapée à la page affichée
CLIENT (navigateur) SERVEUR (web + application)
│ 1) demande la page ───────────────► │
│ │ 2) PHP lit la base MySQL
│ │ et génère la page HTML
│ ◄─────────────── 3) envoie la page HTML │
│
4) le JavaScript s'exécute dans le navigateur
et modifie la page (sans recharger)Le code serveur (PHP, Node.js…) s'exécute avant l'envoi de la page ; le JavaScript client s'exécute après, dans le navigateur. JavaScript peut donc modifier la page affichée et réagir aux actions de l'utilisateur, mais il ne peut pas lire directement la base de données du serveur : il doit lui envoyer une requête (AJAX, chapitre 14).
Les navigateurs et les serveurs web communiquent avec le protocole HTTP (HyperText Transfer Protocol), un protocole de type requête / réponse qui s'appuie sur des connexions TCP. HTTPS est sa version chiffrée (sécurisée).
Une requête HTTP contient une URL (la ressource demandée) et une méthode (l'action souhaitée).
Ouvre https://www.ofppt.ma, puis l'onglet Réseau des outils de développement, et recharge la page. Relève : le nombre total de requêtes, la méthode et le code d'état de la première requête (le document HTML), et trois types de fichiers différents téléchargés.
Remets ces étapes dans l'ordre : (a) le serveur envoie les fichiers HTML, CSS et JS ; (b) l'utilisateur tape l'URL ; (c) le DNS renvoie l'adresse IP ; (d) le navigateur exécute le JavaScript ; (e) le navigateur envoie une requête HTTP au serveur web ; (f) le navigateur demande l'adresse IP au DNS.
Pour chaque situation, donne la méthode HTTP la plus adaptée et le code d'état le plus probable : (1) afficher la page d'accueil qui existe ; (2) afficher /stagiaires/999 alors que ce stagiaire n'existe pas ; (3) supprimer le commentaire n° 12 ; (4) modifier l'adresse e-mail de son profil.
La réponse HTTP contient un code d'état (le résultat) et, en général, un corps : la ressource demandée (HTML, image) ou des données au format JSON ou XML.
Front-end, back-end et full-stack expliqués en français par MaxCode.