Snabbt och enkelt håna ett REST API med Restapify

Hej utvecklare 👋

Ofta när du börjar utveckla ett nytt frontend-projekt som konsumerar ett REST API, är backend inte klart ännu. Men väldigt ofta är denna till en början grundläggande och du vill bara ta emot falska data för att se hur applikationen beter sig. Det är då du bestämmer dig för att använda ett verktyg för att håna ditt API som postman eller bibliotek som json-server, mocker-api eller http-fake-backend. Dessa verktyg är riktigt bra men det finns fortfarande några negativa punkter. Postman till exempel är inte helt gratis att använda och behöver logga in, mocker-api definierar alla rutter i en enda javascript-fil och json-server är någon gång väldigt restriktiv för edge-cases.

Så jag bestämde mig för att arbeta på ett nytt API-mockarverktyg som borde kunna hantera alla ärenden och det inom ett trevligt utvecklarupplevelseflöde:Restapify.

Restapify är en nodejs-baserad CLI som låter dig snabbt och enkelt distribuera ett lokalt REST API genom att använda en intuitiv och utvecklarvänlig JSON-filstruktur som du kommer att se i NextJS eller Sapper. Låt oss beskriva hur det fungerar genom att skapa ett enkelt hånat API som ska tjäna följande:

GET  /me
GET  /posts
GET  /users
GET  /users/:userid
POST /users/:userid
DEL  /users/:userid
GET  /users/:userid/comments

Skapa slutpunkterna

Utgångspunkten är skapandet av mappen som kommer att innehålla din route json-fil, jag kallar den /api . Sedan kan vi lägga till några rutter som ska trafikeras. Att skapa en rutt innebär att lägga till en .json fil där dess filnamn beskriver slutpunkten, metoden och statuskoden och dess innehåll svarskroppen. Så för att skapa GET /me slutpunkt med statuskoden 200 skapa bara följande fil:

📂 api
┣ 📜 me.GET.200.json

Sedan GET och 200 är standardvärdet för metoden och statuskoden kan du förenkla filnamnet till:

📂 api
┣ 📜 me.json

Svaret bör innehålla en firstname , en lastname och en email , alltså filinnehållet i /api/me.json skulle vara något i stil med:

{
  "firstname": "Janie",
  "lastname": "Hermann",
  "email": "[email protected]"
}

Låt oss sedan lägga till slutpunkterna för /users . Eftersom det finns några av dem kan vi gruppera dem i samma mapp users

📂 api
┣ 📂 users
┃ ┗ 📜 _.json
┃ ┣ 📂 [userid]
┃ ┃ ┗ 📜 _.json
┃ ┃ ┗ 📜 _.POST.201.json
┃ ┃ ┗ 📜 _.DELETE.201.json
┣ 📜 me.json

Mappen [userid] indikera att denna rutt är dynamisk. Du kan sedan i JSON-filinnehållet konsumera denna variabel genom att använda syntaxen [userid] . Exempel i filen /api/users/[userid]/_.json :

{
  "id": "[userid]",
  "email": "[email protected]"
}

Om du ringer så GET /users/42 du får svaret:

{
  "id": "42",
  "email": "[email protected]"
}

Restapify tillhandahåller en syntax för att använda det berömda fakerjs-biblioteket för att enkelt fylla i ditt svars kropp (kassa i dokumenten):

{
  "firstname": "[#faker:name:firstName]",
  "lastname": "[#faker:name:lastName]",
  "email": "[#faker:internet:email]"
}

Du kan också enkelt skapa en slöseri med data genom att använda for-loop-syntaxen. Så om du vill få 10 kommentarer med begäran GET /users/:userid/comments skriv bara detta i JSON-filen /api/users/[userid]/comments.json :

[
  "#for i in range(10)",
  {
    "id": "n:[i]",
    "creatorId": "n:[userid]",
    "content": "[#faker:lorem:sentences]"
  },
  "#endfor"
]

Så nu har vi skapat alla slutpunkter för API:t som skickar ett lyckat svar. Men vad händer om vi vill testa programmets beteende när användaren inte finns i GET /users/:userid till exempel. Ett riktigt API skulle förmodligen returnera en 404 utan något innehåll. För att håna detta beteende implementerar Restapify konceptet med slutpunktstillstånd. För att göra detta behöver du bara skapa en ny fil för varje tillstånd genom att lägga till syntaxen {STATE_NAME} i slutet av filen åtskilda av en prick. Så låt oss skapa ett nytt tillstånd för GET /users/:userid :

📂 api
┣ 📂 users
┃ ┣ 📂 [userid]
┃ ┃ ┗ 📜 _.json
┃ ┃ ┗ 📜 _.404.{NOT_FOUND}.json

För att returnera inget innehåll i Restapify måste du använda denna syntax som filinnehåll:

[null]

Nu när du har skapat dina slutpunkter är det dags att servera det hånade API:et. För att installera Restapi CLI...

yarn global add restapify 
# or npm install -g restapify

...och servera sedan api/ mapp:

restapify serve api/

Det kommer sedan att öppna en instrumentpanel i din webbläsare som ger dig en översikt över det hånade API:et.

Du kan i den här instrumentpanelen konsultera slutpunkterna och deras innehåll, hämta dem och ännu viktigare välja vilket tillstånd för slutpunkterna du vill betjäna.

Så om du klickar på tillståndsknappen NOT_FOUND , kommer det att uppdatera API:et för att betjäna detta tillstånd för slutpunkten, så om du direkt efter begäran GET /users/42 du kommer att få en 404 . Det här är verkligen användbart för att testa ditt gränssnitt (till exempel ett inloggningsformulär) och du kan skapa så många flera tillstånd som du vill för att passa allt du behöver och edge case.

Så jag presenterade de viktigaste funktionerna i Restapify men jag uppmuntrar dig verkligen att kontrollera den officiella dokumentationen för det för att se andra användningsfall som frågesträng, ruttvariabel i for-loopar eller fakerjs-integrationen i mer detaljer.

Du kan hitta några förberedda exempel på hånat API i https://restapify.vercel.app/examples så att du direkt kan spela och se hur det känns. Om du har någon fråga eller feedback, lägg gärna upp det i diskussionen och om du vill kolla in källkoden, här är GitHub-förrådet:

johannchopin / restapify

Snabbt och enkelt implementera ett hånat REST API genom att använda en intuitiv och utvecklarvänlig JSON-filstruktur

Ha en bra dag ⭐