⚠️ Avant de commencer cette quête, nous te recommandons de jeter un œil à celle-ci :

Dans les quêtes précédentes, tu as appris à :

• Configurer et créer un serveur avec Express
• Créer des routes basiques
• Récupérer des informations de ta base de données
• Insérer de nouvelles données dans ta base de données

Dans cette quête, tu vas apprendre comment modifier des données existantes. Voyons comment faire en utilisant Express et MySQL.

🤓 Dans cette quête, tu vas apprendre comment :

✅ Écrire des routes PUT ✅ Modifier des données dans la base de données ✅ Tester tes routes PUT avec Postman

💾 Comment créer un HANDLER de routes PUT avec Express ?

Une pratique courante consiste à utiliser les verbes HTTP PUT ou PATCH pour spécifier que nous voulons modifier quelque chose qui existe déjà dans la base de données. Par souci de simplicité, nous n'utiliserons que PUT pour le moment.

Encore une fois, d'une certaine manière, tu sais déjà quoi faire. Auparavant, face à une requête comme celle-ci :

GET http://localhost:5000/api/movies/2

Tu as déclaré une route pour y répondre comme ceci :

app.get("/api/movies/:id", HANDLER);

Ensuite dans le HANDLER, tu as récupéré le 2 de l'URL via req.params.id.

Face à ce genre de requête :

POST http://localhost:5000/api/movies
Content-type: application/json

{
  "title": "Citizen Kane",
  "director": "Orson Wells",
  "year": "1941",
  "color": "0",
  "duration": 120
}

Tu as déclaré ta route comme ceci :

app.post("/api/movies", HANDLER);

Et tu as récupéré les détails du film dans HANDLER via req.body.

Maintenant, nous voulons gérer des requêtes de mise à jour des ressources, comme celle-ci :

PUT http://localhost:5000/api/movies/2
Content-type: application/json

{
  "title": "Citizen Kane",
  "director": "Orson Wells",
  "year": "1941",
  "color": "0",
  "duration": 120
}

Pour ce dernier exemple :

false|||true|||false
# Quelle méthode d'app dois-tu utiliser pour déclarer la route ?
[] `app.post()`
[] `app.get()`
[] `app.delete()`
[x] `app.put()`
# Quel chemin dois-tu utiliser comme premier paramètre ?
[x] `"/api/movies/:id"`
[] `"/api/movies"`
[] `"/api/users"`
[] `"/api/users/:id"`
# Via quelle propriété de requête vas-tu récupérer l'id du film ?
[x] `req.params`
[] `req.body`
[] `req.query`
# A travers quelle propriété de requête vas-tu récupérer le titre du film, le réalisateur... ?
[] `req.params`
[x] `req.body`
[] `req.query`
# Quelle opération SQL vas-tu effectuer ici ?
[] `SELECT`
[] `INSERT`
[x] `UPDATE`
[] `DELETE`

C'est suffisant pour un premier jet. Essaye de créer la route pour PUT /api/movies/:id. Pense à consulter cette page pour choisir le statut HTTP adapté à ta réponse. En cas de succès, tu n'auras aucun contenu à renvoyer au client, car il sait déjà tout (identifiant et détails du film). Si l'id n'existait pas dans la base de données, tu le sauras en vérifiant le résultat de ta requête UPDATE (console.log() est ton ami) : la requête n'aura affecté aucune ligne.

Voir la solution|||javascript|||Tu as des doutes sur comment faire ? |||0|||Masquer
// in src/controllers/movieControllers.js

const updateMovie = (req, res) => {
  const id = parseInt(req.params.id);
  const { title, director, year, color, duration } = req.body;

  database
    .query(
      "update movies set title = ?, director = ?, year = ?, color = ?, duration = ? where id = ?",
      [title, director, year, color, duration, id]
    )
    .then(([result]) => {
      if (result.affectedRows === 0) {
        res.sendStatus(404);
      } else {
        res.sendStatus(204);
      }
    })
    .catch((err) => {
      console.error(err);
      res.sendStatus(500);
    });
};

module.exports = {
  getMovies,
  getMovieById,
  postMovie,
  updateMovie, // don't forget to export your function ;)
};

// in app.js

app.put("/api/movies/:id", movieControllers.updateMovie);

Tester notre route PUT

Crée un nouveau film en utilisant la route POST. Fais défiler la liste des méthodes et sélectionne "PUT". Ensuite, modifie les données dans le corps de la requête (met une blague sur le titre par exemple).

Clique sur "Send", et vois le résultat. Essaye de PUT sur un id invalide : cette fois ton serveur devrait répondre "Not Found" ;)

💪 Challenge

Modification d'un utilisateur dans la base de données

Maintenant que tu as créé la route PUT pour les films, crée la route PUT pour mettre à jour les utilisateurs !

• Créez une route PUT pour le chemin /api/users/:id : ta route modifiera un utilisateur dans la base de données
• Publie un lien GitHub pour partager ta solution

🧐 Critères d'acceptation

• [ ] Le GitHub contient une route PUT pour les utilisateurs
• [ ] Une requête PUT sur /api/users/:id devrait mettre à jour le bon utilisateur dans la base de données

==$== Ce que tu devrais avoir dans :

// ...

const movieControllers = require("./controllers/movieControllers");

app.get("/api/movies", movieControllers.getMovies);
app.get("/api/movies/:id", movieControllers.getMovieById);
app.post("/api/movies", movieControllers.postMovie);
app.put("/api/movies/:id", movieControllers.updateMovie);

const userControllers = require("./controllers/userControllers");

app.get("/api/users", userControllers.getUsers);
app.get("/api/users/:id", userControllers.getUserById);
app.post("/api/users", userControllers.postUser);
app.put("/api/users/:id", userControllers.updateUser);

// ...

// ...

const updateUser = (req, res) => {
  const id = parseInt(req.params.id);
  const { firstname, lastname, email, city, language } = req.body;

  database
    .query(
      "update users set firstname = ?, lastname = ?, email = ?, city = ?, language = ? where id = ?",
      [firstname, lastname, email, city, language, id]
    )
    .then(([result]) => {
      if (result.affectedRows === 0) {
        res.sendStatus(404);
      } else {
        res.sendStatus(204);
      }
    })
    .catch((err) => {
      console.error(err);
      res.sendStatus(500);
    });
};

module.exports = {
  getUsers,
  getUserById,
  postUser,
  updateUser,
};

// ...

const updateMovie = (req, res) => {
  const id = parseInt(req.params.id);
  const { title, director, year, color, duration } = req.body;

  database
    .query(
      "update movies set title = ?, director = ?, year = ?, color = ?, duration = ? where id = ?",
      [title, director, year, color, duration, id]
    )
    .then(([result]) => {
      if (result.affectedRows === 0) {
        res.sendStatus(404);
      } else {
        res.sendStatus(204);
      }
    })
    .catch((err) => {
      console.error(err);
      res.sendStatus(500);
    });
};

module.exports = {
  getMovies,
  getMovieById,
  postMovie,
  updateMovie,
};