API REST de développement

Maintenant, voyons comment mettre en place un API REST de développement. L’article suivant présente 2 solutions : Jsonplaceholder et json-server.

Jsonplaceholder

Jsonplaceholder est un service en ligne aussi disponible en installation locale. Par contre, il demeure en lecture seule et simule des réponses lorsque vos lancez les opérations de modification.

json-server

json-server doit être installé localement, mais permet les opérations de mise à jour.

json-server, lorsque vous avez besoin d’un API REST de développement

L’outil logiciel json-server est une solution simple pour simuler un API REST lors du développement de votre application. En moins de 30 secondes, il est possible de l’installer localement et de le configurer en fonction de vos besoins.

Installer json-server

$ sudo npm install -g json-server

Créer le fichier de base

Dans ce fichier, vous n’avez qu’à spécifier, en format JSON, les données de votre API REST. Si des requêtes POST sont lancés, votre fichier sera modifié avec les données envoyées par votre client.

db.json
{ 
  "posts": [ 
    { 
      "title": "Title 1", 
      "body": "New body 1", 
      "userId": 1, 
      "id": 1, 
      "archived": true 
    }, 
   { 
      "title": "Title 2 ", 
      "body": "New body 2", 
      "userId": 2, 
      "id": 2 
    } 
  ], 
  "comments": [], 
}

Lancer le serveur

$ json-server --watch db.json

\{^_^}/ hi!
Loading db.json

Resources
 http://localhost:3000/posts
 http://localhost:3000/comments

Type s + enter at any time to create a snapshot of the database
Watching...
 
OPTIONS /posts/4 204 3.939 ms - -
GET /posts 200 227.855 ms - 86
DELETE /posts/4 404 192.351 ms - 2
GET /posts/2 200 199.460 ms - 7

json-server en ligne de commande

/usr/bin/json-server [options] <source>

Options:
--port,      -p Set port [default: 3000]
--host,      -H Set host [default: "0.0.0.0"]
--watch,     -w Watch file(s) [boolean]
--routes,    -r Load routes file
--static,    -s Set static files directory
--read-only, --ro Allow only GET requests [boolean]
--no-cors,   --nc Disable Cross-Origin Resource Sharing [boolean]
--snapshots, -S Set snapshots directory [default: "."]
--delay,     -d Add delay to responses (ms)
--id,        -i Set database id property (e.g. _id) [default: "id"]
--quiet,     -q Suppress log messages from output [boolean]
--help,      -h Show help [boolean]
--version,   -v Show version number [boolean]

Examples:
/usr/bin/json-server db.json
/usr/bin/json-server file.js

https://github.com/typicode/json-server

Génération de données avec Faker

Encore mieux que d’écrire votre petit fichier .json, il est possible de composer un script qui se chargera de générer des données aléatoires avec l’aide de faker. La section suivante présente comment générer 100 enregistrements de personnes ayant un nom et un avatar unique.

Pour débuter, installer faker et lodash

$ npm install faker lodash

Créer votre script de génération des enregistrements

module.exports = function(){
     var faker = require("faker");
     var _ = require("lodash");
     return {
       users: _.times(100, function (n) {
          return {
              id: n,
              name: faker.name.findName(),
              avatar: faker.internet.avatar()
         }
       })
     }
}

Lancer json-server

$ json-server generate.js

Aller prendre un bon verre d’eau ou un fruit

Vous les méritez bien!

[
{
  id: 0,
  name: "Junius O'Kon",
  avatar: "https://s3.amazonaws.com/uifaces/faces/twitter/homka/128.jpg"
},
{
  id: 1,
  name: "Toy Harris",
  avatar: "https://s3.amazonaws.com/uifaces/faces/twitter/osmond/128.jpg"
},
{
  id: 2,
  name: "Gilbert Kiehn",
  avatar: "https://s3.amazonaws.com/uifaces/faces/twitter/zacsnider/128.jpg"
},
{
  id: 3,
  name: "Lillie Streich",
  avatar: "https://s3.amazonaws.com/uifaces/faces/twitter/kosmar/128.jpg"
},
…
{
  id: 99,
  name: "Providenci Mueller",
  avatar: "https://s3.amazonaws.com/uifaces/faces/twitter/benjamin_knight/128.jpg"
}
]

Jsonplaceholder, un API REST de développement

Jsonplaceholder est une autre solution basée sur json-server. Il offre plusieurs routes pré-configurées et supporte plusieurs méthodes HTTP. Vous pouvez l’utiliser en ligne, ou installer votre propre serveur localement.

Fonctionnalités de Jsonplaceholder

• Aucune configuration nécessaire
• API REST de base
• Relation « Has many »
• Filtres et ressources enfant.
• Support de CORS et JSONP
• Support pour les verbes HTTP suivants : GET, POST, PUT, PATCH, DELETE et OPTIONS
• Compatible avec Backbone, AngularJS et Ember

Attention

Les données de votre API REST ne seront pas modifiées. Suite à un POST, une réponse vous est retournée, mais la ressource n’est pas vraiment ajoutée ou modifiée.

Jsonplaceholder en ligne

• Posts http://jsonplaceholder.typicode.com/posts/1
• Albums http://jsonplaceholder.typicode.com/albums/1
• Photos http://jsonplaceholder.typicode.com/photos/1
• Users http://jsonplaceholder.typicode.com/users/1

Installer une version locale de Jsonplaceholder

Simple comme ‘Bonjour’, en 2 commandes :

$ npm install -g jsonplaceholder
$ jsonplaceholder

Votre API REST de développement est maintenant disponible à l’adresse http://localhost:3000

Jsonplaceholder sur GitHub

• http://jsonplaceholder.typicode.com/
• https://github.com/typicode/jsonplaceholder

Conclusion

Plusieurs options s’offrent à vous lorsque vous désirez mettre en place un API REST de développement. Jsonplaceholder offre une solution en ligne et locale, mais les données ne sont pas sauvegardées. json-server doit être installé sur votre poste, mais offre beaucoup plus de flexibilité et sauvegarde réellement vos données suite à un POST ou à un PUT.

Voici d’autres solution qui pourraient être analysées :

• http://www.mocky.io/
• https://jsonstub.com/
• https://github.com/marmelab/FakeRest
• https://www.npmjs.com/package/fake-rest-api
• http://johansson.jp/angular-apimock/#/demo-simple
• https://github.com/seriema/angular-apimock