NSIChapitre 4

Interactions sur le web

L'essentiel en 30 secondes

Le web repose sur le modèle client-serveur et le protocole HTTP. Une page est structurée en HTML, stylée en CSS, et rendue interactive par JavaScript (côté client). Les formulaires envoient des données au serveur via GET (dans l'URL, pour la lecture) ou POST (dans le corps, pour les données sensibles). HTTP est stateless, les cookies maintiennent l'état. HTTPS ajoute le chiffrement TLS. Les codes de statut : 200 (OK), 404 (non trouvé), 500 (erreur serveur).

Les notions à connaître

HTML: HyperText Markup Language. Langage de balisage qui structure le contenu d'une page web : titres (
-
), paragraphes (
), liens (), images (), listes (
,
), tableaux (), formulaires ().
CSS
Cascading Style Sheets. Langage de style qui définit l'apparence visuelle (couleurs, polices, marges, mise en page) d'une page HTML. Séparation $contenu/pr$ ésentation. Sélecteurs : balise, .classe, #id.
JavaScript
Langage de programmation exécuté côté client (navigateur) qui rend les pages interactives. Peut modifier le DOM, réagir aux événements utilisateur, et communiquer avec un serveur $(AJAX/fetch).$
Protocole HTTP / HTTPS
Protocole requête-réponse client-serveur. Requête = méthode + URL + en-têtes + corps. Réponse = code de statut + en-têtes + corps. HTTPS = HTTP + chiffrement $TLS/SSL.$
Requête GET vs POST
GET : paramètres dans l'URL (?clé=valeur&clé 2=valeur 2), visible, limité en taille, pour la lecture. POST : paramètres dans le corps, non visible dans l'URL, sans limite, pour l'envoi de données.
URL (Uniform Resource Locator)
Adresse complète d'une ressource web : protocole://domaine $:port/chemin$ ?paramètres#ancre. Ex : https://www.exemple.fr:443/page?q=test#section 1
Modèle client-serveur
Le client (navigateur) envoie une requête HTTP au serveur. Le serveur traite la requête et renvoie une réponse (page HTML, données JSON, etc.). Le client affiche le résultat.
Codes de statut HTTP
200 = OK, 301 = redirection permanente, 400 = mauvaise requête, 403 = interdit, 404 = non trouvé, 500 = erreur serveur. 2 xx = succès, 3 xx = redirection, 4 xx = erreur client, 5 xx = erreur serveur.
Les erreurs à éviter en nsi
Confondre HTML et CSS : mettre du style directement dans les balises HTML
Le style va dans un fichier CSS ou dans une balise
CSS: Cascading Style Sheets. Langage de style qui définit l'apparence visuelle (couleurs, polices, marges, mise en page) d'une page HTML. Séparation $contenu/pr$ ésentation. Sélecteurs : balise, .classe, #id.
JavaScript: Langage de programmation exécuté côté client (navigateur) qui rend les pages interactives. Peut modifier le DOM, réagir aux événements utilisateur, et communiquer avec un serveur $(AJAX/fetch).$
Protocole HTTP / HTTPS: Protocole requête-réponse client-serveur. Requête = méthode + URL + en-têtes + corps. Réponse = code de statut + en-têtes + corps. HTTPS = HTTP + chiffrement $TLS/SSL.$
Requête GET vs POST: GET : paramètres dans l'URL (?clé=valeur&clé 2=valeur 2), visible, limité en taille, pour la lecture. POST : paramètres dans le corps, non visible dans l'URL, sans limite, pour l'envoi de données.
URL (Uniform Resource Locator): Adresse complète d'une ressource web : protocole://domaine $:port/chemin$ ?paramètres#ancre. Ex : https://www.exemple.fr:443/page?q=test#section 1
Modèle client-serveur: Le client (navigateur) envoie une requête HTTP au serveur. Le serveur traite la requête et renvoie une réponse (page HTML, données JSON, etc.). Le client affiche le résultat.
Codes de statut HTTP: 200 = OK, 301 = redirection permanente, 400 = mauvaise requête, 403 = interdit, 404 = non trouvé, 500 = erreur serveur. 2 xx = succès, 3 xx = redirection, 4 xx = erreur client, 5 xx = erreur serveur.

Interactions sur le web

L'essentiel en 30 secondes

Les notions à connaître

-

Les erreurs à éviter en nsi