Blog

API REST per TEST

Lettura 4 minuti

Capita quando bisogna sviluppare un’applicazione web/mobile di dover richiedere delle informazioni tramite delle API, l’ideale sarebbe avere già a disposizione questa risorsa prima di poggiare penna sul foglio per progettare l’applicazione. Purtroppo non siamo in un mondo ideale e la risorsa quasi mai risulta già sviluppata. (Se non avete problemi di questo tipo:

scendi giù e facci conoscere la tua esperienza)

Allora cosa possiamo fare?

Beh potremmo aspettare: inviamo email con un intervallo di polling di 30 secondi a chi ci deve fornire le API e lo pressiamo per ricevere aggiornamenti sullo sviluppo. Astuto no?

Oppure, anche se la prima risposta ci piace, possiamo tirar su un server di testing per simulare le nostre bramate API Rest.

Si va bene, “tirar su un server di testing…” meglio aspettare lo sviluppo delle API. Sarebbe noioso partire da zero e implementare la seconda soluzione, ma la community ci mette a disposizione tool che permette di farlo con un semplice JSON.

Il tool che suggeriamo in questo caso si chiama Json-Server, scaricabile tramite il repo git:

typicode/json-server

Scrivendo un solo file json e dandolo in pasto al tool possiamo tirare su le nostre API che permettono di usare i metodi http: POST, PUT, PATCH e DELETE; inoltre sono gestiti anche delle preziose feature come: i filtri, l’ordinamento, la paginazione, etc. li trovate tutti nella documentazione del modulo.

Vediamolo un po’ in funzione, Json-Server lo si può importare sia a livello globale sia nella directory dove aggiungeremo il nostro db, noi lo inseriremo nel progetto e lo vediamo subito.

Creiamo la nostra cartella del nostro server e aggiungiamo il modulo tramite un package manager, per questo esempio usiamo yarn ma anche npm va bene.

mkdir articleJsonServer
cd articleJsonServer
yarn init

compiliamo i vari campi richiesti e aggiungiamo la nuova risorsa al progetto

yarn add json-server

yarn scaricherà json-server nella cartella node_modules e lo aggiungerà come risorsa nel file package.json. Siamo quasi pronti ad avviare il nostro server con le nostre nuove API.

Controlliamo se è vero chiamando l’help del tool:

~ node_modules/json-server/bin/index.js --help

L’output utilizzato sopra ci mostra che il CLI di Json-Server funziona e quali sono le opzioni utilizzabili dal tool. (tra le opzioni è presente il delay nella risposta, molto interessante da poter testare con la nostra applicazione che svilupperemo)

Il passo successivo da eseguire è la creazione del nostro db in json, che definirà le risorse e i contenuti. Aggiungiamo il file db.json alla root del progetto (oppure dove meglio credete) e editatene il contenuto.

Noi come esempio metteremo un json con prodotti e categorie molto semplici:

{
  "products": [
    {
      "id": "1",
      "sku": "1231234",
      "name": "Jeans",
      "price": "49.99",
      "category": "1"
    },
    {
      "id": "2",
      "sku": "1231235",
      "name": "t-shirt",
      "price": "29.99",
      "category": "2"
    }
  ],
  "categories":[
    {
      "id": "1",
      "name":"Pantaloni"
    },
    {
      "id":"2",
      "name":"Maglie"
    }
  ]
}

Niente di trascendentale, ma voi potete dare sfogo alla fantasia se volete qualcosa di più articolato, di normalizzato (preferibilmente) o qualunque altra cosa vi possa servire. Inoltre è possibile usare Faker (o altre alternative) per generare attributi casuali in maniera molto veloce, esportando un oggetto tramite un file js e dandolo in pasto al nostro CLI al posto del file JSON.

Una volta stabilito il json abbiamo finito i compiti difficili (ricordiamoci che bisogna sempre mettersi d’accordo con il team che svilupperà le API reali, non facciamo il lavoro due volte)

Avviamo il nostro server dal terminale chiamando

~node_modules/json-server/bin/index.js db.json --watch

Le nostre risorse sono elencate sotto l’apposita voce e la home indicata è un’utile interfaccia di recap del nostro json-server. Il parametro watch aggiunto ci è utile per vedere in tempo reale le modifiche fatte al db, in particolare quando chiamiamo una risorsa che modifica o aggiunge elementi al json questa viene salvata sul file e le richieste successive restituiscono il risultato aggiornato senza riavviare il server.

Vogliamo fare una prova? Aggiungiamo un nuovo prodotto con postman, REST client suggerito da Alessando nell’articolo primi passi con l’utilizzo delle api di magento 2

Eseguiamo una chiamata POST all’endpoint dei prodotti, inserendo nel body della richiesta il json da aggiungere al db:

l’oggetto verrà aggiunto al nostro db e restituito nella chiamata POST effettuata.

Effettuando il GET sulla risorsa otterremo l’insieme di tutti i nostri prodotti aggiornati inclusi nel file json.

Non ci abbiamo messo molto a tirar su il nostro server di test funzionante, con questo possiamo iniziare lo sviluppo della nostra app senza indugiare sulle API mancanti.

L’esempio fatto è relativamente semplice, con il CLI di json-server possiamo aggiungere altre opzioni, quelle che abbiamo visto con –help per personalizzare: route, host, port, etc. Segnaliamo anche un altro repository su github con un wrapper del tool su gulp: GrafGenerator/gulp-json-server che consente di definire un task con alcune opzioni di json-server, senza dover scrivere il comando intero da zero ma inserendo tutte le info nel file gulp.

Conclusione

In questo articolo abbiamo visto un ottimo tool: Json-Server; per iniziare a sviluppare una nuova applicazione senza dover aspettare l’endpoint delle API REST. Con questo possiamo avvantaggiarci sui lavori da svolgere e testare l’applicazione legandola ad un server che fa il mockup dell’endpoint reale.

Mirko Cesaro