WAT?!?

Warum brauchen wir das?

• Trennung zwischen Backend/Frontend
• Entkoppelte Projekte
• Frontend benötigt kein laufendes Backend und keine echten Daten
• Nur die Struktur muss übereinstimmen

JSON Dateien via Ajax laden

Pro

• Unkompliziert / Kein Tooling
• Response Daten in Versionskontrolle

Kontra

• Sehr beschränkte Funktionalität
• ggf. keine Unterstützung deines JavaScript Frameworks

• Keine HTTP Methoden außer GET abbildbar

• Fehlerfälle (bis auf 404) nicht testbar 

• Unterschiede zwischen fake und realem Backend

  • HTTP Header

  • URLs (inklusive Struktur)

  • etc.

Online mocking services

Webapplikationen zum erstellen von fake APIs

• mockapi.io
• mocky.io
• etc. …

Pro

• Gut bedienbar

• Gute und (teilweise) mächtige Konfigurations-möglichkeiten

Contra

• ggf. CORS Beschränkungen

• Response Daten nicht in Versionskontrolle

• Eigene Daten auf fremden Servern 😱

• Abhängig vom Anbieter

  • Verfügbarkeit
  • Exportmöglichkeit
  • etc.

• ggf. kostenpflichtig

»JSON Server« #FTW

JSON Server

• Command Line Tool
• Liefert JSON aus dem Dateisystem
  • via http (»restful«)
• https://github.com/typicode/json-server

Demo

Pro

• Response Daten in Versionskontrolle
• Einfachstes Setup
• Unterstützt alle HTTP Verben

  • Persistiert Änderungen (POST, PUT, PATCH)

Kontra

• Payload erwartet ein festes Format (JSON)

• Keine »dynamischen« Routen

  • api/articles/{offset}/{count}

• ​»Wartbarkeit« der JSON-Datei für die Responses

Eigener Server 🦄

Flexibilität vs. Komplexität 😬

• https://github.com/micromata/http-fake-backend
• Liefert JSON Dateien (oder JavaScript Objekte) via http

DEMO

Pro

• Response Daten in Versionskontrolle

• Höchste Flexibilität

• Einfaches Setup von

  • Endpunkten

  • URLs inkl. dynamischer Bestandteile

  • Erlaubten HTTP-Verben

  • Fehlern (Unterstützt alle http Statuscodes)

  • Automatischer Neustart des Server

    • bei Änderungen im Filesystem (JSON Dateien oder Endpunkt/URL Definitionen)

  • Yeoman Generator

    • mit Subgenerator zur Unterstützung beim Anlegen der API

Kontra

• Kein persistieren der Payload Daten

  • (POST, PUT, PATCH)