GraphQL
Stop wRESTling with your API. Use GraphQL
![](https://s3.amazonaws.com/media-p.slid.es/uploads/777968/images/4282564/pasted-from-clipboard.png)
Gliederung
GraphQL
Motivation
Praxis
Theorie
Ausblick
Einfache Todo Application
-
Aufgabe (Task)
-
Notizen
-
Deadline
-
-
Kategorie (Category)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/781013/images/4820555/pasted-from-clipboard.png)
Title | Category | Place | Date | State |
---|---|---|---|---|
Buying apples | shopping | Walmart | 2018-03-10 | Done |
Buying tv | shopping | Pending | ||
Program graphql | university | 2018-03-08 | Done |
![](https://s3.amazonaws.com/media-p.slid.es/uploads/777968/images/4827474/graphql_example.png)
Frontend
Backend
?
![](https://s3.amazonaws.com/media-p.slid.es/uploads/777968/images/4827537/architecture.png)
GET myapi.com/v1/todo/1
{
"title": "Buying apples",
"note": "Buying apples at Walmart",
"category": "shopping",
"date": 1524123265,
"place": "Walmart",
"sameCategory": [
2
],
"sameDate": [
3
]
}
GET myapi.com/task_with_images/2
GET myapi.com/task_with_images_and_date/2
GET myapi.com/task_with_images_and_date_and_description/2
GET myapi.com/task_with_images_and_description_and_date_and_owner/2
GET myapi.com/task?include=image,description,date,owner,created_at
Dokumentation
![](https://s3.amazonaws.com/media-p.slid.es/uploads/777968/images/4286796/Screenshot-2017-11-1_Swagger_UI.png)
Probleme bei REST
- Custom Endpoints vs. Over-Fetching
- Dokumentation
- Versionierung
- Backend-Driven-Development
Was ist GraphQL?
- Abfragesprache für API
- 2015 von Facebook veröffentlicht
- "SQL für API's"
- es gibt nur einen Endpoint
- basiert auf einem Graphen
![](https://s3.amazonaws.com/media-p.slid.es/uploads/777968/images/4282564/pasted-from-clipboard.png)
gleiche
Kategorie
gleiche
Kategorie
gleiches
Datum
gleiches
Datum
hat
hat
hat
hat
Kategorie
Kategorie
Aufgabe
Aufgabe
Aufgabe
Aufgabe
Aufgabe
Alternative zu einer
![](https://s3.amazonaws.com/media-p.slid.es/uploads/777968/images/4282656/pasted-from-clipboard.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/777968/images/4286201/pasted-from-clipboard.png)
Wie funktioniert GraphQL?
![](https://s3.amazonaws.com/media-p.slid.es/uploads/777968/images/4282699/Abfrage.gif)
Abfrage
Query vs Mutation
Vergleichbar mit den HTTP-Methods von REST
Type System
- Vergleichbar mit Objekten
- primitive Datentypen
- Listen
- komplexe (selbst entwickelte Datentypen)
Type System
- jede Ressource muss in einem Type definiert werden
![](https://s3.amazonaws.com/media-p.slid.es/uploads/777968/images/4288245/types.gif)
type Query {
category (title: String): [task]
tasks (state: Boolean): [task]
task (id: ID): task
date (from: Date, to: Date): [task]
}
type Task {
_id: ID!
title: String
state: Boolean
notes: String
date: Date
place: String
category: String
notes: String
sameDate: [Task]
samePlace: [Task]
sameCategory: [Task]
}
![](https://s3.amazonaws.com/media-p.slid.es/uploads/781013/images/4820637/pasted-from-clipboard.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/777968/images/4285714/Nov.-01-2017_16-16-41.gif)
Text
Versionierung
Vorteile von GraphQL
- einfache Auswahl der gewünschten Daten
- Kein Overfetching
- Objektorientierung
- GraphQL Schema als Beschreibungsdatei der API
- Dokumentation wird automatisch generiert
Nachteile von GraphQL
- Aufwandskalkulation schwierig (Keine Requests/day)
- Dateiverwaltung (Upload und Download)
- Caching ist schwierig (viele unterschiedliche Queries)
- Fehlende Standards für z.B. Paging
Dinge die nicht besprochen wurden
- Input Fields
- Authentication über JWT's
- MIME Types (Bilder, Audio, etc.)
- Fragmente
- Exceptions
- Security
- Caching
- Subscription
Ausblick
- erste Unternehmen verwenden auf GraphQL
![](https://s3.amazonaws.com/media-p.slid.es/uploads/777968/images/4285846/pasted-from-clipboard.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/777968/images/5305753/pasted-from-clipboard.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/777968/images/5305755/pasted-from-clipboard.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/777968/images/5305756/pasted-from-clipboard.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/777968/images/5305757/pasted-from-clipboard.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/777968/images/5305760/pasted-from-clipboard.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/777968/images/5305762/pasted-from-clipboard.png)
Ausblick
- hohes Potenzial in vielen Bereichen REST abzulösen
- hoher Nutzen in
- Web-Apps
- Mobile Anwendungen
- Open API
![](https://s3.amazonaws.com/media-p.slid.es/uploads/777968/images/4286814/c_.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/777968/images/4286819/Clojure_logo.svg.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/777968/images/4286825/elixir-estudo-horizontal-alta.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/777968/images/4286834/Erlang_logo.svg.png)
![](https://upload.wikimedia.org/wikipedia/commons/thumb/3/36/Groovy-logo.svg/1200px-Groovy-logo.svg.png)
![](https://upload.wikimedia.org/wikipedia/en/thumb/3/30/Java_programming_language_logo.svg/1200px-Java_programming_language_logo.svg.png)
![](https://newrelic.com/assets/pages/apm/php/php-elephant-logo-bd4f9d83be8c8563248fe4793f90bae7.png)
![](https://upload.wikimedia.org/wikipedia/commons/thumb/0/0a/Python.svg/2000px-Python.svg.png)
![](https://raw.githubusercontent.com/ServiceStack/Assets/master/img/livedemos/techstacks/scala-logo.png)
![](http://www.w3big.com/ruby/ruby-mini-logo.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/777968/images/5305692/pasted-from-clipboard.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/777968/images/5305695/pasted-from-clipboard.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/777968/images/4286814/c_.png)
![](https://upload.wikimedia.org/wikipedia/commons/thumb/2/20/Swift_logo_with_text.svg/2000px-Swift_logo_with_text.svg.png)
![](https://upload.wikimedia.org/wikipedia/en/thumb/3/30/Java_programming_language_logo.svg/1200px-Java_programming_language_logo.svg.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/777968/images/5305692/pasted-from-clipboard.png)
![](https://upload.wikimedia.org/wikipedia/commons/thumb/0/0a/Python.svg/2000px-Python.svg.png)
Praxis
DevCamp GraphQL
By finally
DevCamp GraphQL
- 854