21Avr2026

Quand tu cliques, il se passe quoi

Tu as cliqué des dizaines de fois sur Nouvelle citation sans te demander ce qui se passait derrière. On va ouvrir l'inspecteur réseau et regarder ensemble.

Tu as cliqué des dizaines de fois sur ce bouton.

Nouvelle citation. La citation change. Nouvelle citation. La citation change encore. Tu as testé, tu as montré à quelqu'un, tu as relu le code avec Claude, tu as été fière que ça marche. Et à aucun moment tu t'es demandé ce qui se passait entre le clic et l'apparition du texte.

Moi non plus, les premières fois. J'avais construit le truc, et je ne savais pas vraiment ce que je regardais.

Aujourd'hui on va ouvrir le capot. Pas pour comprendre l'électronique, juste pour voir que le moteur tourne.

Ouvre ton générateur. Lance le serveur si ce n'est plus en train de tourner (python -m http.server dans le terminal, depuis le dossier du projet). Ouvre localhost:8000 dans le navigateur. Clique sur Nouvelle citation.

Regarde la citation apparaître.

Maintenant on va regarder ce qu'il y a derrière ce geste.

Ouvre l'inspecteur. Clique. Regarde.

Comment ouvrir l'inspecteur réseau

Tous les navigateurs modernes ont un outil qui enregistre ce qui se passe sous le capot. Il s'appelle l'inspecteur, ou les outils de développement. Sur Chrome et Firefox, le raccourci est le même : F12. Ou clic droit n'importe où sur la page, puis "Inspecter".

Une fenêtre s'ouvre, probablement en bas ou sur le côté. Cherche l'onglet "Réseau" (ou "Network" si ton navigateur est en anglais). Clique dessus.

L'onglet est peut-être vide pour l'instant. C'est normal. Il enregistre ce qui se passe à partir du moment où tu l'ouvres.

Ce que tu vois apparaître

Maintenant clique sur Nouvelle citation dans ton générateur.

Une ligne vient d'apparaître dans l'onglet Réseau. Probablement en vert, ou en noir selon ton navigateur. Elle a un nom : quotes.json. À côté, une taille en octets, un temps en millisecondes.

Clique sur cette ligne. Un panneau s'ouvre sur le côté. Tu vois le contenu du fichier, les citations, tout le texte que tu avais mis dedans.

La citation n'était pas apparue par magie. Il y avait eu un échange.

La mécanique en quatre temps

Reprends la ligne dans l'onglet Réseau. Elle représente quelque chose de précis.

Quand tu as cliqué sur Nouvelle citation, le navigateur a envoyé une demande au serveur : "Donne-moi le fichier quotes.json (c'est le petit fichier qui stocke en dur les quelques citations de départ, parmi lesquelles ton générateur va piocher). Le serveur, installé en local (c'est la manière classy de dire sur ton ordinateur seulement), a reçu cette demande. Il a cherché le fichier. Il l'a trouvé. Il a renvoyé le contenu au navigateur. Le navigateur a lu ce contenu, a choisi une citation au hasard, et l'a affichée.

Quatre temps. Une demande part. Le serveur reçoit. Le serveur cherche et trouve. Une réponse revient.

La ligne dans l'onglet Réseau, c'est la trace de cet aller-retour. La durée en millisecondes, c'est le temps que tout ça a pris. Quelques dizaines de millisecondes parce que le serveur est sur ton propre ordinateur. Quand le serveur est à l'autre bout du monde, ça peut être quelques centaines.

La ligne dans l'inspecteur ne nous apprend pas quelque chose de nouveau sur notre générateur. Elle me montre simplement quelque chose qui s'est passé à chaque clic depuis le début.

Le mot qui manquait : requête

Ce que le navigateur envoie au serveur, ça s'appelle une requête.

Pas une demande, pas une instruction, pas un message. Une requête. C'est le mot technique, mais c'est aussi le mot juste. Tu requiers quelque chose. Le serveur répond.

J'ai entendu ce mot des dizaines de fois avant de comprendre ce qu'il désignait concrètement. Dans des articles, dans des conversations avec des développeurs, dans la bouche de Claude quand il m'expliquait un bout de code. "La requête échoue." "Le serveur ne répond pas à la requête." Je hochais la tête.

Le mot a cliqué le jour où j'ai regardé l'onglet Réseau sur un outil que j'avais construit. Pas un tutoriel, pas un schéma. Mon propre projet, ma propre ligne dans l'inspecteur. "Ah. C'est ça, une requête. C'est cette ligne-là."

Depuis, quand Claude me dit "la requête échoue", je sais ce qu'il regarde.

C'est la même chose partout

Claude Code qui parle à Anthropic

Quand je tape une instruction dans Claude Code, il ne calcule pas la réponse sur mon ordinateur. Il envoie une requête aux serveurs d'Anthropic, quelque part dans un datacenter. Les serveurs reçoivent, traitent, renvoient. Claude Code affiche la réponse.

C'est exactement la même mécanique que mon générateur de citations. La demande part, le serveur répond. La différence, c'est que le serveur est à plusieurs milliers de kilomètres, que la réponse est générée plutôt que lue dans un fichier, et que l'aller-retour prend quelques secondes plutôt que quelques dizaines de millisecondes.

J'ai compris ça en regardant l'onglet Réseau sur une page Claude un jour que j'avais l'inspecteur ouvert pour autre chose. Les lignes s'accumulaient pendant que le texte s'affichait. Chaque morceau de réponse arrivait par petites requêtes successives. Ce n'était pas un flux continu, c'était une série d'échanges très rapides.

Ton app qui parle à sa base de données

Sur Pimpela, quand l'application doit récupérer les données d'un utilisateur (son style déco par exemple), elle envoie une requête à Supabase, la base de données. Supabase cherche, trouve, renvoie. L'app affiche.

Même mécanique. Demande, réception, traitement, réponse.

Et quand tu ouvres n'importe quel site, ton navigateur envoie une requête au serveur qui héberge ce site. Le serveur renvoie la page. C'est pour ça que certains sites mettent du temps à charger : la requête fait un long chemin, ou le serveur est occupé à répondre à beaucoup de requêtes en même temps.

Ce n'est pas une particularité du générateur de citations. C'est la façon dont tous les outils numériques se parlent. Le générateur de citations était juste petit et local, ce qui le rendait facile à observer. Mais le schéma est identique partout.

Ce que ça change de savoir ça

Avant d'avoir ce mot "requete" en tête, en cas de "requete échouée" j'aurais cherché le problème n'importe où.

Avec le mot, je sais où regarder. Il y a une demande qui part et une réponse qui revient, ou qui ne revient pas. Le problème est soit dans la demande, soit dans la réponse, soit entre les deux. Ce n'est plus un problème abstrait, c'est un échange qui a raté quelque part.

Il y a quelques semaines, sur Pimpela, une fonctionnalité ne se chargeait pas. Claude m'a dit que la requête vers Supabase retournait une erreur. J'ai ouvert l'onglet Réseau. J'ai vu la ligne, en rouge cette fois. J'ai cliqué dessus. J'ai vu la réponse du serveur, avec un message d'erreur dedans.

Je n'aurais pas su lire ce message d'erreur il y a six mois. Mais j'ai su le copier-coller dans Claude en lui disant "voilà ce que je vois dans l'inspecteur réseau". Et Claude a su quoi en faire.

C'est ça que ça change. Pas de savoir réparer seule. De savoir où regarder, et quoi montrer à Claude quand ça ne va pas.

La prochaine fois qu'on regarde ça

Ton générateur de citations envoie une requête pour récupérer un fichier. Le serveur renvoie le fichier. C'est simple parce que les deux parties parlent le même langage : le navigateur demande quotes.json, le serveur sait ce que c'est, il le donne.

Mais quand deux outils différents se parlent, construits par des équipes différentes, dans des langages différents, comment font-ils pour se comprendre ? Comment le navigateur sait-il formuler sa demande pour que le serveur la comprenne ? Comment le serveur sait-il formater sa réponse pour que le navigateur sache quoi en faire ?

C'est la prochaine question. Et la réponse tient en un mot qu'on n'a pas encore posé.

Fait partie du chantierBienvenue à bord !/ Acte II : Les mots barbares pour le dire
Article suivant dans la série
08

Une API, c'est la liste de ce qu'on a le droit de demander

Deux docs ouvertes, HubSpot et Anthropic. Même logique, menus différents. Et un mot pour nommer ça.

Lire la suite →

Recevoir la newsletter

Hebdo. Les projets en cours et ce que j'en tire.