<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>Forem: Tacite WAKILONGO</title>
    <description>The latest articles on Forem by Tacite WAKILONGO (@tacite243).</description>
    <link>https://forem.com/tacite243</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1121931%2F517161fe-313e-4bc4-810a-27078933bf5c.jpg</url>
      <title>Forem: Tacite WAKILONGO</title>
      <link>https://forem.com/tacite243</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://forem.com/feed/tacite243"/>
    <language>en</language>
    <item>
      <title>🚀 Contribuer en Open Source avec Git &amp; GitHub : Le Guide Ultime du Workflow Pro</title>
      <dc:creator>Tacite WAKILONGO</dc:creator>
      <pubDate>Wed, 25 Feb 2026 21:39:48 +0000</pubDate>
      <link>https://forem.com/tacite243/contribuer-en-open-source-avec-git-github-le-guide-ultime-du-workflow-pro-gf8</link>
      <guid>https://forem.com/tacite243/contribuer-en-open-source-avec-git-github-le-guide-ultime-du-workflow-pro-gf8</guid>
      <description>&lt;h1&gt;
  
  
  🚀 Contribuer en Open Source : Le Guide Ultime du Workflow Pro
&lt;/h1&gt;

&lt;p&gt;Contribuer à un projet open source, ce n’est pas seulement "envoyer du code". C’est intégrer une &lt;strong&gt;organisation collaborative mondiale&lt;/strong&gt;. Pour réussir, il ne faut pas seulement savoir coder, il faut savoir &lt;strong&gt;communiquer&lt;/strong&gt; et respecter des &lt;strong&gt;standards&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;L’open source ne récompense pas seulement les meilleurs codeurs.&lt;br&gt;
Il récompense les développeurs organisés.&lt;br&gt;
Ceux qui savent collaborer proprement.&lt;/p&gt;

&lt;p&gt;Prenons une analogie pour tout comprendre...&lt;/p&gt;


&lt;h2&gt;
  
  
  🏗️ L'analogie du "Chantier Communautaire"
&lt;/h2&gt;

&lt;p&gt;Imagine un immense projet de construction d'un hôpital public.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;  &lt;strong&gt;Le dépôt (Repository) principal&lt;/strong&gt; = Le bâtiment officiel en construction.&lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;L’architecte (Mainteneur)&lt;/strong&gt; = Celui qui valide les plans et la qualité.&lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;Les artisans (Contributeurs)&lt;/strong&gt; = Toi et des centaines d'autres.&lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;Le cahier des charges (Issues)&lt;/strong&gt; = La liste des pièces à construire ou des fuites à réparer.&lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;Le permis de construire (Pull Request)&lt;/strong&gt; = Ta proposition de modification soumise à l'architecte.&lt;/li&gt;
&lt;/ul&gt;


&lt;h2&gt;
  
  
  1️⃣ Étape 0 : L'étiquette (Ne travaillez pas pour rien !)
&lt;/h2&gt;

&lt;p&gt;Avant de coder, vérifiez le cahier des charges.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;  &lt;strong&gt;Consultez les Issues :&lt;/strong&gt; Cherchez les labels &lt;code&gt;good first issue&lt;/code&gt; (idéal pour débuter).&lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;Communiquez :&lt;/strong&gt; Laissez un commentaire sur l'issue : &lt;em&gt;"Je souhaite travailler sur ce sujet, pouvez-vous me l'assigner ?"&lt;/em&gt;.&lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;Proposez :&lt;/strong&gt; Si vous avez une idée neuve, créez une issue &lt;strong&gt;avant&lt;/strong&gt; de coder pour voir si l'architecte est d'accord.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;👉 &lt;em&gt;C’est comme demander si on a besoin d'un électricien avant de commencer à poser des câbles.&lt;/em&gt;&lt;/p&gt;


&lt;h2&gt;
  
  
  2️⃣ Étape 1 : Le Fork (Ta copie privée)
&lt;/h2&gt;

&lt;p&gt;Sur GitHub, cliquez sur le bouton &lt;strong&gt;Fork&lt;/strong&gt;.&lt;br&gt;
Cela crée une copie exacte du projet sur &lt;strong&gt;ton propre compte GitHub&lt;/strong&gt;. Tu es désormais le roi de cette copie, tu peux tout casser sans risquer d'abîmer le projet officiel.&lt;/p&gt;


&lt;h2&gt;
  
  
  3️⃣ Étape 2 : Le Clone &amp;amp; l'Upstream (Préparer son bureau intelligemment)
&lt;/h2&gt;

&lt;p&gt;Ramène le projet sur ton ordinateur :&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;git clone &amp;lt;url-de-ton-fork&amp;gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;⚠️ &lt;strong&gt;Ce que beaucoup ne comprennent pas :&lt;/strong&gt;&lt;br&gt;
Quand tu clones ton fork, Git configure automatiquement un remote appelé : &lt;strong&gt;origin&lt;/strong&gt;.&lt;br&gt;
👉 &lt;strong&gt;origin&lt;/strong&gt; = Ton dépôt GitHub personnel (ton fork). C’est là que tes push iront par défaut.&lt;/p&gt;

&lt;p&gt;🔎 &lt;strong&gt;L’étape cruciale (souvent oubliée) :&lt;/strong&gt;&lt;br&gt;
Ajoute une connexion vers le dépôt original (celui de l'owner) pour pouvoir récupérer les mises à jour des autres :&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;git remote add upstream &amp;lt;url-du-repo-original&amp;gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;📡 &lt;strong&gt;Ce que tu viens de créer :&lt;/strong&gt;&lt;br&gt;
Si tu tapes &lt;code&gt;git remote -v&lt;/code&gt;, tu verras :&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;  &lt;code&gt;origin&lt;/code&gt; (&lt;a href="https://github.com/ton-compte/nom_du_repo.git" rel="noopener noreferrer"&gt;https://github.com/ton-compte/nom_du_repo.git&lt;/a&gt;) -&amp;gt; Lecture + Écriture.&lt;/li&gt;
&lt;li&gt;  &lt;code&gt;upstream&lt;/code&gt; (&lt;a href="https://github.com/owner/nom_du_repo.git" rel="noopener noreferrer"&gt;https://github.com/owner/nom_du_repo.git&lt;/a&gt;) -&amp;gt; Lecture principalement.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;🧠 &lt;strong&gt;Comprendre avec un schéma :&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;                 (Repo Officiel)
                    upstream
                        ↑
                        |
   (Ton repo local) ----+----&amp;gt; origin (Ton Fork sur GitHub)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;🏗️ &lt;strong&gt;Analogie chantier :&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;  &lt;strong&gt;origin&lt;/strong&gt; = Ton entrepôt personnel.&lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;upstream&lt;/strong&gt; = Le chantier principal.&lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;git remote add upstream&lt;/strong&gt; = Installer un talkie-walkie pour écouter les annonces du chantier officiel.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;🎯 &lt;strong&gt;Pourquoi on ajoute upstream ?&lt;/strong&gt;&lt;br&gt;
Pour rester à jour pendant que tu travailles :&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;git fetch upstream
git rebase upstream/main
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;💡 &lt;em&gt;Les équipes avancées préfèrent **rebase&lt;/em&gt;* pour garder un historique propre et linéaire.*&lt;/p&gt;




&lt;h2&gt;
  
  
  4️⃣ Étape 3 : Installation &amp;amp; README
&lt;/h2&gt;

&lt;p&gt;Ne fonce pas dans le code !&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt; &lt;strong&gt;Lis le &lt;code&gt;README.md&lt;/code&gt; :&lt;/strong&gt; Il contient l'architecture et les règles de l'architecte.&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;Installe les outils :&lt;/strong&gt; &lt;code&gt;npm install&lt;/code&gt;.&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;Vérifie que le projet se lance :&lt;/strong&gt; Tu dois partir d'une base saine.&lt;/li&gt;
&lt;/ol&gt;




&lt;h2&gt;
  
  
  5️⃣ Étape 4 : La Branche (La zone d'isolation)
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;Règle d'or :&lt;/strong&gt; On ne travaille jamais sur la branche &lt;code&gt;main&lt;/code&gt;. Jamais.&lt;br&gt;
Crée une branche avec un nom clair :&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;git checkout &lt;span class="nt"&gt;-b&lt;/span&gt; feat/ajout-formulaire-client
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;👉 &lt;em&gt;C’est comme construire une maquette de la pièce dans ton atelier avant de la poser sur le vrai bâtiment.&lt;/em&gt;&lt;/p&gt;




&lt;h2&gt;
  
  
  6️⃣ Étape 5 : Coder &amp;amp; Respecter les standards
&lt;/h2&gt;

&lt;p&gt;Pendant que tu codes, respecte le style du projet (Linting, Prettier).&lt;br&gt;
&lt;strong&gt;Les "Conventional Commits" :&lt;/strong&gt; Pour que l'historique soit propre, utilise des messages clairs :&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;  &lt;code&gt;feat: ...&lt;/code&gt; (nouvelle fonctionnalité)&lt;/li&gt;
&lt;li&gt;  &lt;code&gt;fix: ...&lt;/code&gt; (correction de bug)&lt;/li&gt;
&lt;/ul&gt;


&lt;h2&gt;
  
  
  7️⃣ Étape 6 : La Qualité (Husky &amp;amp; Tests)
&lt;/h2&gt;

&lt;p&gt;Avant de partager ton travail, assure-toi qu'il est parfait.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;  &lt;strong&gt;Lance les tests :&lt;/strong&gt; &lt;code&gt;npm test&lt;/code&gt;.&lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;Nettoie ton code :&lt;/strong&gt; Supprime les &lt;code&gt;console.log&lt;/code&gt;.
Si le projet utilise &lt;strong&gt;Husky&lt;/strong&gt; (comme MariaSaaS), ton commit sera bloqué automatiquement si ton code est "sale" (ex: présence de &lt;code&gt;any&lt;/code&gt;).&lt;/li&gt;
&lt;/ul&gt;


&lt;h2&gt;
  
  
  8️⃣ Étape 7 : Synchronisation (Éviter les conflits)
&lt;/h2&gt;

&lt;p&gt;Avant l'envoi, assure-toi d'avoir intégré les derniers changements de l'architecte (voir Étape 2 avec &lt;code&gt;fetch&lt;/code&gt; et &lt;code&gt;rebase&lt;/code&gt;).&lt;/p&gt;


&lt;h2&gt;
  
  
  9️⃣ Étape 8 : Le Push &amp;amp; la Pull Request (La proposition officielle)
&lt;/h2&gt;

&lt;p&gt;Ton travail est prêt, synchronisé et tes tests passent. Maintenant, tu envoies ton travail vers &lt;strong&gt;ton fork&lt;/strong&gt;, pas vers le repo officiel :&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;git push origin feat/ajout-formulaire-client
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;🧠 &lt;strong&gt;Schéma clair du flux réel :&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;      Tu codes ici
      (Local branch)
             |
             v
     git push origin
             |
             v
     Ton Fork (GitHub)
             |
             v
     Pull Request  -----&amp;gt;  Repo Officiel (Upstream)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;🏗️ &lt;strong&gt;Analogie chantier :&lt;/strong&gt;&lt;br&gt;
Le &lt;strong&gt;push&lt;/strong&gt; = tu envoies ta maquette à ton entrepôt (origin).&lt;br&gt;
La &lt;strong&gt;Pull Request&lt;/strong&gt; = tu demandes à l’architecte : &lt;em&gt;“Est-ce que ma pièce peut être intégrée au bâtiment officiel ?”&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;🎯 &lt;strong&gt;La Pull Request (moment stratégique) :&lt;/strong&gt;&lt;br&gt;
Sur GitHub, clique sur &lt;strong&gt;"Compare &amp;amp; Pull Request"&lt;/strong&gt;. Pour être accepté :&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;  ✅ Explique clairement le problème et ta solution.&lt;/li&gt;
&lt;li&gt;  ✅ Ajoute des captures d'écran si tu as touché à l'interface.&lt;/li&gt;
&lt;li&gt;  ✅ Mentionne l’issue liée (ex: &lt;code&gt;Closes #12&lt;/code&gt;).&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  🔟 Étape 9 : La Revue de Code (Le dialogue)
&lt;/h2&gt;

&lt;p&gt;L'architecte va lire ton code. Il peut :&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt; &lt;strong&gt;Valider :&lt;/strong&gt; 🎉 Ton code est fusionné !&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;Demander des modifs :&lt;/strong&gt; Ne le prends pas personnellement ! Modifie ton code localement, refais un commit et un push, la PR se mettra à jour toute seule.&lt;/li&gt;
&lt;/ol&gt;




&lt;h1&gt;
  
  
  📌 Résumé pour ton antisèche :
&lt;/h1&gt;

&lt;ol&gt;
&lt;li&gt; &lt;strong&gt;Issue :&lt;/strong&gt; Choisir sa tâche.&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;Fork/Clone :&lt;/strong&gt; Créer son espace + Upstream.&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;Branch :&lt;/strong&gt; Isoler son travail.&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;Code/Test :&lt;/strong&gt; Produire de la qualité.&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;Push :&lt;/strong&gt; Envoyer vers &lt;code&gt;origin&lt;/code&gt;.&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;PR :&lt;/strong&gt; Proposer à &lt;code&gt;upstream&lt;/code&gt; et discuter.&lt;/li&gt;
&lt;/ol&gt;




&lt;h1&gt;
  
  
  💡 Le mot de la fin
&lt;/h1&gt;

&lt;p&gt;L'Open Source est une &lt;strong&gt;école gratuite&lt;/strong&gt;.&lt;br&gt;
Mais comme toute école, elle récompense ceux qui respectent la méthode.&lt;/p&gt;

&lt;p&gt;En suivant ce workflow, tu montres que tu es un développeur :&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;Professionnel&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Fiable&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Organisé&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Collaboratif&lt;/strong&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Et ça, c’est ta meilleure carte de visite. 🚀&lt;/p&gt;




&lt;h2&gt;
  
  
  ⚠️ Les mauvaises pratiques qui ruinent une contribution
&lt;/h2&gt;

&lt;p&gt;Voici ce qui fait immédiatement “débutant” :&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;❌ Travailler directement sur &lt;code&gt;main&lt;/code&gt;
&lt;/li&gt;
&lt;li&gt;❌ Oublier de synchroniser avec &lt;code&gt;upstream&lt;/code&gt;
&lt;/li&gt;
&lt;li&gt;❌ Faire une Pull Request sans description&lt;/li&gt;
&lt;li&gt;❌ Envoyer 15 commits “fix”, “update”, “final final v2”&lt;/li&gt;
&lt;li&gt;❌ Ne pas tester avant de push&lt;/li&gt;
&lt;li&gt;❌ Ignorer les retours du mainteneur&lt;/li&gt;
&lt;li&gt;❌ Prendre une review comme une attaque personnelle&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;👉 L’open source est collaboratif. Pas émotionnel.&lt;/p&gt;




&lt;h2&gt;
  
  
  🧠 Les bonnes pratiques des développeurs pros
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;✅ Toujours partir d’une issue claire&lt;/li&gt;
&lt;li&gt;✅ Nommer proprement ses branches (&lt;code&gt;feat/&lt;/code&gt;, &lt;code&gt;fix/&lt;/code&gt;, &lt;code&gt;docs/&lt;/code&gt;)&lt;/li&gt;
&lt;li&gt;✅ Faire des commits propres (Conventional Commits)&lt;/li&gt;
&lt;li&gt;✅ Synchroniser avant de push&lt;/li&gt;
&lt;li&gt;✅ Tester avant de proposer&lt;/li&gt;
&lt;li&gt;✅ Répondre poliment et rapidement aux reviews&lt;/li&gt;
&lt;li&gt;✅ Apprendre des corrections&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Un bon contributeur ne cherche pas à prouver qu’il est fort.&lt;br&gt;
Il cherche à améliorer le projet.&lt;/p&gt;




&lt;h2&gt;
  
  
  🎯 Rappelle-toi ceci
&lt;/h2&gt;

&lt;p&gt;Un recruteur qui regarde ton GitHub ne voit pas seulement ton code.&lt;br&gt;
Il voit :&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Ta discipline&lt;/li&gt;
&lt;li&gt;Ta capacité à travailler en équipe&lt;/li&gt;
&lt;li&gt;Ton respect des standards&lt;/li&gt;
&lt;li&gt;Ta maturité technique&lt;/li&gt;
&lt;/ul&gt;




&lt;p&gt;L’Open Source n’est pas seulement un terrain d’entraînement.&lt;br&gt;
C’est un &lt;strong&gt;simulateur du monde professionnel&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;Si tu maîtrises ce workflow :&lt;/p&gt;

&lt;p&gt;Tu es prêt pour travailler en équipe.&lt;br&gt;
Tu es prêt pour collaborer à grande échelle.&lt;br&gt;
Tu es prêt pour évoluer.&lt;/p&gt;

&lt;p&gt;Et ça… ça vaut plus qu’un simple commit. 💙&lt;/p&gt;

</description>
      <category>git</category>
      <category>opensource</category>
      <category>kadea</category>
      <category>devops</category>
    </item>
    <item>
      <title>Le backend pour débutants</title>
      <dc:creator>Tacite WAKILONGO</dc:creator>
      <pubDate>Fri, 13 Feb 2026 15:20:15 +0000</pubDate>
      <link>https://forem.com/tacite243/le-backend-pour-debutants-17lo</link>
      <guid>https://forem.com/tacite243/le-backend-pour-debutants-17lo</guid>
      <description>&lt;div class="ltag__link"&gt;
  &lt;a href="/tacite243" class="ltag__link__link"&gt;
    &lt;div class="ltag__link__pic"&gt;
      &lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1121931%2F517161fe-313e-4bc4-810a-27078933bf5c.jpg" alt="tacite243"&gt;
    &lt;/div&gt;
  &lt;/a&gt;
  &lt;a href="https://dev.to/tacite243/cuisiner-ta-premiere-api-rest-le-secret-de-la-sauce-express-prisma-et-postgres-4hif" class="ltag__link__link"&gt;
    &lt;div class="ltag__link__content"&gt;
      &lt;h2&gt;👨‍🍳 Cuisiner ta première API REST : Le Secret de la Sauce Express, Prisma et Postgres&lt;/h2&gt;
      &lt;h3&gt;Tacite WAKILONGO ・ Feb 13&lt;/h3&gt;
      &lt;div class="ltag__link__taglist"&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/a&gt;
&lt;/div&gt;


</description>
    </item>
    <item>
      <title>👨‍🍳 Cuisiner ta première API REST : Le Secret de la Sauce Express, Prisma et Postgres</title>
      <dc:creator>Tacite WAKILONGO</dc:creator>
      <pubDate>Fri, 13 Feb 2026 13:44:47 +0000</pubDate>
      <link>https://forem.com/tacite243/cuisiner-ta-premiere-api-rest-le-secret-de-la-sauce-express-prisma-et-postgres-4hif</link>
      <guid>https://forem.com/tacite243/cuisiner-ta-premiere-api-rest-le-secret-de-la-sauce-express-prisma-et-postgres-4hif</guid>
      <description>&lt;p&gt;Salut à toi, futur(e) pro du Backend ! 🚀&lt;/p&gt;

&lt;p&gt;Tu viens de dompter &lt;strong&gt;React&lt;/strong&gt;, tu sais créer des interfaces qui déchirent, mais maintenant, tu te demandes : &lt;em&gt;"Où vont mes données quand je clique sur Envoyer ?"&lt;/em&gt;. Bienvenue dans les coulisses ! &lt;/p&gt;

&lt;p&gt;Aujourd'hui, on va construire le moteur d'une &lt;strong&gt;application de gestion de présence&lt;/strong&gt; pour un centre de formation. On va gérer des &lt;strong&gt;Programmes&lt;/strong&gt; (Web Dev, Marketing, etc.), des &lt;strong&gt;Coachs&lt;/strong&gt; et des &lt;strong&gt;Apprenants&lt;/strong&gt;.&lt;/p&gt;

&lt;h3&gt;
  
  
  💡 L'analogie du Chef Cuistot
&lt;/h3&gt;

&lt;p&gt;Pour comprendre comment fonctionne une API en architecture &lt;strong&gt;MVC (Modèle-Vue-Contrôleur)&lt;/strong&gt;, imagine qu'on prépare une &lt;strong&gt;Pâte de maïs (Foufou)&lt;/strong&gt; :&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt; &lt;strong&gt;La Base de Données (Le Garde-manger) :&lt;/strong&gt; C'est là où sont stockés tes sacs de maïs et ton eau.&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;Le Modèle (La Recette) :&lt;/strong&gt; C'est le plan qui dit : "Pour faire la pâte, il faut tel ingrédient avec tel type de mesure".&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;Le Contrôleur (Le Chef) :&lt;/strong&gt; C'est celui qui mélange, surveille le feu et décide quand c'est prêt. C'est la logique.&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;Le Routeur (Le Serveur de salle) :&lt;/strong&gt; Il prend la commande du client ("Je veux un plat de Foufou !") et l'apporte au Chef.&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;La Vue (Le Plat servi) :&lt;/strong&gt; En API, on ne sert pas une assiette décorée, mais un fichier &lt;strong&gt;JSON&lt;/strong&gt; (de la donnée pure) que ton React pourra ensuite "dresser" sur l'écran.&lt;/li&gt;
&lt;/ol&gt;




&lt;h3&gt;
  
  
  🛠️ La Boîte à Outils
&lt;/h3&gt;

&lt;p&gt;Oublie les outils complexes comme Docker pour l'instant, on va tout installer en local pour bien voir ce qui se passe "sous le capot".&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt; &lt;strong&gt;Node.js&lt;/strong&gt; (ton moteur JS).&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;PostgreSQL&lt;/strong&gt; : Télécharge-le (via &lt;a href="https://postgresapp.com/" rel="noopener noreferrer"&gt;Postgres.app&lt;/a&gt; sur Mac ou l'installeur officiel sur Windows/Linux).&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;Un client API&lt;/strong&gt; : &lt;a href="https://www.postman.com/" rel="noopener noreferrer"&gt;Postman&lt;/a&gt; ou l'extension &lt;strong&gt;Thunder Client&lt;/strong&gt; dans VS Code.&lt;/li&gt;
&lt;/ol&gt;




&lt;h3&gt;
  
  
  🏗️ Étape 1 : Initialisation du Projet (Préparer la cuisine)
&lt;/h3&gt;

&lt;p&gt;Avant de lancer le feu, on doit préparer notre plan de travail. Ouvre ton terminal et tape ces commandes. C'est ici qu'on définit les règles du jeu :&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;&lt;span class="nb"&gt;mkdir &lt;/span&gt;gestion-presence-api &lt;span class="c"&gt;# Crée le dossier du projet&lt;/span&gt;
&lt;span class="nb"&gt;cd &lt;/span&gt;gestion-presence-api    &lt;span class="c"&gt;# Entre dans le dossier&lt;/span&gt;
npm init &lt;span class="nt"&gt;-y&lt;/span&gt;                &lt;span class="c"&gt;# Crée le fichier package.json (Ton carnet de recettes)&lt;/span&gt;

&lt;span class="c"&gt;# Installation des ingrédients principaux (Dépendances de production)&lt;/span&gt;
npm &lt;span class="nb"&gt;install &lt;/span&gt;express @prisma/client bcrypt jsonwebtoken

&lt;span class="c"&gt;# Installation des ustensiles (Dépendances de développement)&lt;/span&gt;
npm &lt;span class="nb"&gt;install&lt;/span&gt; &lt;span class="nt"&gt;-D&lt;/span&gt; prisma nodemon
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h4&gt;
  
  
  🥘 À quoi servent ces ingrédients ?
&lt;/h4&gt;

&lt;p&gt;Si on compare notre API à la préparation d'une &lt;strong&gt;Pâte de maïs (Foufou)&lt;/strong&gt;, voici le rôle de chaque outil :&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;  &lt;strong&gt;Express.js (Le Réchaud) :&lt;/strong&gt; C'est ton moteur. Sans lui, rien ne chauffe. Il reçoit les demandes des clients (ex: "Je veux la liste des élèves") et s'assure que la réponse arrive à bon port.&lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;Prisma &amp;amp; @prisma/client (Le Traducteur) :&lt;/strong&gt; Ta base de données parle le "SQL", mais toi tu parles le "JavaScript". Prisma est le traducteur magique qui te permet de commander tes ingrédients sans apprendre une langue complexe. C'est l'&lt;strong&gt;ORM&lt;/strong&gt; (Object-Relational Mapping).&lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;Bcrypt (Le Pilon de sécurité) :&lt;/strong&gt; Imagine que tu veuilles cacher une épice secrète. Avec Bcrypt, on "écrase" les mots de passe des coachs pour les transformer en une poudre illisible. Même si quelqu'un regarde dans ton garde-manger, il ne pourra jamais retrouver le mot de passe original. C'est le &lt;strong&gt;hachage&lt;/strong&gt;.&lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;JSON Web Token / JWT (Le Ticket de caisse) :&lt;/strong&gt; Une fois que le coach est connecté, on lui donne un ticket (le token). À chaque fois qu'il veut "faire l'appel", il montre ce ticket pour prouver qu'il a bien le droit d'être là.&lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;Nodemon (Le Commis de cuisine) :&lt;/strong&gt; Normalement, à chaque fois que tu changes un ingrédient dans ton code, tu dois éteindre et rallumer le réchaud. Nodemon le fait automatiquement pour toi dès que tu sauvegardes un fichier. Un gain de temps fou !&lt;/li&gt;
&lt;/ul&gt;

&lt;blockquote&gt;
&lt;p&gt;💡 &lt;strong&gt;Astuce de chef :&lt;/strong&gt; Ouvre ton fichier &lt;code&gt;package.json&lt;/code&gt; et ajoute la ligne &lt;code&gt;"type": "module",&lt;/code&gt;. Cela permet d'utiliser les commandes &lt;code&gt;import&lt;/code&gt; et &lt;code&gt;export&lt;/code&gt; exactement comme tu le faisais avec &lt;strong&gt;React&lt;/strong&gt;. On reste en terrain connu !&lt;/p&gt;
&lt;/blockquote&gt;




&lt;h3&gt;
  
  
  🗄️ Étape 2 : Le Schéma (Le Plan d'Architecte ou La Recette)
&lt;/h3&gt;

&lt;p&gt;Avant de toucher au code, on doit définir la structure de nos données. C'est ici qu'entre en scène &lt;strong&gt;Prisma&lt;/strong&gt;.&lt;/p&gt;

&lt;h4&gt;
  
  
  🤔 C'est quoi un ORM ?
&lt;/h4&gt;

&lt;p&gt;Imagine que tu cuisines pour un invité qui ne parle que SQL (le langage des bases de données), alors que toi tu ne parles que JavaScript. L'&lt;strong&gt;ORM (Object-Relational Mapping)&lt;/strong&gt; est ton interprète personnel. &lt;br&gt;
Au lieu d'écrire des requêtes complexes comme &lt;code&gt;SELECT * FROM Student WHERE id = ...&lt;/code&gt;, tu vas simplement écrire du JavaScript : &lt;code&gt;prisma.student.findUnique(...)&lt;/code&gt;. C'est plus propre, plus rapide et plus sûr !&lt;/p&gt;
&lt;h4&gt;
  
  
  🛡️ Un mot sur la sécurité et la doc
&lt;/h4&gt;

&lt;p&gt;Prisma est puissant, mais comme un couteau de chef, mal utilisé, il peut être dangereux. Une mauvaise configuration peut exposer tes données ou créer des failles (comme les injections SQL). &lt;br&gt;
👉 &lt;strong&gt;Ton premier réflexe de pro :&lt;/strong&gt; Lis la &lt;a href="https://www.prisma.io/docs" rel="noopener noreferrer"&gt;Documentation Officielle de Prisma&lt;/a&gt;. C'est ta bible. Prends le temps de comprendre comment les relations fonctionnent pour construire des applications robustes.&lt;/p&gt;
&lt;h4&gt;
  
  
  🆔 Pourquoi utiliser des CUID au lieu de chiffres (1, 2, 3) ?
&lt;/h4&gt;

&lt;p&gt;Dans notre centre de formation, on utilise des &lt;strong&gt;CUID&lt;/strong&gt; (ex: &lt;code&gt;clh1abc...&lt;/code&gt;). Pourquoi ?&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Sécurité :&lt;/strong&gt; Si ton ID est &lt;code&gt;1&lt;/code&gt;, n'importe qui peut deviner que l'étudiant suivant est le &lt;code&gt;2&lt;/code&gt; et tenter d'accéder à ses infos. Avec un CUID, c'est impossible à deviner.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Évolutivité :&lt;/strong&gt; C'est beaucoup plus pratique quand on commence à avoir des milliers de données réparties partout.&lt;/li&gt;
&lt;/ol&gt;


&lt;h4&gt;
  
  
  🏗️ Mise en place
&lt;/h4&gt;

&lt;p&gt;Initialise Prisma dans ton projet :&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;npx prisma init
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Ouvre le fichier &lt;code&gt;prisma/schema.prisma&lt;/code&gt; qui vient d'apparaître et remplace tout par notre "recette" :&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;datasource db {
  provider = "postgresql"
  url      = env("DATABASE_URL")
}

generator client {
  provider = "prisma-client-js"
}

// 🏫 Le programme (Web Dev, Marketing, etc.)
model Program {
  id        String    @id @default(cuid())
  name      String    @unique
  coaches   Coach[]
  students  Student[]
}

// 👨‍🏫 Le Coach (Il gère un programme)
model Coach {
  id        String   @id @default(cuid())
  name      String
  email     String   @unique
  password  String   // Chut ! Ce sera haché !
  program   Program  @relation(fields: [programId], references: [id])
  programId String
}

// 🧑‍🎓 L'Apprenant
model Student {
  id        String   @id @default(cuid())
  name      String
  program   Program  @relation(fields: [programId], references: [id])
  programId String
  attendances Attendance[]
}

// 📝 La feuille d'appel (Présence)
model Attendance {
  id        String   @id @default(cuid())
  date      DateTime @default(now())
  isPresent Boolean  @default(false)
  student   Student  @relation(fields: [studentId], references: [id])
  studentId String
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h4&gt;
  
  
  🚀 Action !
&lt;/h4&gt;

&lt;ol&gt;
&lt;li&gt;Crée une base de données vide (appelée &lt;code&gt;presence_db&lt;/code&gt;) dans ton logiciel Postgres (ou via &lt;code&gt;pgAdmin&lt;/code&gt;).&lt;/li&gt;
&lt;li&gt;Dans ton fichier &lt;code&gt;.env&lt;/code&gt;, mets à jour l'URL : &lt;code&gt;DATABASE_URL="postgresql://USER:PASSWORD@localhost:5432/presence_db?schema=public"&lt;/code&gt;. Remplace USER par le nom d'utiliseur que tu as créé avec ta base de données, même choses pour PASSWRD&lt;/li&gt;
&lt;li&gt;Envoie ce plan à ta base de données pour créer les tables :
&lt;/li&gt;
&lt;/ol&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;npx prisma migrate dev &lt;span class="nt"&gt;--name&lt;/span&gt; init_db
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;em&gt;Cette commande génère aussi le "Prisma Client", l'outil qui te permettra de manipuler ces données en JS !&lt;/em&gt;&lt;/p&gt;




&lt;h3&gt;
  
  
  📂 Étape 3 : L'Architecture MVC (Organises ta cuisine)
&lt;/h3&gt;

&lt;p&gt;Imagine que tu prépares le foufou : si le sac de farine est sous le lit, l'eau dans le garage et le réchaud au salon, tu vas perdre un temps fou et ta cuisine sera un désordre total. C’est ce qu’on appelle le &lt;strong&gt;"Code Spaghetti"&lt;/strong&gt; : un mélange emmêlé où plus personne ne s'y retrouve.&lt;/p&gt;

&lt;p&gt;Pour éviter cela, on utilise une &lt;strong&gt;Architecture&lt;/strong&gt;. C'est le plan de rangement de ton logiciel.&lt;/p&gt;

&lt;h4&gt;
  
  
  🏰 Pourquoi MVC ?
&lt;/h4&gt;

&lt;p&gt;Il existe plusieurs façons d'organiser un projet (on appelle ça des &lt;em&gt;Design Patterns&lt;/em&gt;) :&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;  &lt;strong&gt;Les Microservices :&lt;/strong&gt; On sépare chaque fonction dans des mini-serveurs différents (très puissant mais très complexe).&lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;La Clean Architecture :&lt;/strong&gt; On crée des couches ultra-étanches pour que le code soit indépendant de tout (très rigoureux, mais lourd pour débuter).&lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;Le MVC (Modèle-Vue-Contrôleur) :&lt;/strong&gt; C'est le standard de l'industrie pour les applications web. C'est l'équilibre parfait entre simplicité et propreté. &lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Pourquoi on le choisit ?&lt;/strong&gt; Parce qu'il sépare les responsabilités : celui qui gère les données (le garde-manger) ne doit pas être celui qui décide des chemins (le serveur de salle).&lt;/p&gt;

&lt;h4&gt;
  
  
  🏗️ Notre structure de fichiers
&lt;/h4&gt;

&lt;p&gt;Crée les dossiers suivants dans ton dossier &lt;code&gt;src/&lt;/code&gt;. Voici comment on va répartir les tâches :&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;  &lt;strong&gt;&lt;code&gt;lib/&lt;/code&gt; (Le placard à outils) :&lt;/strong&gt; Contient la configuration de &lt;strong&gt;Prisma&lt;/strong&gt;. C'est ici qu'on prépare notre connexion à la base de données pour qu'elle soit prête à l'emploi.&lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;&lt;code&gt;routes/&lt;/code&gt; (Le Menu/Le Serveur de salle) :&lt;/strong&gt; C'est ici qu'on définit les URLs (ex: &lt;code&gt;/api/students&lt;/code&gt;). Son seul rôle est de prendre la commande du client et de la passer au bon chef.&lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;&lt;code&gt;controllers/&lt;/code&gt; (Le Chef de cuisine) :&lt;/strong&gt; C'est le cerveau ! C'est ici que réside la &lt;strong&gt;logique métier&lt;/strong&gt;. Le chef reçoit la commande, vérifie les ingrédients dans la base de données, prépare le plat et le renvoie.&lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;&lt;code&gt;middlewares/&lt;/code&gt; (Le Vigile à l'entrée) :&lt;/strong&gt; Avant d'entrer en cuisine, on vérifie si tu as ton badge (&lt;strong&gt;JWT&lt;/strong&gt;). Si tu n'es pas un coach autorisé, le vigile te bloque ici.&lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;&lt;code&gt;index.js&lt;/code&gt; (La Porte principale) :&lt;/strong&gt; C'est le point d'entrée. C'est lui qui allume le réchaud et lance le serveur.&lt;/li&gt;
&lt;/ul&gt;




&lt;h3&gt;
  
  
  ⚙️ Création du client Prisma (&lt;code&gt;src/lib/prisma.js&lt;/code&gt;)
&lt;/h3&gt;

&lt;p&gt;Dans notre cuisine, on veut une seule instance de Prisma pour tout le monde (on appelle ça un &lt;em&gt;Singleton&lt;/em&gt;). Cela évite de saturer ta base de données avec trop de connexions ouvertes.&lt;/p&gt;

&lt;p&gt;Crée le fichier &lt;code&gt;src/lib/prisma.js&lt;/code&gt; :&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;PrismaClient&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;@prisma/client&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

&lt;span class="c1"&gt;// On crée l'instance qui nous permettra de parler à la DB&lt;/span&gt;
&lt;span class="k"&gt;export&lt;/span&gt; &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;prisma&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nc"&gt;PrismaClient&lt;/span&gt;&lt;span class="p"&gt;();&lt;/span&gt;

&lt;span class="c1"&gt;// C'est cet objet "prisma" qu'on importera dans nos contrôleurs &lt;/span&gt;
&lt;span class="c1"&gt;// pour faire nos opérations CRUD (Create, Read, Update, Delete)&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;






&lt;p&gt;&lt;em&gt;Avec cette structure, ton code est "pro", facile à tester et surtout, facile à maintenir. Si tu as un bug sur une URL, tu sais qu'il faut regarder dans &lt;code&gt;routes/&lt;/code&gt;. Si le calcul de présence est faux, tu vas dans &lt;code&gt;controllers/&lt;/code&gt; !&lt;/em&gt;&lt;/p&gt;




&lt;h3&gt;
  
  
  🔐 Étape 4 : L'Authentification (Le Badge d'accès du Coach)
&lt;/h3&gt;

&lt;p&gt;Dans notre centre de formation, n'importe qui ne peut pas entrer en cuisine pour modifier la liste des élèves ou faire l'appel. Seuls les &lt;strong&gt;Coachs&lt;/strong&gt; ont ce droit. Pour cela, on a besoin de deux choses :&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt; &lt;strong&gt;Le Hachage&lt;/strong&gt; : Pour ne jamais stocker les mots de passe en clair (sécurité maximale).&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;Le JWT (Token)&lt;/strong&gt; : C'est le fameux "badge" que le coach porte après s'être connecté.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Imagine que le mot de passe du coach soit un &lt;strong&gt;piment entier&lt;/strong&gt;. Si quelqu'un vole ton garde-manger, il voit le piment. Le &lt;strong&gt;hachage (Bcrypt)&lt;/strong&gt;, c'est comme passer ce piment au mixeur avec d'autres ingrédients pour en faire une sauce très forte. On peut goûter la sauce pour vérifier que c'est bien le bon piment, mais il est &lt;strong&gt;impossible&lt;/strong&gt; de reconstruire le piment original à partir de la sauce. C'est ça, la magie du hachage !&lt;/p&gt;

&lt;h4&gt;
  
  
  🧑‍🍳 Le Contrôleur d'Authentification (&lt;code&gt;src/controllers/authController.js&lt;/code&gt;)
&lt;/h4&gt;

&lt;p&gt;Crée ce fichier. Il va contenir la logique pour &lt;strong&gt;Inscrire&lt;/strong&gt; un coach (Register) et le &lt;strong&gt;Connecter&lt;/strong&gt; (Login).&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="nx"&gt;bcrypt&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;bcrypt&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="nx"&gt;jwt&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;jsonwebtoken&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;prisma&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;../lib/prisma.js&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

&lt;span class="c1"&gt;// --- INSCRIPTION D'UN NOUVEAU COACH ---&lt;/span&gt;
&lt;span class="k"&gt;export&lt;/span&gt; &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;register&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;async &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;req&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;res&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="k"&gt;try&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;name&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;email&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;password&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;programId&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;req&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;body&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

    &lt;span class="c1"&gt;// 1. On "pilonne" le mot de passe (Hachage)&lt;/span&gt;
    &lt;span class="c1"&gt;// Le chiffre 10 est le "Salt" : plus il est élevé, plus le hachage est solide&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;hashedPassword&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;bcrypt&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;hash&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;password&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;10&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

    &lt;span class="c1"&gt;// 2. On enregistre le coach dans la base de données via Prisma&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;newCoach&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;prisma&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;coach&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;create&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt;
      &lt;span class="na"&gt;data&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
        &lt;span class="nx"&gt;name&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
        &lt;span class="nx"&gt;email&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
        &lt;span class="na"&gt;password&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;hashedPassword&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="c1"&gt;// On stocke la version "sauce", pas le piment !&lt;/span&gt;
        &lt;span class="nx"&gt;programId&lt;/span&gt; &lt;span class="c1"&gt;// Rappelle-toi, c'est un CUID (ex: clh1...)&lt;/span&gt;
      &lt;span class="p"&gt;}&lt;/span&gt;
    &lt;span class="p"&gt;});&lt;/span&gt;

    &lt;span class="c1"&gt;// 3. On renvoie le coach créé (sans son mot de passe par sécurité)&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="na"&gt;password&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;_&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="p"&gt;...&lt;/span&gt;&lt;span class="nx"&gt;coachWithoutPassword&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;newCoach&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
    &lt;span class="nx"&gt;res&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;status&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="mi"&gt;201&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nf"&gt;json&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;coachWithoutPassword&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

  &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;catch &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;error&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nx"&gt;res&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;status&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="mi"&gt;400&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nf"&gt;json&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt; &lt;span class="na"&gt;error&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;L'inscription a échoué. L'email est peut-être déjà utilisé.&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="p"&gt;});&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="p"&gt;};&lt;/span&gt;

&lt;span class="c1"&gt;// --- CONNEXION DU COACH (LOGIN) ---&lt;/span&gt;
&lt;span class="k"&gt;export&lt;/span&gt; &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;login&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;async &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;req&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;res&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="k"&gt;try&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;email&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;password&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;req&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;body&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

    &lt;span class="c1"&gt;// 1. On cherche le coach dans le garde-manger (DB) par son email&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;coach&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;prisma&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;coach&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;findUnique&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt; &lt;span class="na"&gt;where&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;email&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="p"&gt;});&lt;/span&gt;

    &lt;span class="k"&gt;if &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="o"&gt;!&lt;/span&gt;&lt;span class="nx"&gt;coach&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nx"&gt;res&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;status&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="mi"&gt;401&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nf"&gt;json&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt; &lt;span class="na"&gt;error&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Email ou mot de passe incorrect.&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="p"&gt;});&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;

    &lt;span class="c1"&gt;// 2. On compare le mot de passe reçu avec la sauce (hash) stockée&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;isPasswordValid&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;bcrypt&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;compare&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;password&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;coach&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;password&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

    &lt;span class="k"&gt;if &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="o"&gt;!&lt;/span&gt;&lt;span class="nx"&gt;isPasswordValid&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nx"&gt;res&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;status&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="mi"&gt;401&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nf"&gt;json&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt; &lt;span class="na"&gt;error&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Email ou mot de passe incorrect.&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="p"&gt;});&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;

    &lt;span class="c1"&gt;// 3. Si tout est bon, on fabrique le "Badge d'accès" (JWT)&lt;/span&gt;
    &lt;span class="c1"&gt;// Ce badge contient l'ID du coach et expire après 24h&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;token&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;jwt&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;sign&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;
      &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="na"&gt;coachId&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;coach&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;id&lt;/span&gt; &lt;span class="p"&gt;},&lt;/span&gt; 
      &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;VOTRE_CLE_SECRETE_SUPER_SECURISEE&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="c1"&gt;// À mettre dans ton .env plus tard !&lt;/span&gt;
      &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="na"&gt;expiresIn&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;24h&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt;
    &lt;span class="p"&gt;);&lt;/span&gt;

    &lt;span class="nx"&gt;res&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;json&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt;
      &lt;span class="na"&gt;message&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Connexion réussie ! Voici votre badge.&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
      &lt;span class="na"&gt;token&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;token&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
      &lt;span class="na"&gt;coach&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="na"&gt;id&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;coach&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;id&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="na"&gt;name&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;coach&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;name&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt;
    &lt;span class="p"&gt;});&lt;/span&gt;

  &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;catch &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;error&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nx"&gt;res&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;status&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="mi"&gt;500&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nf"&gt;json&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt; &lt;span class="na"&gt;error&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Erreur lors de la connexion.&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="p"&gt;});&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="p"&gt;};&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;






&lt;h3&gt;
  
  
  🧐 Ce qu'il faut retenir pour ta carrière :
&lt;/h3&gt;

&lt;ol&gt;
&lt;li&gt; &lt;strong&gt;Ne jamais stocker en clair&lt;/strong&gt; : Si tu vois &lt;code&gt;password: "123456"&lt;/code&gt; dans une base de données, c'est une faute grave. Utilise toujours &lt;strong&gt;Bcrypt&lt;/strong&gt;.&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;JWT est comme un ticket de cinéma&lt;/strong&gt; : Une fois que tu l'as, tu n'as plus besoin de redonner tes identifiants à chaque porte (route). Tu montres juste ton ticket.&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;Gestion des erreurs&lt;/strong&gt; : Remarque comment on utilise &lt;code&gt;try { ... } catch { ... }&lt;/code&gt;. En Backend, il faut toujours prévoir que la base de données puisse être indisponible ou qu'un email existe déjà. C'est ce qui différencie un développeur junior d'un pro !&lt;/li&gt;
&lt;/ol&gt;




&lt;h3&gt;
  
  
  📝 Étape 5 : Le CRUD des Apprenants (Gérer tes ingrédients)
&lt;/h3&gt;

&lt;p&gt;Le mot &lt;strong&gt;CRUD&lt;/strong&gt; est le pain quotidien du développeur Backend. C'est un acronyme qui résume les 4 actions de base que tu peux faire sur n'importe quelle donnée dans ton garde-manger (Base de données) :&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt; &lt;strong&gt;C&lt;/strong&gt;reate (Créer) : Ajouter un nouvel apprenant.&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;R&lt;/strong&gt;ead (Lire) : Afficher la liste ou les détails.&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;U&lt;/strong&gt;pdate (Modifier) : Changer le nom d'un apprenant.&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;D&lt;/strong&gt;elete (Supprimer) : Retirer un apprenant du centre.&lt;/li&gt;
&lt;/ol&gt;

&lt;h4&gt;
  
  
  🧑‍🍳 Le Chef en action (&lt;code&gt;src/controllers/studentController.js&lt;/code&gt;)
&lt;/h4&gt;

&lt;p&gt;Dans notre architecture &lt;strong&gt;MVC&lt;/strong&gt;, ce fichier est le &lt;strong&gt;Contrôleur&lt;/strong&gt;. Il reçoit la commande, demande à &lt;strong&gt;Prisma&lt;/strong&gt; (le commis) de chercher ou modifier les ingrédients, et renvoie le résultat au client.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;prisma&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;../lib/prisma.js&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

&lt;span class="cm"&gt;/**
 * LIRE (Read) : Récupérer tous les apprenants
 * C'est comme sortir tous les sacs de maïs pour vérifier le stock.
 */&lt;/span&gt;
&lt;span class="k"&gt;export&lt;/span&gt; &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;getStudents&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;async &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;req&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;res&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="k"&gt;try&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="c1"&gt;// On demande à Prisma de trouver tous les étudiants&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;students&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;prisma&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;student&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;findMany&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt;
      &lt;span class="na"&gt;include&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; 
        &lt;span class="na"&gt;program&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="kc"&gt;true&lt;/span&gt; &lt;span class="c1"&gt;// "Jointure" : On récupère aussi les détails du programme (Web Dev, etc.)&lt;/span&gt;
      &lt;span class="p"&gt;}&lt;/span&gt;
    &lt;span class="p"&gt;});&lt;/span&gt;

    &lt;span class="c1"&gt;// On renvoie la liste en format JSON (Le plat est servi !)&lt;/span&gt;
    &lt;span class="nx"&gt;res&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;json&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;students&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;catch &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;error&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nx"&gt;res&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;status&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="mi"&gt;500&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nf"&gt;json&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt; &lt;span class="na"&gt;error&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Impossible de récupérer les apprenants.&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="p"&gt;});&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="p"&gt;};&lt;/span&gt;

&lt;span class="cm"&gt;/**
 * CRÉER (Create) : Ajouter un nouvel apprenant
 * C'est comme ajouter un nouveau sac de semoule dans le placard.
 */&lt;/span&gt;
&lt;span class="k"&gt;export&lt;/span&gt; &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;createStudent&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;async &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;req&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;res&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="k"&gt;try&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="c1"&gt;// On récupère les données envoyées depuis le front-end (React)&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;name&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;programId&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;req&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;body&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

    &lt;span class="c1"&gt;// On utilise Prisma pour créer l'entrée dans PostgreSQL&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;newStudent&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;prisma&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;student&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;create&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt;
      &lt;span class="na"&gt;data&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; 
        &lt;span class="nx"&gt;name&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; 
        &lt;span class="nx"&gt;programId&lt;/span&gt; &lt;span class="c1"&gt;// On lie l'apprenant à un programme via son CUID&lt;/span&gt;
      &lt;span class="p"&gt;}&lt;/span&gt;
    &lt;span class="p"&gt;});&lt;/span&gt;

    &lt;span class="c1"&gt;// 201 : Code HTTP qui signifie "Créé avec succès !"&lt;/span&gt;
    &lt;span class="nx"&gt;res&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;status&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="mi"&gt;201&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nf"&gt;json&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;newStudent&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;catch &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;error&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nx"&gt;res&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;status&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="mi"&gt;400&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nf"&gt;json&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt; &lt;span class="na"&gt;error&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Erreur lors de la création. Vérifie l'ID du programme.&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="p"&gt;});&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="p"&gt;};&lt;/span&gt;

&lt;span class="cm"&gt;/**
 * MODIFIER (Update) : Mettre à jour les infos
 * Si on s'est trompé sur le nom de l'apprenant.
 */&lt;/span&gt;
&lt;span class="k"&gt;export&lt;/span&gt; &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;updateStudent&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;async &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;req&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;res&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="k"&gt;try&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;id&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;req&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;params&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt; &lt;span class="c1"&gt;// On récupère l'ID dans l'URL&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;name&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;req&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;body&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;updatedStudent&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;prisma&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;student&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;update&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt;
      &lt;span class="na"&gt;where&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;id&lt;/span&gt; &lt;span class="p"&gt;},&lt;/span&gt; &lt;span class="c1"&gt;// On cherche l'apprenant par son CUID unique&lt;/span&gt;
      &lt;span class="na"&gt;data&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;name&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt;
    &lt;span class="p"&gt;});&lt;/span&gt;

    &lt;span class="nx"&gt;res&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;json&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;updatedStudent&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;catch &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;error&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nx"&gt;res&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;status&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="mi"&gt;404&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nf"&gt;json&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt; &lt;span class="na"&gt;error&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Apprenant non trouvé.&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="p"&gt;});&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="p"&gt;};&lt;/span&gt;

&lt;span class="cm"&gt;/**
 * SUPPRIMER (Delete) : Retirer un apprenant
 * On vide l'assiette !
 */&lt;/span&gt;
&lt;span class="k"&gt;export&lt;/span&gt; &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;deleteStudent&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;async &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;req&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;res&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="k"&gt;try&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;id&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;req&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;params&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

    &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;prisma&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;student&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="k"&gt;delete&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt;
      &lt;span class="na"&gt;where&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;id&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt;
    &lt;span class="p"&gt;});&lt;/span&gt;

    &lt;span class="nx"&gt;res&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;json&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt; &lt;span class="na"&gt;message&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Apprenant supprimé avec succès.&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="p"&gt;});&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;catch &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;error&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nx"&gt;res&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;status&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="mi"&gt;404&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nf"&gt;json&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt; &lt;span class="na"&gt;error&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Impossible de supprimer. L'apprenant n'existe pas.&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="p"&gt;});&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="p"&gt;};&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;






&lt;h3&gt;
  
  
  🔥 Pourquoi c'est important d'être explicite ici ?
&lt;/h3&gt;

&lt;ol&gt;
&lt;li&gt; &lt;strong&gt;Le &lt;code&gt;try...catch&lt;/code&gt;&lt;/strong&gt; : En cuisine, on peut renverser de l'eau. En code, une base de données peut planter. Le &lt;code&gt;try...catch&lt;/code&gt; permet de "rattraper" l'erreur proprement au lieu de faire crash tout le restaurant (ton serveur).&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;Les codes de statut (res.status)&lt;/strong&gt; : 

&lt;ul&gt;
&lt;li&gt;  &lt;code&gt;200&lt;/code&gt; : OK (Tout va bien).&lt;/li&gt;
&lt;li&gt;  &lt;code&gt;201&lt;/code&gt; : Created (Nouveau plat créé).&lt;/li&gt;
&lt;li&gt;  &lt;code&gt;400&lt;/code&gt; : Bad Request (Tu as oublié un ingrédient dans ta demande).&lt;/li&gt;
&lt;li&gt;  &lt;code&gt;404&lt;/code&gt; : Not Found (Le plat ou l'étudiant n'existe pas).&lt;/li&gt;
&lt;li&gt;  &lt;code&gt;500&lt;/code&gt; : Server Error (Le réchaud a explosé).&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;L'inclusion (&lt;code&gt;include&lt;/code&gt;)&lt;/strong&gt; : C'est la force de Prisma. En une seule ligne, tu lies l'Apprenant à son Programme. En SQL pur, cela aurait nécessité une commande "JOIN" beaucoup plus complexe.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Félicitations ! Tu as maintenant un système complet pour gérer tes apprenants. Dans la prochaine étape, on va voir comment le &lt;strong&gt;Coach&lt;/strong&gt; peut utiliser ces fonctions pour "faire l'appel". 🚀&lt;/p&gt;




&lt;h3&gt;
  
  
  📢 Étape 6 : "Faire l'appel" (La fonctionnalité spéciale)
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Où met-on ce code ?&lt;/strong&gt;&lt;br&gt;
Puisque cette action concerne la présence, nous allons créer un nouveau fichier : &lt;code&gt;src/controllers/attendanceController.js&lt;/code&gt;. &lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Pourquoi un nouveau fichier ?&lt;/strong&gt; &lt;br&gt;
Dans une bonne architecture &lt;strong&gt;MVC&lt;/strong&gt;, on essaie de séparer les responsabilités. Un contrôleur pour les étudiants, un pour les coachs, et un pour les feuilles de présence. C'est plus propre !&lt;/p&gt;
&lt;h4&gt;
  
  
  📝 Le code commenté (&lt;code&gt;src/controllers/attendanceController.js&lt;/code&gt;) :
&lt;/h4&gt;


&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;prisma&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;../lib/prisma.js&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

&lt;span class="cm"&gt;/**
 * Faire l'appel : Enregistrer si un étudiant est présent ou absent.
 * Analogie : C'est comme si le Chef cochait une liste pour savoir 
 * quel ingrédient a été utilisé aujourd'hui.
 */&lt;/span&gt;
&lt;span class="k"&gt;export&lt;/span&gt; &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;takeAttendance&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;async &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;req&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;res&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="k"&gt;try&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="c1"&gt;// 1. On récupère les infos envoyées par le front (ID de l'étudiant et son état)&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;studentId&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;isPresent&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;req&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;body&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

    &lt;span class="c1"&gt;// 2. On utilise Prisma pour créer une nouvelle ligne dans la table Attendance&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;attendance&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;prisma&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;attendance&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;create&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt;
      &lt;span class="na"&gt;data&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
        &lt;span class="nx"&gt;studentId&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="c1"&gt;// Le CUID de l'étudiant (ex: "clh1...")&lt;/span&gt;
        &lt;span class="nx"&gt;isPresent&lt;/span&gt;  &lt;span class="c1"&gt;// true pour présent, false pour absent (un Boolean)&lt;/span&gt;
      &lt;span class="p"&gt;}&lt;/span&gt;
    &lt;span class="p"&gt;});&lt;/span&gt;

    &lt;span class="c1"&gt;// 3. On confirme que tout s'est bien passé&lt;/span&gt;
    &lt;span class="nx"&gt;res&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;json&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt; 
      &lt;span class="na"&gt;message&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Présence enregistrée avec succès !&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; 
      &lt;span class="nx"&gt;attendance&lt;/span&gt; 
    &lt;span class="p"&gt;});&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;catch &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;error&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="c1"&gt;// Si l'étudiant n'existe pas ou s'il y a un bug serveur&lt;/span&gt;
    &lt;span class="nx"&gt;res&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;status&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="mi"&gt;500&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nf"&gt;json&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt; &lt;span class="na"&gt;error&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Impossible d'enregistrer la présence.&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="p"&gt;});&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="p"&gt;};&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  🚦 Étape 7 : Les Routes (Le Serveur de salle)
&lt;/h3&gt;

&lt;p&gt;Imagine que ton API est un grand restaurant. &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;  Le &lt;strong&gt;Contrôleur&lt;/strong&gt;, c'est le &lt;strong&gt;Chef&lt;/strong&gt; en cuisine. Il sait &lt;em&gt;comment&lt;/em&gt; préparer le plat.&lt;/li&gt;
&lt;li&gt;  La &lt;strong&gt;Route&lt;/strong&gt;, c'est le &lt;strong&gt;Serveur&lt;/strong&gt; qui prend la commande. Il se tient à l'entrée et dit : "Si vous demandez le menu &lt;em&gt;Étudiants&lt;/em&gt;, je vais voir le Chef des étudiants. Si vous demandez la &lt;em&gt;Feuille d'appel&lt;/em&gt;, je vais voir le Chef de la présence."&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Sans les routes, personne ne peut communiquer avec tes chefs !&lt;/strong&gt;&lt;/p&gt;
&lt;h4&gt;
  
  
  🛤️ Configuration des routes (&lt;code&gt;src/routes/studentRoutes.js&lt;/code&gt;) :
&lt;/h4&gt;

&lt;p&gt;C'est ici qu'on associe une &lt;strong&gt;URL&lt;/strong&gt; et une &lt;strong&gt;Méthode HTTP&lt;/strong&gt; (GET, POST, etc.) à une fonction de notre contrôleur.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="nx"&gt;express&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;express&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="c1"&gt;// On importe les fonctions (logique) depuis le contrôleur&lt;/span&gt;
&lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;getStudents&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;createStudent&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;updateStudent&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;deleteStudent&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;../controllers/studentController.js&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;router&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;express&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nc"&gt;Router&lt;/span&gt;&lt;span class="p"&gt;();&lt;/span&gt;

&lt;span class="cm"&gt;/**
 * Le Routeur est comme un aiguillage de train.
 * Il regarde l'URL et la méthode, puis envoie la requête au bon endroit.
 */&lt;/span&gt;

&lt;span class="c1"&gt;// Si on reçoit une requête GET sur "/" (qui sera http://localhost:3000/api/students)&lt;/span&gt;
&lt;span class="nx"&gt;router&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;get&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;/&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;getStudents&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;  

&lt;span class="c1"&gt;// Si on reçoit une requête POST sur "/" pour créer un étudiant&lt;/span&gt;
&lt;span class="nx"&gt;router&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;post&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;/&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;createStudent&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt; 

&lt;span class="c1"&gt;// Si on reçoit une requête PUT avec un ID (ex: /api/students/clh1...) pour modifier&lt;/span&gt;
&lt;span class="nx"&gt;router&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;put&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;/:id&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;updateStudent&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

&lt;span class="c1"&gt;// Si on reçoit une requête DELETE avec un ID pour supprimer&lt;/span&gt;
&lt;span class="nx"&gt;router&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="k"&gt;delete&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;/:id&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;deleteStudent&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

&lt;span class="k"&gt;export&lt;/span&gt; &lt;span class="k"&gt;default&lt;/span&gt; &lt;span class="nx"&gt;router&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h4&gt;
  
  
  🏗️ Le point final : Assembler tout dans &lt;code&gt;src/index.js&lt;/code&gt;
&lt;/h4&gt;

&lt;p&gt;C'est le fichier principal. C'est ici qu'on dit à notre application Express d'utiliser les routes que nous venons de créer.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="nx"&gt;express&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;express&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="nx"&gt;studentRoutes&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;./routes/studentRoutes.js&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="c1"&gt;// (Imagine qu'on a aussi créé attendanceRoutes.js sur le même modèle)&lt;/span&gt;
&lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="nx"&gt;attendanceRoutes&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;./routes/attendanceRoutes.js&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;app&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;express&lt;/span&gt;&lt;span class="p"&gt;();&lt;/span&gt;

&lt;span class="c1"&gt;// Middleware pour permettre à Express de lire le JSON envoyé par React (très important !)&lt;/span&gt;
&lt;span class="nx"&gt;app&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;use&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;express&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;json&lt;/span&gt;&lt;span class="p"&gt;());&lt;/span&gt;

&lt;span class="cm"&gt;/**
 * On "monte" nos routes sur des préfixes.
 * Toutes les routes d'étudiants commenceront par /api/students
 */&lt;/span&gt;
&lt;span class="nx"&gt;app&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;use&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;/api/students&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;studentRoutes&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

&lt;span class="cm"&gt;/**
 * Toutes les routes de présence commenceront par /api/attendance
 */&lt;/span&gt;
&lt;span class="nx"&gt;app&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;use&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;/api/attendance&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;attendanceRoutes&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;PORT&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="mi"&gt;3000&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="nx"&gt;app&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;listen&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;PORT&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s2"&gt;`🚀 Le restaurant est ouvert sur http://localhost:&lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;PORT&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;`&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
  &lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s2"&gt;`📡 Prêt à recevoir les commandes !`&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;span class="p"&gt;});&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;






&lt;h3&gt;
  
  
  🔥 Résumé pour bien comprendre :
&lt;/h3&gt;

&lt;ol&gt;
&lt;li&gt; &lt;strong&gt;Le Client (React)&lt;/strong&gt; envoie une requête : &lt;code&gt;POST http://localhost:3000/api/students&lt;/code&gt;.&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;&lt;code&gt;index.js&lt;/code&gt;&lt;/strong&gt; voit passer la requête, reconnaît le préfixe &lt;code&gt;/api/students&lt;/code&gt; et l'envoie vers &lt;code&gt;studentRoutes.js&lt;/code&gt;.&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;&lt;code&gt;studentRoutes.js&lt;/code&gt;&lt;/strong&gt; voit que c'est une méthode &lt;code&gt;POST&lt;/code&gt; et appelle la fonction &lt;code&gt;createStudent&lt;/code&gt; dans le &lt;strong&gt;Contrôleur&lt;/strong&gt;.&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;&lt;code&gt;studentController.js&lt;/code&gt;&lt;/strong&gt; prend les données, demande à &lt;strong&gt;Prisma&lt;/strong&gt; de les enregistrer dans &lt;strong&gt;PostgreSQL&lt;/strong&gt;.&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;Prisma&lt;/strong&gt; répond "C'est fait !", et le &lt;strong&gt;Contrôleur&lt;/strong&gt; renvoie un message de succès (JSON) au client.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;strong&gt;La boucle est bouclée !&lt;/strong&gt; Tu as maintenant une architecture professionnelle, organisée et prête à évoluer. 🏆&lt;/p&gt;




&lt;h3&gt;
  
  
  🏆 Pourquoi cette approche est-elle "Pro" ?
&lt;/h3&gt;

&lt;p&gt;En terminant ce projet, tu n'as pas juste écrit du code, tu as construit une véritable &lt;strong&gt;infrastructure logicielle&lt;/strong&gt;. Voici pourquoi ton travail est de qualité professionnelle :&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt; &lt;strong&gt;L'Identifiant CUID :&lt;/strong&gt; Tes IDs ne sont plus de simples chiffres prévisibles (&lt;code&gt;1, 2, 3&lt;/code&gt;), mais des chaînes uniques et sécurisées (&lt;code&gt;ckjvw12340000...&lt;/code&gt;). C'est la norme pour éviter les fuites de données.&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;L'Architecture MVC :&lt;/strong&gt; Ta "cuisine" est parfaitement rangée. 

&lt;ul&gt;
&lt;li&gt;  Un bug sur une URL ? Direction &lt;code&gt;routes/&lt;/code&gt;. &lt;/li&gt;
&lt;li&gt;  Une erreur de calcul ou de logique ? Direction &lt;code&gt;controllers/&lt;/code&gt;. &lt;/li&gt;
&lt;li&gt;  Un problème de structure de données ? Direction le &lt;strong&gt;Modèle&lt;/strong&gt; (&lt;code&gt;schema.prisma&lt;/code&gt;).&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;Sécurité Maximale :&lt;/strong&gt; Grâce au &lt;strong&gt;hachage avec Bcrypt&lt;/strong&gt;, même si un petit malin accède à ta base de données, il ne verra jamais les mots de passe des coachs, seulement une suite de caractères indéchiffrables.&lt;/li&gt;
&lt;/ol&gt;




&lt;h3&gt;
  
  
  📂 Rappel de ton architecture (Ton plan de travail)
&lt;/h3&gt;

&lt;p&gt;Pour que tout fonctionne, ton dossier &lt;code&gt;src/&lt;/code&gt; doit ressembler à ça :&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;  &lt;code&gt;lib/prisma.js&lt;/code&gt; : Ta connexion unique à la base de données.&lt;/li&gt;
&lt;li&gt;  &lt;code&gt;controllers/&lt;/code&gt; : Tes "Chefs" (auth, students, attendance).&lt;/li&gt;
&lt;li&gt;  &lt;code&gt;routes/&lt;/code&gt; : Tes "Serveurs" qui dirigent les requêtes.&lt;/li&gt;
&lt;li&gt;  &lt;code&gt;index.js&lt;/code&gt; : Ton "Réchaud" qui lance tout le système.&lt;/li&gt;
&lt;/ul&gt;




&lt;h3&gt;
  
  
  🧪 À toi de jouer : Le test final avec Postman !
&lt;/h3&gt;

&lt;p&gt;Une API sans test, c'est comme un plat qu'on ne goûte pas avant de servir.&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt; &lt;strong&gt;Lance le feu :&lt;/strong&gt; &lt;code&gt;npx nodemon src/index.js&lt;/code&gt;.&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;Prépare le terrain :&lt;/strong&gt; Crée d'abord un &lt;strong&gt;Programme&lt;/strong&gt; (ex: "Développement Web") via une requête &lt;strong&gt;POST&lt;/strong&gt; sur &lt;code&gt;/api/programs&lt;/code&gt; (si tu as créé la route).&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;Inscris le Coach :&lt;/strong&gt; Fais un &lt;strong&gt;POST&lt;/strong&gt; sur &lt;code&gt;/api/auth/register&lt;/code&gt; avec l'ID du programme.&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;Ajoute les Apprenants :&lt;/strong&gt; Utilise l'ID du programme pour créer tes étudiants.&lt;/li&gt;
&lt;li&gt; &lt;strong&gt;Fais l'appel :&lt;/strong&gt; Utilise le contrôleur &lt;code&gt;takeAttendance&lt;/code&gt; pour marquer qui est là !&lt;/li&gt;
&lt;/ol&gt;




&lt;h3&gt;
  
  
  📚 Pour approfondir (Tes sources de savoir)
&lt;/h3&gt;

&lt;p&gt;Ne t'arrête pas en si bon chemin ! Pour devenir un véritable expert, dévore ces ressources :&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;  &lt;a href="https://www.prisma.io/docs" rel="noopener noreferrer"&gt;Documentation Officielle de Prisma&lt;/a&gt; : Indispensable pour maîtriser les relations complexes.&lt;/li&gt;
&lt;li&gt;  &lt;a href="https://developer.mozilla.org/fr/docs/Learn/Server-side/Express_Nodejs" rel="noopener noreferrer"&gt;MDN Web Docs - Express&lt;/a&gt; : La base pour comprendre le fonctionnement des serveurs.&lt;/li&gt;
&lt;li&gt;  &lt;a href="https://www.freecodecamp.org/learn/back-end-development-and-apis/" rel="noopener noreferrer"&gt;FreeCodeCamp (Backend Development)&lt;/a&gt; : Des exercices interactifs gratuits.&lt;/li&gt;
&lt;li&gt;  &lt;a href="https://grafikart.fr/" rel="noopener noreferrer"&gt;Grafikart.fr&lt;/a&gt; : D'excellents tutoriels vidéo en français sur Node.js et les ORM.&lt;/li&gt;
&lt;/ul&gt;




&lt;h3&gt;
  
  
  🚀 Prochaines étapes &amp;amp; Communauté
&lt;/h3&gt;

&lt;p&gt;Maintenant que tu as une API solide, les possibilités sont infinies :&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;  &lt;strong&gt;Validation :&lt;/strong&gt; Utilise une bibliothèque comme &lt;code&gt;Zod&lt;/code&gt; ou &lt;code&gt;Joi&lt;/code&gt; pour vérifier que les données reçues sont correctes avant de les envoyer à Prisma.&lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;Frontend :&lt;/strong&gt; Connecte ton application &lt;strong&gt;React&lt;/strong&gt; à cette API en utilisant &lt;code&gt;fetch&lt;/code&gt; ou &lt;code&gt;Axios&lt;/code&gt;.&lt;/li&gt;
&lt;li&gt;  &lt;strong&gt;Déploiement :&lt;/strong&gt; Apprends à mettre ta base de données en ligne (sur Supabase ou Render).&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Une question ? Un bug ? Une suggestion ?&lt;/strong&gt;&lt;br&gt;
N'hésite pas à proposer des améliorations ou des correctifs dans les &lt;strong&gt;commentaires&lt;/strong&gt; ! Si ce format vous plaît, je pourrais en faire une &lt;strong&gt;version vidéo&lt;/strong&gt; pour détailler chaque ligne de code en direct.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Dis-moi aussi en commentaire :&lt;/strong&gt; Quel sujet aimerais-tu que j'aborde dans le prochain article ? (La validation de données ? Le déploiement ? L'upload d'images ?).&lt;/p&gt;

&lt;p&gt;Bravo encore, tu viens de passer du côté puissant de la force : le &lt;strong&gt;Backend&lt;/strong&gt;. 🚀🍲&lt;/p&gt;

</description>
    </item>
    <item>
      <title>SUR LE CHEMIN DU HACKING ! Kali Academy, trois mois d’initiation 👺</title>
      <dc:creator>Tacite WAKILONGO</dc:creator>
      <pubDate>Fri, 14 Jun 2024 22:20:06 +0000</pubDate>
      <link>https://forem.com/kaliacad/sur-le-chemin-du-hacking-kali-academy-trois-mois-dinitiation-1k9m</link>
      <guid>https://forem.com/kaliacad/sur-le-chemin-du-hacking-kali-academy-trois-mois-dinitiation-1k9m</guid>
      <description>&lt;p&gt;Et oui 🙂 vous ne rêvez pas ! Je dis dis bien hacking ! Avant tout, mettons-nous d'accord sur la terminologie “Hacking”. Les médias nous ont menti sur le hacking, ils confondent le hacking au cracking. Richard Stallman, un fervent défenseur du logiciel libre et fondateur du mouvement du logiciel libre, définit un hacker comme quelqu'un qui aime jouer avec des systèmes, comprendre leur fonctionnement interne et les améliorer. Le hacking, dans ce contexte, est un acte de créativité, d'innovation et de résolution de problèmes, souvent associé à la programmation informatique. C’est une part de vérité, le hacking est bien plus que cette définition, il est en soi un état d’esprit, une manière de penser… Je vous conseille de lire cet ouvrage pour en savoir plus sur cette littérature : “Hackers and Painters: Big Ideas from the Computer Age” de Paul Graham.&lt;/p&gt;

&lt;h2&gt;
  
  
  Introduction
&lt;/h2&gt;

&lt;p&gt;Dans cet article, je vais vous parler du parcours que propose Kali Academy aux jeunes développeurs pour les initier au Hacking. Kali Academy est une académie qui vise à promouvoir les valeurs de l'open source dans les régions les moins représentées notamment en Afrique, voir &lt;a href="https://kaliacademy.org/" rel="noopener noreferrer"&gt;le site de Kali Academy&lt;/a&gt;. J’ai personnellement été parmi les 10 stagiaires retenus pour la cohorte 2024 et c’est fut une énorme opportunité pour ma carrière de développeur, je me sens dans l’obligation de partager avec cette expérience assez passionnante. Avant d’entrer dans le vif du sujet, je tiens a préciser que je ne me considère pas hacker, et je ne me considérerai jamais hacker, c’est la pertinence de mon travail qui pourra me procurer ce titre.&lt;/p&gt;

&lt;p&gt;Le parcours de stage chez Kali Academy est subdivisé en 3 parties : &lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;les fondamentaux&lt;/li&gt;
&lt;li&gt;la spécialisation Wikimédia et&lt;/li&gt;
&lt;li&gt;le projet de fin de stage.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Mais avant de décortiquer ce programme apparemment, commençons par nous poser les bonnes questions en guise de fondamentaux 🙂. Qui construit et entretient l'infrastructure numérique sur laquelle nous nous appuyons au quotidien ? Quels sont les défis et les obstacles rencontrés par ceux qui travaillent à la construction et à la maintenance de cette infrastructure ? Quelles sont les implications sociales, politiques et économiques de la manière dont l'infrastructure numérique est construite et gérée ? Comment les décisions prises en matière d'infrastructure numérique affectent-elles la vie quotidienne des gens ? Quels sont les modèles de financement et de gouvernance de l'infrastructure numérique, et comment peuvent-ils être améliorés ? Comment pouvons-nous garantir que l'infrastructure numérique reste ouverte, accessible et équitable pour tous ? Ces questions semblent peut-être basiques, mais elles poussent à une très grande réflexion si on y consacre un peu d'attention.&lt;/p&gt;

&lt;h2&gt;
  
  
  Sur quoi est basé notre infrastructure numérique ?
&lt;/h2&gt;

&lt;p&gt;Selon Nadia Eghba, dans son livre (essaie)  "Roads and Bridges: The Unseen Labor Behind Our Digital Infrastructure", il nous rappelle que toute notre infrastructure numérique est basée sur l’open source. Personnellement, lorsque j’ai lu ce passage, la première question je me suis demandé qui est derrière les projets open source, comment gagne-t-il sa vie…. C’est à ce moment que j'ai compris l’importance d’une contribution, même aussi petite soit-elle. Nous posons des questions sur des forums tels que stack overflow, mais est-ce qu’on se demande qui nous répond, ni même pourquoi il nous répond ? Nous lisons des articles sur ce site, et nous savons que leurs auteurs ne perçoivent rien comme droit d’auteur mais nous écrivent quand-même. C’est avec ces genres des questions qu’on devient hacker. Etes-vous toujours prêt à le devenir ? Si oui, demandes-toi quelle est ta part dans tout ça, combien de fois as-tu contribué dans un projet open source ou même partager publiquement et gratuitement tes connaissances ? L’open source ce n’est pas seulement dans l’informatique, la liberté d'être bien informé ne peut être garantie que si l’information est open source (souvenez-vous de l’affaire Wikileaks ayant conduit à l’arrestation de Julian Assange et Chelsea Manning), la connaissance ne peut-être universelle que si elle a été partagée (les brevets publiques) ! Voyons notre part dans tout ça, bien que minime soit-elle mais elle est là. C’est de cette manière que Kali Academy m’a amené à voir les choses, consacrer un peu de mon temps à faire découvrir aux autres ce que nous avons appris dans le but de faire évoluer la connaissance et de la démocratiser 🗽.&lt;/p&gt;

&lt;h2&gt;
  
  
  GNU/Linux, l'OS des Hackers
&lt;/h2&gt;

&lt;p&gt;Maintenant que nous avons découvert que toute notre infrastructure numérique est grandement basée sur de l’open source, rentrons dans le technique. GNU/Linux, savez-vous de quel animal s’agit-il ? 😂 On a souvent tendance à ne dire que Linux et laisser GNU, pourtant Linux n’est que le noyau. GNU est un projet de logiciel libre lancé par Richard Stallman en 1983. Le nom "GNU" est un acronyme récursif qui signifie "GNU's Not Unix", ce qui souligne que bien que GNU soit compatible avec Unix, il n'est pas dérivé de celui-ci. Le projet GNU a pour objectif de fournir un système d'exploitation libre, complet et cohérent composé entièrement de logiciels libres. GNU/Linux est le résultat de l'effort combiné de deux projets : le projet GNU, qui a fourni les outils et les utilitaires, et le noyau Linux, développé par Linus Torvalds. Cette collaboration a produit un système d'exploitation puissant, flexible et libre, qui a eu un impact significatif sur l'industrie informatique et la culture technologique mondiale. Dans mon parcours à Kali Academy, j’ai découvert qu’il est important pour un hackeur d’avoir une idée sur l'architecture d’un système d’exploitation, surtout GNU/Linux car il est open source, on peut se challenger à toucher dans son code et produire notre propre distribution, ce qui est du hacking au sens pur 🙂, ensuite il faut savoir l’installer sans assistance, manipuler bien la ligne de commande, construire des petits scripts bash, automatiser certaines tâches, manipuler l’environnement bureau…&lt;/p&gt;

&lt;h2&gt;
  
  
  Git, la collaboration facilitée
&lt;/h2&gt;

&lt;p&gt;Ensuite, il faut savoir très bien manipuler git, car c’est la base de la collaboration dans une équipe de développeurs, j’ai récemment commencé à publier une série d’article à sujet je vous invite à aller y jeter un coup d'œil. La plupart des plateformes collaboratives sont basées sur git. Git a pas mal évolué mais il reste intuitif de l’utiliser en CLI.&lt;/p&gt;

&lt;h2&gt;
  
  
  les licences opens sources, le droit en ingénierie
&lt;/h2&gt;

&lt;p&gt;Lorsque vous installez un logiciel open ou non, vous devez d'abord avoir accepter les termes de la licence. C’est un cas que vous avez déjà rencontré au moins une fois, mais si on n’est pas suffisamment informé, on néglige cette partie, ce qui nous amène à violer les licences. Pour moi, la plus grande victime c’est Microsoft, en tout cas dans le contexte de ma région, sur 1000 personnes que je connais, 900 utilisent Windows, et seulement 100 ont une licence, 50 l’ont payé et les autres ont des craques 😂. C'est triste, mais c’est ça la réalité, pourtant il y a un GNU/Linux gratuit et open source, le seul motif qu’on c’est que Linux est complexe, c’est qui une pure invention de ses concurrents. Cette situation a conduit Kali Academy à nous initier à la lecture des licences open source. Cette lecture nous a mis dans un grande confusion: un logiciel peut être open source mais pas libre, gratuit mais pas libre, libre mais avec une version payante, gratuit mais pas open source 😴. C’est embêtant non ! Mais ce qu’il faut retenir, c’est qu’une licence d'un logiciel est un contrat entre l'éditeur du logiciel et l'utilisateur qui définit les conditions d'utilisation du logiciel. Cette licence précise notamment si l'utilisateur est autorisé à installer le logiciel sur un ou plusieurs appareils, s'il peut le partager avec d'autres personnes, s'il peut le modifier, etc. En échange du respect de ces conditions, l'utilisateur est autorisé à utiliser le logiciel de manière légale.&lt;/p&gt;

&lt;p&gt;Voyons maintenant la différence entre un logiciel Open source et un logiciel libre.&lt;br&gt;
Les critères d'un logiciel libre, selon la Free Software Foundation (FSF, initiée par Richard Stallman) , sont les quatre libertés :&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Liberté d'exécution :
 Exemple de Licence : GNU General Public License (GPL)
 La GPL permet aux utilisateurs d'exécuter le programme pour 
 n'importe quel usage.&lt;/li&gt;
&lt;li&gt;Liberté d'étude :
 Exemple de Licence : GNU General Public License (GPL)
 La GPL garantit l'accès au code source, permettant aux utilisateurs 
 d'étudier et de modifier le programme.&lt;/li&gt;
&lt;li&gt;Liberté de redistribution :
 Exemple de Licence : GNU General Public License (GPL)
 La GPL permet aux utilisateurs de redistribuer des copies du 
 programme, que ce soit en version originale ou modifiée.&lt;/li&gt;
&lt;li&gt;Liberté de distribution des versions modifiées :
 Exemple de Licence : GNU General Public License (GPL)
 La GPL permet aux utilisateurs de distribuer des copies de leurs 
 versions modifiées, tout en conservant les mêmes libertés pour les 
 autres utilisateurs.
Les critères d'un logiciel open source, selon l'Open Source Initiative (OSI), incluent les éléments suivants :&lt;/li&gt;
&lt;li&gt;Libre redistribution :
 Exemple de Licence : MIT License
 La MIT License permet la distribution du logiciel sans restriction.&lt;/li&gt;
&lt;li&gt;Code source :
 Exemple de Licence : Apache License 2.0
 La licence Apache 2.0 exige que le code source soit disponible.&lt;/li&gt;
&lt;li&gt;Travaux dérivés :
 Exemple de Licence : BSD License
 La BSD License permet la modification et la distribution de travaux 
 dérivés sous les mêmes conditions.&lt;/li&gt;
&lt;li&gt;Intégrité du code source de l'auteur :
 Exemple de Licence : Mozilla Public License 2.0
 La MPL 2.0 permet les modifications tout en exigeant que les 
 fichiers modifiés soient redistribués sous la même licence.&lt;/li&gt;
&lt;li&gt;Pas de discrimination contre des personnes ou des groupes :
 Exemple de Licence : MIT License
 La MIT License ne discrimine personne.&lt;/li&gt;
&lt;li&gt;Pas de discrimination contre des domaines d'application :
 Exemple de Licence : Apache License 2.0
 La licence Apache 2.0 ne limite pas l'utilisation du logiciel à 
 certains domaines.&lt;/li&gt;
&lt;li&gt;Distribution de la licence :
 Exemple de Licence : GNU General Public License (GPL)
 La GPL assure que les droits sont transférés à tous les 
 destinataires du programme.&lt;/li&gt;
&lt;li&gt;Licence non spécifique à un produit :
 Exemple de Licence : BSD License
 La BSD License n'exige pas que le programme soit partie intégrante 
 d'un produit spécifique.&lt;/li&gt;
&lt;li&gt;Licence non restrictive pour d'autres logiciels :
 Exemple de Licence : Apache License 2.0
 La licence Apache 2.0 ne pose pas de restrictions sur les logiciels 
 distribués avec le programme.&lt;/li&gt;
&lt;li&gt;Licence technologiquement neutre :
 Exemple de Licence : MIT License
 La MIT License ne fait pas référence à une technologie spécifique.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Mais ce qu’il faut retenir c’est que tout logiciel libre est open source mais tout logiciel open source n’est pas libre, il y a aussi des gratuiciels (logiciel gratuit mais pas open source). Je vous recommande de mettre, en commentaire, des exemples d'applications ayant telle ou telle autre licence précitée.&lt;/p&gt;

&lt;h2&gt;
  
  
  Wikimédia, écosystème open source par excellence
&lt;/h2&gt;

&lt;p&gt;C’est dans cela que nous avons passé la majeure partie du premier mois, on avait autant d’ouvrages à consulter, des documentations à parcourir et des ateliers à suivre et parfois partager quand bien même on n’a pas bien assimilé la leçon, bref c'était très intense. Ces connaissances acquises ne pouvaient nous aider en rien si on n’avait pas une bonne communauté où les expérimenter. Il est bien d’avoir une houe, mais il encore mieux de l’essayer au champ 🙂, c’est pourquoi dans le deuxième moi de mon stage chez Kali Academy, nous nous sommes maintenant intéressés aux projets open source, nous avons d’abord cherché de nous même, je me souviens j’avais forké un repo de “awesome” où j’ai eu trop de mal à contribuer et mon PR n’avait même pas été validé, mais mon coach m’a consolé en disant “le plus important c’est que tu as réussi à cloner le projet, à runer le projet et à résoudre l’issue, peut importe que ton PR soit mergé ou pas”, et c'est une des leçons que je garde à cœur. Ensuite, Kali nous a proposé d’approcher l’écosystème Wikimédia qui est de nos jours un des plus grands projets open sources avec son MediaWiki qui est le moteur qui propulse Wikipédia et son projet frères ainsi que d’autres wiki. C’était comme une forte immersion arrivée soudainement. Nous avions d’abord participé à un événement de code que Wikimédia a choisi de nommer “Wishathon”, au cours duquel il fallait corriger quelques bogues et résoudre certains issues dans les projets ciblés dans l’écosystème, c’était très intenses pour nous étant donné que c’était une première fois de nous retrouver dans ces genres d’événement, encore que c’était un événement mondial, je m'étais retrouvé en train de travailler avec un turc aussi débutant que moi en Anglais 😂, mais c’était wow. Ensuite, pour comprendre un peu comment faire mes premières contributions sur Wikipédia, Wikidata, wiki Common …. j’ai postulé à une bourse de la fondation Moleskine laquelle m’a permis de suivre tout cela en seulement 5 séances intenses. J’ai appris à installer MediaWiki de différentes façons, à créer des thèmes, des extensions …. C’était vraiment chouette cette aventure. Ouf ! 😣J’ai oublié de vous révéler une petite confidence, au cours du Wishathon j’ai reçu un gift venu expressément des USA, c’était un moment très émouvant !&lt;/p&gt;

&lt;h2&gt;
  
  
  Initier un projet open source
&lt;/h2&gt;

&lt;p&gt;Normalement l’initiation à l’open source devrait s’achever là, mais Kali Academy a souhaité que nous puissions initier aussi des projets open source sur lesquels d’autres personnes vont aussi contribuer. Dans ce cadre, j’ai été mis dans une équipe où on était à trois, moi, mon ami que j’appelle toujours beau frère Firmin NGANDULI et le petit Christian BIREGO, un très bon geek. Ensemble, on a travaillé sur une application nommée LeaderBoard qui compare les contributions des bénévoles sur les projets Wikimédia et les classes en fonction du nombre des contributions. Voici le lien de l’application déployée &lt;a href="https://wikileaderboard.netlify.app/" rel="noopener noreferrer"&gt;ici&lt;/a&gt; et de la documentation &lt;a href="https://meta.wikimedia.org/wiki/Documentation_LeaderBoard" rel="noopener noreferrer"&gt;ici&lt;/a&gt;… Si vous êtes intéressé par ce projet, dites-le moi aussi en commentaire.&lt;/p&gt;

&lt;p&gt;En bref, c’est à ça qu'à ressemblé mon parcours de stage chez Kali Academy, c'était une expérience extrêmement passionnante, j’ai goûté un peu au code professionnel, à l’expertise des grands développeurs open source de Wikimédia… Je remercie Kali Academy pour m’avoir offert cette opportunité, malgré mon niveau et mes faiblesses, je remercie également tous mes collègues avec lesquels on a fait ce parcours ainsi que vous tous qui avez lu cet article jusqu’ici, je vous prie de me faire des corrections en privé s’il en y a 🙂. Ainsi commence mon parcours d’apprenti hacker, à nous revoir dans le future 🙂, étant déjà hackeur 😂&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>javascript</category>
      <category>beginners</category>
      <category>programming</category>
    </item>
    <item>
      <title>Git &amp; GitHub, de l'historique aux dépôts distants</title>
      <dc:creator>Tacite WAKILONGO</dc:creator>
      <pubDate>Tue, 11 Jun 2024 20:21:26 +0000</pubDate>
      <link>https://forem.com/kaliacad/git-github-de-lhistoriques-aux-depots-distants-31gd</link>
      <guid>https://forem.com/kaliacad/git-github-de-lhistoriques-aux-depots-distants-31gd</guid>
      <description>&lt;p&gt;Vous voulez gérer les versions de votre code et les conserver en un endroit sûr sur internet ? Vous voulez vous faciliter la collaboration avec votre équipe dans un projet de logiciel ? Voulez-vous montrer au monde entier comment vous êtes devenu un grand codeur ? Et oui 🙂, vous êtes au bon endroit ! Dans cette suite d’articles, nous allons découvrir ensemble c’est quoi “GitHub” et nous allons apprendre à le démystifier! Allons y c'est parti!&lt;/p&gt;

&lt;p&gt;Tout d’abord, Git, GitHub, GitLab ? c’est quoi ces gros mots ? D’où viennent-ils ? Ont-ils été créés pour vous impressionner et vous foutre hors du code ? Pas vraiment, au contraire ce sont vos grands compagnons dans votre aventure de développeur. Pour bien le comprendre, faisons un petit tour dans le passé.&lt;/p&gt;

&lt;p&gt;Dès les années 97, nos vaillants premiers développeurs utilisaient BitKeeper pour la gestion de versions. BitKeeper est un système de gestion de versions distribué, développé par BitMover Inc, fondée par Larry McVoy. Ce dernier est un ancien ingénieur de Sun Microsystems, il a conçu BitKeeper pour répondre aux besoins complexes de gestion de versions de grands projets logiciels. Notre génie Larry introduit plusieurs nouveautés qui vont faire le grand bonheur des développeurs de l’époque, notamment la gestion des versions distribuées qui permet à chaque développeur de travailler avec une copie complète de l'historique du projet; la fusion avancée, BitKeeper a développé des algorithmes sophistiqués pour la fusion de branches, ce qui facilite le travail parallèle des développeurs; la performance et la scalabilité, c’est chouette non 😀? Même si pour l'instant, ça parait encore une langue non comprise pour vous, lisez quand même, j'aurais aimé avoir toutes ces informations avant de me lancer sur git !&lt;/p&gt;

&lt;p&gt;En 2002, la communauté du noyau Linux adopte BitKeeper pour gérer le développement du noyau. Wow, c’est l'âge d’or de BitKeeper, il est utilisé par un des plus grands projets open-source au monde de l’époque, pour les développeurs, tout cela est oufs car BitKeeper offrait une version gratuite pour les développeurs open-source, mais avec des restrictions 🤗. En 2005, des différends concernant ces restrictions ont conduit BitMover à retirer la version gratuite, Linus Torvalds et sa communauté derrière le noyau Linux décident de créer un nouvel outil pour remplacer BitKeeper, conduisant à la création de Git. Voilà enfin le fameux Git, Torvalds a pris sa revanche avec un produit collaboratif incluant la distribution, la performance et la sécurité utilisant le hachage cryptographique SHA-1. BitKeeper va continuer d’exister comme produit commercial, mais devenus vétuste, en 2016, son équipe de développement va décider de le rendre open Source pour permettre à la jeune génération de l’expérimenter. Tout ceci est bien beau, mais où est GitHub dans tout ça 🤔?&lt;/p&gt;

&lt;p&gt;En 2008, 3 ambitieux, Tom Preston-Werner, Chris Wanstrath, PJ Hyett et Scott Chacon, inspirés par la success story de Mark Zuckerberg, s’élancent dans la construction d’un nouveau monde, le FaceBook des développeurs 😀! GitHub est né, accueilli comme le saint grâle ! Le succès est au rendez-vous, GitHub devient très vite la principale plateforme de collaboration et est directement adopté par plusieurs projets open source et devient une plateforme centrale dans l'écosystème du développement logiciel. En 2012, il atteint 1 million de dépôts. Le business s’invite là aussi au rendez-vous: Pour sa stratégie Cloud et Open Source, Microsoft, voulant aussi avoir accès aux 1 million d’utilisateurs GitHub, le 4 juin 2018 annonce acquérir GitHub pour une somme colossale de 7,5 milliards de dollars en actions Microsoft. L'annonce a suscité diverses réactions, certains développeurs étaient sceptiques quant à l'impact de cette acquisition sur la neutralité de GitHub, tandis que d'autres y voyaient une opportunité de bénéficier des ressources et de l'infrastructure de Microsoft. C’est parti nos 3 ambitieux s’en sortent milliardaires au prix de leur rêve de Facebook de développeurs, mais bon 7,5 milliards on n’en a pas tous les jours 😣.&lt;/p&gt;

&lt;p&gt;Pour rassurer les développeurs pris au piège entre optimisme et scepticisme, Microsoft a assuré que GitHub continuerait à fonctionner de manière indépendante, avec Nat Friedman (ancien CEO de Xamarin) nommé CEO de GitHub après l'acquisition, sous la propriété de Microsoft, GitHub a continué à soutenir et à promouvoir les projets open source. Microsoft lui-même est devenu un contributeur majeur aux projets open source sur GitHub. Microsoft a investi dans l'infrastructure de GitHub et a introduit de nouvelles fonctionnalités, comme GitHub Actions pour l'intégration continue et le déploiement continu (CI/CD). Les fonctionnalités clés de GitHub sont : &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Pull Requests&lt;/strong&gt; : Facilite les révisions de code et les contributions externes.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Issues&lt;/strong&gt; : Outil de suivi des bogues et des fonctionnalités.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Actions GitHub&lt;/strong&gt; : Intégration continue et déploiement continu (CI/CD).&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Pages GitHub&lt;/strong&gt; : Hébergement de sites web statiques directement depuis un dépôt GitHub.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Et GitLab alors ? 🤔 GitLab a été fondé en 2011 par Dmitriy Zaporozhets et Valery Sizov. Initialement un projet open-source, GitLab offre des fonctionnalités similaires à GitHub mais se distingue par ses options de déploiement auto-hébergées. Perçu comme une alternative à GitHub, de nos jours, GitLab est une plateforme complète de DevOps couvrant tout le cycle de vie du développement logiciel, de la gestion du code à la livraison et à la surveillance des applications. Ses principales fonctionnalités sont : &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Pipeline CI/CD : Intégration native pour tester et déployer automatiquement le code.&lt;/li&gt;
&lt;li&gt;Auto-hébergement : Les entreprises peuvent installer et gérer GitLab sur leurs propres serveurs.&lt;/li&gt;
&lt;li&gt;Cycle de vie complet : Supporte la gestion de projet, le contrôle des versions, l'intégration continue, le déploiement et la surveillance.&lt;/li&gt;
&lt;li&gt;Sécurité : Fonctionnalités avancées pour la gestion des permissions et la sécurité du code.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Nous avons découvert nos trois termes Git, GitHub et GitLab qui étaient jadis des concepts impénétrables. Nous allons expérimenter dans la deuxième partie de cette série d’articles consacrés à Gît la beauté de tout cela dans la pratique, prenez bien soins de vous, et retrouvons-nous dans la suite 👏&lt;/p&gt;

</description>
      <category>git</category>
      <category>github</category>
      <category>gitlab</category>
      <category>devops</category>
    </item>
    <item>
      <title>COMMENT RÉSOUDRE L’ERREUR 403 DE GIT ?</title>
      <dc:creator>Tacite WAKILONGO</dc:creator>
      <pubDate>Sat, 04 May 2024 10:11:41 +0000</pubDate>
      <link>https://forem.com/kaliacad/comment-resoudre-lerreur-403-git--1la4</link>
      <guid>https://forem.com/kaliacad/comment-resoudre-lerreur-403-git--1la4</guid>
      <description>&lt;p&gt;En tant que développeur, vous travaillez sûrement avec github, gitlab, gerrit ou une autre plateforme collaborative similaire pour pouvoir envoyer vos modifications à vos collaborateurs ou pour voir les leurs. Un beau jour, vous décidez de changer de machine pour une raison que toi-même connais! Vous devez tout configurer de nouveau en commençant par votre environnement de développement, et bien sûr git. Mais vous vous rendez compte que malgré vous avez changé les identifiants reliés à git, vous n’avez pas d’autorisation pour vous écouter même à vos propres dépôts distants; lorsque vous creusez un peu, vous trouvez que vous faites face à l'erreur 403 de git ! Qu’est-ce ? Comment le résoudre ? Vous êtes au bon endroit, c’est l’objet de cet article.&lt;/p&gt;

&lt;h2&gt;
  
  
  C'est quoi l'erreur 403 ?
&lt;/h2&gt;

&lt;p&gt;Pour faire simple, l’erreur 403 dans Git est généralement liée à des problèmes d’autorisation lors de l’accès à un dépôt distant.&lt;/p&gt;

&lt;h2&gt;
  
  
  Comment le résoudre ?
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;Sur Windows&lt;/strong&gt; &lt;/p&gt;

&lt;p&gt;Voici quelques étapes pour résoudre cette erreur sous Windows :&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Vérifiez vos informations d’identification:&lt;/li&gt;
&lt;/ol&gt;

&lt;ul&gt;
&lt;li&gt;Ouvrez le Gestionnaire d’informations d’identification Windows.&lt;/li&gt;
&lt;li&gt;Recherchez les informations d’identification liées à GitHub et supprimez-les si nécessaire.&lt;/li&gt;
&lt;li&gt;Vérifiez vos paramètres Git :&lt;/li&gt;
&lt;li&gt;Exécutez la commande : &lt;code&gt;git config user.name&lt;/code&gt; pour vérifier votre nom d’utilisateur.&lt;/li&gt;
&lt;li&gt;Exécutez la commande &lt;code&gt;git config user.email&lt;/code&gt; pour vérifier votre adresse e-mail.&lt;/li&gt;
&lt;li&gt;Assurez-vous que vos paramètres sont corrects et que les modifications sont bien prises en compte.&lt;/li&gt;
&lt;li&gt;Vérifiez le gestionnaire d’informations d’identification :&lt;/li&gt;
&lt;li&gt;Exécutez la commande &lt;code&gt;git config credential.helper&lt;/code&gt; pour connaître le gestionnaire d’informations d’identification utilisé (par exemple, &lt;strong&gt;Windows Credential Managers&lt;/strong&gt;).&lt;/li&gt;
&lt;li&gt;Si vous avez activé la double authentification (2FA) sur GitHub, vous devrez utiliser un jeton d’accès personnel (PAT) au lieu de votre mot de passe.&lt;/li&gt;
&lt;li&gt;Vérifiez le fichier de configuration du dépôt :&lt;/li&gt;
&lt;li&gt;Modifiez le fichier &lt;em&gt;.git/config&lt;/em&gt; dans votre répertoire de travail.&lt;/li&gt;
&lt;li&gt;Recherchez l’entrée &lt;code&gt;url=&lt;/code&gt;sous la section &lt;code&gt;[remote "origin"]&lt;/code&gt;.
Changez-la de &lt;code&gt;url=[^3^][8] à url=[^4^][9]&lt;/code&gt;, en remplaçant _USERNAME_par votre nom d’utilisateur GitHub.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Sur GNU linux&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Pour résoudre l’erreur 403 de Git sur Linux, qui est souvent due à un problème d’authentification, voici quelques étapes supplémentaires que vous pouvez suivre :&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Vérifiez l’accès au dépôt : Assurez-vous que vous avez le niveau d’accès requis pour effectuer l’opération souhaitée. Si quelqu’un d’autre vous a ajouté au dépôt, vérifiez qu’il vous a accordé les permissions nécessaires.&lt;/li&gt;
&lt;li&gt;Supprimez les identifiants enregistrés : Si Git a mémorisé des identifiants incorrects, vous pouvez les supprimer. Sur Linux, cela peut être fait en supprimant les entrées correspondantes dans le fichier &lt;em&gt;~/.git-credentials&lt;/em&gt; ou en utilisant la commande &lt;code&gt;git credential-cache exit&lt;/code&gt; si vous utilisez le cache des identifiants.&lt;/li&gt;
&lt;li&gt;Utilisez un jeton d’accès personnel (PAT) : Si l’authentification par mot de passe a été désactivée en faveur des PAT, vous devrez en générer un via les paramètres de votre compte sur la plateforme de gestion de version (comme GitHub ou Bitbucket) et l’utiliser à la place du mot de passe.&lt;/li&gt;
&lt;li&gt;Changez de méthode d’authentification : Si vous utilisez HTTPS et que vous rencontrez des problèmes, vous pouvez essayer d’utiliser SSH, ou vice versa. Pour SSH, assurez-vous que votre clé publique est ajoutée à votre compte sur la plateforme de gestion de version.&lt;/li&gt;
&lt;li&gt;Configurez le proxy : Si vous êtes derrière un proxy, vous devrez peut-être configurer Git pour utiliser ce proxy avec la commande &lt;code&gt;git config --global http.proxy proxy_url&lt;/code&gt;.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;En suivant ces étapes, vous devriez pouvoir résoudre l’erreur 403 sur votre machine. Si le problème persiste, il peut être utile de consulter la documentation de la plateforme de gestion de version que vous utilisez ou de demander de l’aide à l’administrateur du dépôt. Si vous avez lu jusqu'ici, c'est que l'article vous a été utile, ne manquez pas de faire part de vos impressions en commentaire, cela m'aidera à améliorer.&lt;/p&gt;

</description>
    </item>
    <item>
      <title>Comment faire sa première contribution dans le monde de l’Open Source</title>
      <dc:creator>Tacite WAKILONGO</dc:creator>
      <pubDate>Mon, 15 Apr 2024 20:27:56 +0000</pubDate>
      <link>https://forem.com/kaliacad/comment-faire-sa-premiere-contribution-dans-le-monde-de-lopen-source-3ih3</link>
      <guid>https://forem.com/kaliacad/comment-faire-sa-premiere-contribution-dans-le-monde-de-lopen-source-3ih3</guid>
      <description>&lt;p&gt;L’Open Source est un univers fascinant où le partage et la collaboration sont les clés de l’innovation et de l’amélioration continue. Contribuer à l’Open Source peut sembler intimidant au début, mais c’est une expérience enrichissante qui peut vous aider à développer vos compétences, à vous connecter avec d’autres développeurs et à apporter une contribution significative à la communauté. Voici un guide étape par étape pour faire votre première contribution.&lt;/p&gt;

&lt;h2&gt;
  
  
  Étape 1: Choisissez un Projet qui Vous Passionne
&lt;/h2&gt;

&lt;p&gt;La première étape est de trouver un projet qui vous intéresse. Vous pouvez commencer par explorer des sites comme GitHub, GitLab ou Bitbucket pour découvrir des projets qui correspondent à vos intérêts et à vos compétences.&lt;/p&gt;

&lt;h2&gt;
  
  
  Étape 2: Comprenez le Projet
&lt;/h2&gt;

&lt;p&gt;Prenez le temps de comprendre le projet. Lisez la documentation, les issues ouvertes, et essayez d’utiliser le logiciel pour vous familiariser avec celui-ci. Cela vous aidera à identifier où vous pourriez apporter votre aide.&lt;/p&gt;

&lt;h2&gt;
  
  
  Étape 3: Communiquez avec la Communauté
&lt;/h2&gt;

&lt;p&gt;Avant de contribuer, il est important de se connecter avec la communauté. Rejoignez les canaux de communication du projet, tels que les forums, les listes de diffusion ou les chats Slack/Discord. Posez des questions, présentez vous et exprimez votre désir de contribuer.&lt;/p&gt;

&lt;h2&gt;
  
  
  Étape 4: Trouvez une Tâche
&lt;/h2&gt;

&lt;p&gt;Cherchez des tâches adaptées aux débutants ou des bugs faciles à corriger. Les projets Open Source utilisent souvent des balises comme “good first issue” ou “help wanted” pour indiquer les tâches appropriées pour les nouveaux contributeurs.&lt;/p&gt;

&lt;h2&gt;
  
  
  Étape 5: Installez l’Environnement de Développement
&lt;/h2&gt;

&lt;p&gt;Configurez votre environnement de développement local en suivant les instructions du projet. Assurez-vous de pouvoir exécuter le projet et de comprendre le processus de build et de test.&lt;/p&gt;

&lt;h2&gt;
  
  
  Étape 6: Faites Votre Première Contribution
&lt;/h2&gt;

&lt;p&gt;Une fois que vous avez choisi une tâche, créez une fork du projet et commencez à travailler sur votre contribution. Respectez les conventions de codage et les directives de contribution du projet.&lt;/p&gt;

&lt;h2&gt;
  
  
  Étape 7: Soumettez Votre Contribution
&lt;/h2&gt;

&lt;p&gt;Après avoir terminé votre travail, soumettez une pull request (PR) au projet principal. Décrivez clairement ce que vous avez fait et pourquoi. Attendez les retours des mainteneurs du projet et soyez prêt à faire des modifications si nécessaire.&lt;/p&gt;

&lt;h2&gt;
  
  
  Étape 8: Apprenez de l’Expérience
&lt;/h2&gt;

&lt;p&gt;Peu importe l’issue de votre PR, prenez le temps de réfléchir à l’expérience. Qu’avez-vous appris ? Comment pouvez-vous améliorer vos futures contributions ? La rétroaction est un cadeau précieux dans l’Open Source.&lt;/p&gt;

&lt;h2&gt;
  
  
  Conclusion
&lt;/h2&gt;

&lt;p&gt;Faire votre première contribution à l’Open Source est le début d’un voyage d’apprentissage continu. Chaque contribution compte, et avec le temps, vous pourriez même devenir un mainteneur de projet. Alors, lancez-vous et rejoignez la révolution Open Source !&lt;br&gt;
N’oubliez pas, l’Open Source est autant une question de communauté que de code. Votre première contribution est une étape importante pour devenir un membre actif de cette communauté mondiale. Bonne chance !&lt;br&gt;
Vous pouvez aussi lire : &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://www.freecodecamp.org/news/how-to-contribute-to-open-source-projects-beginners-guide/" rel="noopener noreferrer"&gt;freecodecamp : how-to-contribute-to-open-source-projects-beginners-guide&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://dev.to/surajondev/beginners-guide-to-starting-your-open-source-journey-1bgb"&gt;dev.to : beginners-guide-to-starting-your-open-source-journey-1bgb&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.upgrad.com/blog/open-source-projects-for-beginners/" rel="noopener noreferrer"&gt;upgrqde : open-source-projects-for-beginners&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://docs.github.com/en/get-started/exploring-projects-on-github/finding-ways-to-contribute-to-open-source-on-github" rel="noopener noreferrer"&gt;github : finding-ways-to-contribute-to-open-source-on-github&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://daily.dev/blog/how-to-start-contributing-to-open-source-projects" rel="noopener noreferrer"&gt;dqily.dev : how-to-start-contributing-to-open-source-projects&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

</description>
    </item>
    <item>
      <title>Comment sécuriser son compte Facebook ?</title>
      <dc:creator>Tacite WAKILONGO</dc:creator>
      <pubDate>Tue, 02 Apr 2024 11:41:25 +0000</pubDate>
      <link>https://forem.com/tacite243/comment-securiser-de-son-compte-facebook--4gmg</link>
      <guid>https://forem.com/tacite243/comment-securiser-de-son-compte-facebook--4gmg</guid>
      <description>&lt;p&gt;&lt;a href="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fa27arp97pi65aldvl5h4.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fa27arp97pi65aldvl5h4.png" alt="Image description" width="800" height="400"&gt;&lt;/a&gt;Avec ses 2,91 milliards d'utilisateurs actifs, Facebook est le réseau social le plus utilisé. On estime qu'une personne y passe en moyenne 33 minutes par jour, ce qui génère un trafic mensuel de plus de 4,5 milliards de publications aimées, commentées ou partagées, des revenus publicitaires atteignant plus de 32,6 milliards USD au quatrième trimestre 2022. L'age moyen de ses utilisateurs est de 27 ans dont 56% sont des hommes. Sources : Statista, Hooksuite et Facebook.&lt;/p&gt;

&lt;p&gt;Avec un tel succès, les utilisateurs de Facebook ne sont pas à l'abri des pirates informatiques qui, jour et nuit, cherchent à découvrir les nouvelles façons de nuire aux internautes pour des raisons diverses.&lt;/p&gt;

&lt;h2&gt;
  
  
  Pourquoi sécuriser son compte Facebook ?
&lt;/h2&gt;

&lt;p&gt;La sécurité de votre compte Facebook est essentielle pour plusieurs raisons, il est crucial de la prendre au sérieux. Voici quelques unes des raisons pour lesquelles vous devez sécuriser votre compte Facebook :&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Prévenir le piratage&lt;/strong&gt; : En sécurisant votre compte, vous réduisez les risques de piratage par des individus malveillants.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Protéger vos données personnelles&lt;/strong&gt; : Votre compte contient des informations sensibles telles que vos photos, messages et coordonnées; sa sécurisation empêche aux individus malveillants d'y accéder sans autorisation.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Préserver votre vie privée&lt;/strong&gt; : En contrôlant l’accès à votre compte, vous protégez votre vie privée en ligne. Lorsqu'un inconnu accède sans autorisation sur votre compte, votre vie privée est compromise. Il peut voir du contenu que vous n'avez pas rendu public, lire vos messages sensibles...&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Maintenir votre réputation&lt;/strong&gt; : Un compte compromis peut entraîner des publications indésirables ou des activités suspectes, nuisant à votre réputation.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Prévenir l’usurpation d’identité&lt;/strong&gt; : Les pirates peuvent se faire passer pour vous et causer des problèmes en utilisant votre compte. En utilisant votre compte, on peut accéder à tout les sites et applications liés à votre compte Facebook sans autorisation, ce qui peut vous porter préjudice dans le cas d'une utilisation malveillante.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Pourquoi les pirates chercheraient à contrôler votre compte Facebook ?
&lt;/h2&gt;

&lt;p&gt;Les pirates ont différentes raisons de chercher à prendre le contrôle de votre compte allant de l'espionnage au chantage, ou bien une simple curiosité de se challenger. Voici quelques unes des motivations qui pourraient inciter à pirater votre compte :&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Vol d’informations personnelles : Ils cherchent à accéder à vos données confidentielles. Lorsque vous souscrivez aux services publicitaires de Méta par exemple, vous liez en même temps votre mode de paiement en ligne à votre compte Facebook, et donc ayant accès à votre compte on peut effectuer des achats en votre nom.&lt;/li&gt;
&lt;li&gt;Accès à vos amis et à votre famille : Contrôler votre compte leur permet d’interagir avec vos proches. Ils peuvent ainsi se passer pour vous auprès de vos proches.&lt;/li&gt;
&lt;li&gt;Espionnage (Stalking) : Les stalkers utilisent des comptes piratés pour surveiller les utilisateurs. Ainsi des comptes des journalistes, des défenseurs des droits humains et des opposants politiques sont régulièrement victimes de ces genres de piratages.&lt;/li&gt;
&lt;li&gt;Motivation financière : Les cybercriminels exploitent vos informations pour des gains financiers. Sur certains sites du darknet, on peut trouver des comptes Facebook piratés en vente; d'autres part, des comptes bénéficiant d'une grande communauté très interactive, donc qui génèrent des revenus peuvent aussi être ciblés.&lt;/li&gt;
&lt;li&gt;Chantage : Ils menacent de divulguer vos données sensibles à vos amis. Les personnalités publiques, religieuses, les journalistes et même vous, vous tenez beaucoup à votre réputation et à votre honneur. Ainsi, les pirates ayant accès à votre compte peuvent menacer de publier vos informations sensibles qui pourraient compromettre votre crédibilité.&lt;/li&gt;
&lt;li&gt;Récupération de comptes professionnels : Les entreprises et influenceurs sont ciblés pour une rançon.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Comment les pirates prennent le contrôle de votre compte ?
&lt;/h2&gt;

&lt;p&gt;Voici quelques techniques couramment utilisées par les pirates :&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Hameçonnage (Phishing) : Ils envoient des messages frauduleux pour vous inciter à divulguer vos informations de connexion. Pour ça ils se font passer pour vos proches dont, dans la plus part de cas, ils ont aussi pirater le compte. Ils peuvent aussi vous envoyer des messages renfermant des liens malveillants se faisant passer pour Méta.&lt;/li&gt;
&lt;li&gt;Vol de mots de passe : Les mots de passe faibles ou réutilisés sont ciblés.&lt;/li&gt;
&lt;li&gt;Logiciels malveillants : Ils vous incitent à télécharger des logiciels qui volent vos informations.&lt;/li&gt;
&lt;li&gt;Récupération via les amis : Ils se font passer pour des proches et demandent de l’aide pour récupérer un compte.&lt;/li&gt;
&lt;li&gt;Vulnérabilités de sécurité : Si Facebook présente des failles, les pirates les exploitent.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Bonnes pratiques pour protéger votre compte
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;Utilisez un mot de passe fort et unique pour votre compte Facebook.&lt;/li&gt;
&lt;li&gt;Activez l’authentification à deux facteurs pour une sécurité accrue.&lt;/li&gt;
&lt;li&gt;Méfiez-vous des liens suspects et ne partagez pas vos informations avec des sources non fiables.&lt;/li&gt;
&lt;li&gt;Surveillez les activités inhabituelles sur votre compte et signalez-les immédiatement.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;En suivant ces conseils, vous renforcez la sécurité de votre compte Facebook et protégez vos données personnelles.&lt;/p&gt;

</description>
      <category>security</category>
      <category>socialmedia</category>
      <category>marketing</category>
    </item>
    <item>
      <title>Courte introduction à la propriété background en CSS3</title>
      <dc:creator>Tacite WAKILONGO</dc:creator>
      <pubDate>Thu, 20 Jul 2023 12:59:49 +0000</pubDate>
      <link>https://forem.com/kadea-academy/couleurs-et-arriere-plans-2c20</link>
      <guid>https://forem.com/kadea-academy/couleurs-et-arriere-plans-2c20</guid>
      <description>&lt;p&gt;Lorsque vous concevez un site web, l'arrière-plan est un élément essentiel pour créer une ambiance visuelle et améliorer l'expérience utilisateur. Pour définir l'arrière-plan en CSS, nous utilisons la propriété &lt;code&gt;background&lt;/code&gt;. Dans cet article nous allons parler plus concrètement de : &lt;code&gt;background-color&lt;/code&gt;, &lt;code&gt;background-image&lt;/code&gt;, &lt;code&gt;background-repeat&lt;/code&gt;.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Note&lt;/strong&gt;: Il existe plusieurs autres propriétés pour définir les arrières plan telles que &lt;code&gt;background-clip&lt;/code&gt;, &lt;code&gt;background-size&lt;/code&gt;... Mais, ici, nous allons nous limiter aux trois ci-dessus précitées.&lt;/p&gt;

&lt;h2&gt;
  
  
  1. Couleurs d'arrière-plan
&lt;/h2&gt;

&lt;p&gt;La méthode la plus simple pour définir un arrière-plan est d'utiliser une couleur unie. Vous pouvez le faire en utilisant la propriété "&lt;code&gt;background-color&lt;/code&gt;" suivie du nom de la couleur ou du code hexadécimal. Par exemple :&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight css"&gt;&lt;code&gt;&lt;span class="nt"&gt;body&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="nl"&gt;background-color&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="m"&gt;#f2f2f2&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Note :&lt;/strong&gt; &lt;em&gt;il y a plusieurs façons de spécifier une couleur de . Les plus rependues sont : l’appeler par son nom en anglais (&lt;code&gt;red&lt;/code&gt;, &lt;code&gt;marron&lt;/code&gt;, &lt;code&gt;yellow&lt;/code&gt; …), indiquer son code hexadécimal (&lt;code&gt;#ffffff&lt;/code&gt;), l’identifier par la méthode RGB et RGBA…&lt;/em&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  2. Dégradés d'arrière-plan
&lt;/h2&gt;

&lt;p&gt;Les dégradés sont une autre option populaire pour les arrière-plans. Ils permettent de créer des transitions fluides entre deux couleurs ou plus. Vous pouvez utiliser la propriété "&lt;code&gt;background-image&lt;/code&gt;" avec la valeur "&lt;code&gt;linear-gradient&lt;/code&gt;" pour définir un dégradé linéaire. Par exemple :&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight css"&gt;&lt;code&gt;&lt;span class="nt"&gt;body&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="nl"&gt;background-image&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="n"&gt;linear-gradient&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;to&lt;/span&gt; &lt;span class="nb"&gt;bottom&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="m"&gt;#ff0000&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="m"&gt;#0000ff&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  3. Images d'arrière-plan
&lt;/h2&gt;

&lt;p&gt;Si vous souhaitez utiliser une image comme arrière-plan, vous pouvez utiliser la propriété "&lt;code&gt;background-image&lt;/code&gt;" avec la valeur "&lt;code&gt;url&lt;/code&gt;" suivie de l'URL de l'image. Par exemple :&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight css"&gt;&lt;code&gt;&lt;span class="nt"&gt;body&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="nl"&gt;background-image&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="sx"&gt;url("chemin/vers/image.jpg")&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Vous pouvez également spécifier d'autres options pour l'image d'arrière-plan, telles que la position, la répétition et la taille, en utilisant les propriétés "&lt;code&gt;background-position&lt;/code&gt;", "&lt;code&gt;background-repeat&lt;/code&gt;" et "&lt;code&gt;background-size&lt;/code&gt;".&lt;/p&gt;

&lt;h2&gt;
  
  
  4. Motifs d'arrière-plan
&lt;/h2&gt;

&lt;p&gt;Les motifs sont des images répétées pour créer un effet de motif sur l'arrière-plan. Vous pouvez utiliser la propriété "&lt;code&gt;background-image&lt;/code&gt;" avec la valeur "&lt;code&gt;url&lt;/code&gt;" pour spécifier l'image du motif, et la propriété "&lt;code&gt;background-repeat&lt;/code&gt;" pour définir la répétition du motif. Par exemple :&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight css"&gt;&lt;code&gt;&lt;span class="nt"&gt;body&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="nl"&gt;background-image&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="sx"&gt;url("chemin/vers/motif.png")&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="nl"&gt;background-repeat&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nb"&gt;repeat&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  5. Utilisation de la propriété Background seule
&lt;/h2&gt;

&lt;p&gt;Il est aussi possible d'utiliser la propriété &lt;code&gt;Background&lt;/code&gt; sans spécifier un autre élément après lui. Par exemple :&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight css"&gt;&lt;code&gt;&lt;span class="nt"&gt;background&lt;/span&gt;&lt;span class="o"&gt;:&lt;/span&gt; &lt;span class="nt"&gt;red&lt;/span&gt;&lt;span class="o"&gt;;&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;blockquote&gt;
&lt;p&gt;Cette façon est peu usitée, mais peut s'avérer utile dans certaines circonstances.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;h2&gt;
  
  
  Conclusion
&lt;/h2&gt;

&lt;p&gt;Ce sont quelques-unes des options les plus couramment utilisées pour définir des arrière-plans en CSS. Vous pouvez les combiner et les personnaliser selon vos besoins pour créer des designs uniques et attrayants pour votre site web.&lt;/p&gt;

</description>
    </item>
  </channel>
</rss>
