📝 Exercises & Practice

📋 Sujet de l'Exercice

---

🟦 Partie A — Serveur (à réaliser en premier)

Contexte

Vous développez une mini-application CourseDesk permettant de gérer une liste d'étudiants. Le serveur expose une API REST avec trois fonctionnalités uniquement :

• Ajouter un étudiant
• Lister les étudiants
• Supprimer un étudiant

Les données sont stockées dans une base de données JSON. Lors de l'ajout d'un étudiant, le serveur doit obligatoirement contacter un service externe pour obtenir un ID unique.

A1) Base de données JSON (obligatoire)

Vous devez utiliser explicitement une BD au format JSON.

La ressource students doit couvrir au minimum les champs suivants :

{
  "id": "string",
  "name": "string",
  "group": "string",
  "score": "number"
}

Contraintes :

• id n'est jamais généré localement
• il est obtenu uniquement via le service externe
• validation stricte des données
• structure globale libre mais cohérente (ex: { "students": [] })

A2) API REST — Fonctionnalités obligatoires

1) Lister les étudiants

• Méthode : GET
• URL : /api/students

Réponse (exemple) — Format obligatoire à respecter :

{
  "count": 2,
  "items": [
    { "id": "STU-0001", "name": "Amine", "group": "G2", "score": 78 },
    { "id": "STU-0002", "name": "Sara", "group": "G1", "score": 91 }
  ]
}

2) Ajouter un étudiant

• Méthode : POST
• URL : /api/students
• Body JSON :

{ "name": "Amine", "group": "G2", "score": 78 }

Traitement attendu :

1. Validation des données
2. Appel au service externe pour récupérer un id
3. Création et sauvegarde de l'étudiant en BD JSON

Réponse (exemple) — Format obligatoire à respecter :

{
  "id": "STU-0007",
  "name": "Amine",
  "group": "G2",
  "score": 78
}

3) Supprimer un étudiant

• Méthode : DELETE
• URL : /api/students/:id

Réponse (exemple) — Format obligatoire à respecter :

{ "deleted": true, "id": "STU-0007" }

A3) Service externe — Génération d'ID

(non développé par l'étudiant)

Lors de l'ajout d'un étudiant, votre serveur doit appeler ce service externe :

• Méthode : GET
• URL : https://api.external-id.com/student/next
• Réponse JSON :

{ "id": "STU-0007" }

⚠️ En cas d'échec du service externe, votre serveur doit répondre par :

{ "error": "EXTERNAL_ID_SERVICE_FAILURE" }

Contraintes serveur

• Express ou module http
• Promises / async-await uniquement
• Codes HTTP cohérents (200, 201, 400, 404, 500...)
• Réponses JSON propres
• ⚠️ Format des erreurs libre — En cas d'erreur (400, 404, 500...), le format de la réponse est libre (ex: { "error": "..." } ou autre)

---

🟨 Partie B — Client (à réaliser après le serveur)

B1) Template HTML fournie

<main class="app">
  <h1>CourseDesk</h1>

  <section>
    <input id="name" placeholder="Nom" />
    <select id="group">
      <option value="G1">G1</option>
      <option value="G2">G2</option>
      <option value="G3">G3</option>
    </select>
    <input id="score" type="number" placeholder="Score" />

    <button id="btnAdd">Ajouter</button>
    <button id="btnList">Lister</button>

    <p id="msg"></p>
  </section>

  <ul id="list">
    <!-- dynamique -->
    <!--
    <li class="item" data-id="STU-0007">
      <span class="badge">G2</span>
      <span class="text">Amine — score: 78</span>
      <button class="btn-del">X</button>
    </li>
    -->
  </ul>

  <script src="./main.js"></script>
</main>

B2) Fonctionnalités client attendues

Le client doit permettre :

• Ajouter un étudiant
• Lister les étudiants
• Supprimer un étudiant

La communication avec le serveur se fait via AJAX (fetch ou XMLHttpRequest promisifié). Les éléments de la liste sont générés dynamiquement en JavaScript.