Les composants d'un système — ce que tu développes et ce que tu confies à des services externes

Cet article fait partie du cours Les bases de l'informatique, qui construit depuis zéro les connaissances informatiques pratiques indispensables pour programmer et faire du vibe coding.
Une application Web se divise en quatre parties : frontend, backend, base de données et services externes. Des schémas montrent jusqu'où tu développes toi-même et à partir d'où tu passes par un service externe.

Cet article traite des quatre composants qui constituent une application Web.

Tu en développes trois en interne (tu les conçois et les mets en place toi-même) et tu utilises le dernier sous forme de service externe.

Les composants de my-app — les trois faits en interne, et le service externe
my-app (appli de réservation pour membres)
Composants développés en interne
Frontend
  • L'écran de saisie de la date de réservation et du nom
  • S'exécute sur l'appareil de l'utilisateur
Backend
  • Traite le contenu de la réservation reçue
  • La vérification d'identité se fait ici aussi
Base de données
  • Stocke les données de réservation et de membres
  • Peut être consulté et mis à jour plus tard
Composant utilisé comme service externe
  • Envoi de l'e-mail de confirmation, paiement, affichage de la carte
  • Appelle des fonctions exploitées par une autre société
Le cadre extérieur représente une seule application. Les trois éléments du cadre du haut sont les composants développés en interne ; celui du cadre du bas utilise des fonctions exploitées par une autre société.

La frontière entre développer en interne et utiliser un service passe à la jonction de ces deux cadres.

Une application Web se divise en quatre composants

Ces composants sont le frontend, le backend, la base de données et les services externes.

Ce que gère chacun des quatre composants, et où il s'exécute
Frontendcôté écranBackendcôté serveurBase de donnéesdonnées stockéesService externeautre sociétéAffiche l'écran,reçoit les saisiesTraite les donnéesreçues et répondStocke, rechercheet met à jourUtilise un servicegéré par un tiersAppareil utilisateurServeurServeurServeur externe
Chaque ligne correspond à un composant. À gauche le nom, au milieu ce qu'il gère, à droite l'endroit où il s'exécute. Le seul qui ne s'exécute pas de ton côté est celui du bas.
Quels composants sont reliés entre eux
Appareil utilisateurFrontendécran et saisiesBackenddécide et traiteBase de donnéesréservations, membresService externee-mail, paiementDétails de la réservationLecture / écritureDemande via l'API
De gauche à droite. Seul le backend est relié des deux côtés ; le frontend n'a de lien direct ni avec la base de données ni avec les services externes.

C'est le backend qui est relié à la base de données et aux services externes ; l'écran ne s'y connecte pas directement.

Le serveur (server ; un ordinateur qui reste allumé et peut accepter à tout moment les requêtes d'autres ordinateurs) sur lequel tournent ces deux composants est un ordinateur distinct de l'appareil de l'utilisateur.

Seul le quatrième, le service externe, n'est pas développé en interne : tu utilises ce qu'exploite une autre société.

Quand un problème survient, lequel des deux peux-tu corriger
ProblèmeconstatéFrontend,backend, BDDService externeTu peux corrigerAttendrele rétablissementTrouver la cause,corriger le codeVérifier l'état,prévenir l'utilisateur
Un même événement, à gauche, se scinde vers le haut et vers le bas. Celui du haut, tu peux le corriger puisque l'implémentation est de ton côté ; celui du bas est exploité par une autre société, donc tu attends. À droite, ce que tu fais dans chaque cas.

Les trois composants de la branche du haut ont leur implémentation de ton côté : c'est donc toi qui les corriges.

La base de données est le seul dont tu choisis le produit avant de l'exploiter, mais quand elle cesse de fonctionner, c'est toi qui interviens.

Le service externe est le seul que tu ne peux pas corriger toi-même en cas de panne : tu attends que l'autre société le rétablisse.

Décider ce que tu confies, c'est aussi décider ce que tu ne pourras pas corriger toi-même.

Quatre composants, une frontière

Une application Web se divise en quatre : le frontend, le backend, la base de données et les services externes.

Tu développes les trois premiers en interne ; seul le service externe utilise des fonctions exploitées par une autre société : celui qui fournit l'implémentation et celui qui traite les pannes changent donc à cette frontière.

Les services externes ne se développent pas en interne : ils s'utilisent via une API

Les fonctions lourdes à mettre en place toi-même, comme l'envoi de l'e-mail de confirmation ou l'encaissement des paiements, sont confiées à des services externes.

Les règles à suivre pour appeler un service externe forment l'API (Application Programming Interface : les règles convenues qui permettent aux programmes d'échanger des données entre eux).

Même confié à un service externe, les deux extrémités restent chez toi
Composer l'adresseet le corpsDemander l'envoivia l'APILe service externeenvoie l'e-mailRecevoir le résultatet l'enregistrerTon rôleTon rôleRôle du serviceexterneTon rôleDécider quoienvoyerÉcrire au formatimposéMécanisme d'envoiet délivrabilitéVérifier si l'envoia réussi
La rangée du haut montre le déroulement jusqu'à l'envoi de l'e-mail de confirmation. Seuls les deux éléments du milieu relèvent du service externe ; celui de gauche et celui de droite restent de ton côté.

Seul le milieu passe au service externe : envoyer la demande et vérifier le résultat restent de ton côté.

Ce qui reste de ton côté, c'est uniquement l'envoi de la demande et la vérification du résultat renvoyé.

Si tu développes en interne, la maintenance s'ajoute à ta charge, en plus de la fonction elle-même.

Même quand tu la confies, l'envoi de la demande et la vérification du résultat restent chez toi.

Seule l'implémentation passe au service externe.

Service externe et API externe

On écrit parfois les deux séparément : service externe pour ce que tu appelles, et API externe pour le point d'appel par lequel tu passes.

Les deux désignent la même chose ; la différence tient à ce que tu regardes, le service ou le point d'appel.

La réussite ou l'échec se décide composant par composant

Une même action peut s'étendre sur plusieurs composants.

La confirmation de la réservation se joue à l'écriture en base de données, et l'envoi de l'e-mail de confirmation se joue à la demande adressée au service externe.

La réservation est confirmée dès qu'elle est écrite dans la base de données.

L'envoi de l'e-mail de confirmation est un traitement distinct, demandé ensuite au service externe.

Même si l'e-mail n'arrive pas, la réservation confirmée reste enregistrée.

Cette séparation sert telle quelle quand tu enquêtes sur un problème.

« La réservation n'apparaît pas » et « l'e-mail de confirmation n'arrive pas » ne renvoient pas au même composant.

Dans le premier cas tu vérifies le backend et la base de données ; dans le second, la demande envoyée au service externe.

Pour une même réservation, le symptôme change le composant à vérifier
Une actionde réservation« La réservationn'apparaît pas »« L'e-mailn'arrive pas »Demande reçuepar le backend ?Demande envoyéeau service ?Écriture faiteen base ?Envoi réussipar le service ?
Au milieu, une seule action de réservation. La branche du haut et celle du bas réussissent ou échouent séparément : un symptôme différent t'envoie donc à un endroit différent.

La branche du haut, c'est la confirmation, celle du bas la notification : si l'une échoue, l'autre reste en l'état.

La réussite se décide composant par composant

Quand une même action s'étend sur plusieurs composants, la réussite et l'échec ne se décident pas d'un bloc.

La réservation est confirmée par l'écriture en base de données et l'e-mail de confirmation dépend de la demande adressée au service externe : quand un problème t'est signalé, commence donc par déterminer lequel des deux traitements a échoué.

QUIZ

Vérification des connaissances

Répondez à chaque question une par une.

Question 1Parmi les quatre composants d'une application web, lequel utilises-tu au lieu de le développer en interne ?

Question 2Que se passe-t-il si l'e-mail de confirmation n'arrive pas après l'écriture de la réservation en base de données ?

Question 3Quand tu confies l'envoi de l'e-mail de confirmation à un service externe, qu'est-ce qui reste de ton côté ?