6. Modifier un pokémon

Maintenant, nous savons effectuer des requêtes différentes du type GET avec Insomnia et également parser le corps de nos requêtes automatiquement en JSON.

À partir de là, l’ajout du point de terminaison de modification devrai donc être plus simple pour nous.

Pour commencer, nous allons ajouter un nouveau point de terminaison pour la modification d’un pokémon. On utilise pour cela l’action HTTP nommée PUT, qui permet de remplacer une donnée par une autre dans notre API Rest.

Il s’agit d’une distinction subtile mais indispensable pour créer une API Rest robuste :

Vous remplacez l’ensemble de la ressource à modifier côté API Rest.

Par exemple, pour modifier seulement le nom d’un pokémon, nous n’allons pas modifier directement le pokémon présent sur notre API Rest. À la place, nous allons créer un nouveau pokémon identique côté client, puis nous lui appliquerons la modification souhaitée, et enfin nous remplacerons l’ensemble de « l’ancien » pokémon, par le nouveau.

Mais, pourquoi s’embêter à ce point ? Encore une convention ?

Non pas du tout ! En fait le principe est même plutôt intelligent. Imaginez que vous ayez deux clients différents qui essaye de modifier le même pokémon. S’ils tentent de modifier la même ressource, vous avez des risques de collisions…

Par contre, si chaque client soumet une nouvelle version complète du pokémon, les modifications peuvent s’enchaîner les unes à la suite des autres logiquement. Autrement dit, chaque modification introduit qu’un seul et unique effet de bord sur votre serveur, plutôt que des changements de propriétés dans tout les sens !

Alors, convaincu ? 😉

Pour modifier seulement une partie d’une ressource, il existe une autre opération nommée PATCH. Sans rentrer dans les détails, je vous recommande fortement d’utiliser systématiquement PUT. Il s’agit d’une opération beaucoup plus fiable pour construire votre API Rest et c’est la méthode utilisée par la majorité des API Rest.

Mais retournons à nos moutons, et mettons en place le point de terminaison permettant de modifier un pokémon, dans le point d’entrée de notre application app.js :

app.put('/api/pokemons/:id', (req, res) => {
 const id = parseInt(req.params.id);
 const pokemonUpdated = { ...req.body, id: id }
 pokemons = pokemons.map(pokemon => {
  return pokemon.id === id ? pokemonUpdated : pokemon
 })
 
 const message = `Le pokémon ${pokemonUpdated.name} a bien été modifié.`
 res.json(success(message, pokemonUpdated))
});

Que voit-on ici ?

Eh bien, on retrouve pas mal de code dont on a déjà l’habitude. Mais il y a surtout deux éléments importants à retenir.

  • D’abord, on utilise l’opération PUT à la ligne 1. Ce ne sont que trois lettres, mais comme vous le savez maintenant, il s’agit d’une différence importante. 👍
  • Ensuite, on effectue le traitement de la modification en lui-même, de la ligne 4 à 6. Pour cela, on doit mettre à jour notre liste globale de pokémon, en remplaçant un ancien pokémon dans la liste par le nouveau. C’est le traitement que l’on met en place dans la méthode JavaScript native map. Pour chaque pokémon de la liste, on retourne exactement le même, sauf s’il s’agit du pokémon à modifier. On obtient ensuite la liste des pokémons à jour avec la modification demandée par le client.

Et voilà, on a désormais la possibilité de modifier un pokémon en passant par notre API Rest. Bravo !

Si vous avez l’impression d’avoir tout fait “sauter » et que vous voulez réinitialiser les données de votre API Rest, relancez simplement la commande npm start. Vous repartirez avec nos 12 pokémons initiaux. C’est tout !

Attend, j’ai une petite question… on a utilisé deux codes différents pour créer ou modifier un pokémon. Quelle est la différence entre ces deux syntaxes ?

Effectivement, la syntaxe est légèrement différente entre l’ajout et la modification d’un pokémon :

// Ajout d'un pokémon
const pokemonCreated = {...req.body,...{id: id, created: new Date()}}
 
// Modification d'un pokémon
const pokemonUpdated = {...req.body, id: id }

Dans le premier cas, on a des accolades supplémentaires entourant les propriétés qui sont ajoutées au pokémon.

La différence est due au fait que dans le premier cas, on ajoute une seule propriété. Dans le deuxième cas, on ajoute un ensemble de deux propriétés à l’objet initial. La syntaxe est simplement différente entre ces deux cas. 👍

Allez, on peut passer à la suite !