REACT GRAPHQL
Sebastian Siemssen (@thefubhy)
♥
https://github.com/fubhy/zurich-graphql
https://github.com/fubhy/zurich-graphql-server
http://swapi.co
GET api/people/1
{
"name": "Luke Skywalker",
"height": "1.72 m",
"mass": "77 Kg",
"hair_color": "Blond",
"skin_color": "Caucasian",
"eye_color": "Blue",
"birth_year": "19 BBY",
"gender": "Male",
"homeworld": "http://swapi.co/api/planets/1/",
"films": [
"http://swapi.co/api/films/1/",
"http://swapi.co/api/films/2/",
"http://swapi.co/api/films/3/"
],
"species": [
"http://swapi.co/api/species/1/"
],
"vehicles": [
"http://swapi.co/api/vehicles/14/",
"http://swapi.co/api/vehicles/30/"
],
"starships": [
"http://swapi.co/api/starships/12/",
"http://swapi.co/api/starships/22/"
],
"created": "2014-12-09T13:50:51.644000Z",
"edited": "2014-12-10T13:52:43.172000Z",
"url": "http://swapi.co/api/people/1/"
}{
"title": "A New Hope",
"episode_id": 4,
"opening_crawl": "It is a period of civil war.\r\nRebel spaceships, striking\r\nfrom a hidden base, have won\r\ntheir first victory against\r\nthe evil Galactic Empire.\r\n\r\nDuring the battle, Rebel\r\nspies managed to steal secret\r\nplans to the Empire's\r\nultimate weapon, the DEATH\r\nSTAR, an armored space\r\nstation with enough power\r\nto destroy an entire planet.\r\n\r\nPursued by the Empire's\r\nsinister agents, Princess\r\nLeia races home aboard her\r\nstarship, custodian of the\r\nstolen plans that can save her\r\npeople and restore\r\nfreedom to the galaxy....",
"director": "George Lucas",
"producer": "Gary Kurtz, Rick McCallum",
"release_date": "1977-05-25",
"characters": [
"https://swapi.co/api/people/1/",
"https://swapi.co/api/people/2/",
"https://swapi.co/api/people/3/",
"https://swapi.co/api/people/4/",
"https://swapi.co/api/people/5/",
"https://swapi.co/api/people/6/",
"https://swapi.co/api/people/7/",
"https://swapi.co/api/people/8/",
"https://swapi.co/api/people/9/",
"https://swapi.co/api/people/10/",
"https://swapi.co/api/people/12/",
"https://swapi.co/api/people/13/",
"https://swapi.co/api/people/14/",
"https://swapi.co/api/people/15/",
"https://swapi.co/api/people/16/",
"https://swapi.co/api/people/18/",
"https://swapi.co/api/people/19/",
"https://swapi.co/api/people/81/"
],
"planets": [
"https://swapi.co/api/planets/2/",
"https://swapi.co/api/planets/3/",
"https://swapi.co/api/planets/1/"
],
"starships": [
"https://swapi.co/api/starships/2/",
"https://swapi.co/api/starships/3/",
"https://swapi.co/api/starships/5/",
"https://swapi.co/api/starships/9/",
"https://swapi.co/api/starships/10/",
"https://swapi.co/api/starships/11/",
"https://swapi.co/api/starships/12/",
"https://swapi.co/api/starships/13/"
],
"vehicles": [
"https://swapi.co/api/vehicles/4/",
"https://swapi.co/api/vehicles/6/",
"https://swapi.co/api/vehicles/7/",
"https://swapi.co/api/vehicles/8/"
],
"species": [
"https://swapi.co/api/species/5/",
"https://swapi.co/api/species/3/",
"https://swapi.co/api/species/2/",
"https://swapi.co/api/species/1/",
"https://swapi.co/api/species/4/"
],
"created": "2014-12-10T14:23:31.880000Z",
"edited": "2015-04-11T09:46:52.774897Z",
"url": "https://swapi.co/api/films/1/"
}{
"title": "The Empire Strikes Back",
"episode_id": 5,
"opening_crawl": "It is a dark time for the\r\nRebellion. Although the Death\r\nStar has been destroyed,\r\nImperial troops have driven the\r\nRebel forces from their hidden\r\nbase and pursued them across\r\nthe galaxy.\r\n\r\nEvading the dreaded Imperial\r\nStarfleet, a group of freedom\r\nfighters led by Luke Skywalker\r\nhas established a new secret\r\nbase on the remote ice world\r\nof Hoth.\r\n\r\nThe evil lord Darth Vader,\r\nobsessed with finding young\r\nSkywalker, has dispatched\r\nthousands of remote probes into\r\nthe far reaches of space....",
"director": "Irvin Kershner",
"producer": "Gary Kurtz, Rick McCallum",
"release_date": "1980-05-17",
"characters": [
"https://swapi.co/api/people/1/",
"https://swapi.co/api/people/2/",
"https://swapi.co/api/people/3/",
"https://swapi.co/api/people/4/",
"https://swapi.co/api/people/5/",
"https://swapi.co/api/people/10/",
"https://swapi.co/api/people/13/",
"https://swapi.co/api/people/14/",
"https://swapi.co/api/people/18/",
"https://swapi.co/api/people/20/",
"https://swapi.co/api/people/21/",
"https://swapi.co/api/people/22/",
"https://swapi.co/api/people/23/",
"https://swapi.co/api/people/24/",
"https://swapi.co/api/people/25/",
"https://swapi.co/api/people/26/"
],
"planets": [
"https://swapi.co/api/planets/4/",
"https://swapi.co/api/planets/5/",
"https://swapi.co/api/planets/6/",
"https://swapi.co/api/planets/27/"
],
"starships": [
"https://swapi.co/api/starships/15/",
"https://swapi.co/api/starships/10/",
"https://swapi.co/api/starships/11/",
"https://swapi.co/api/starships/12/",
"https://swapi.co/api/starships/21/",
"https://swapi.co/api/starships/22/",
"https://swapi.co/api/starships/23/",
"https://swapi.co/api/starships/3/",
"https://swapi.co/api/starships/17/"
],
"vehicles": [
"https://swapi.co/api/vehicles/8/",
"https://swapi.co/api/vehicles/14/",
"https://swapi.co/api/vehicles/16/",
"https://swapi.co/api/vehicles/18/",
"https://swapi.co/api/vehicles/19/",
"https://swapi.co/api/vehicles/20/"
],
"species": [
"https://swapi.co/api/species/6/",
"https://swapi.co/api/species/7/",
"https://swapi.co/api/species/3/",
"https://swapi.co/api/species/2/",
"https://swapi.co/api/species/1/"
],
"created": "2014-12-12T11:26:24.656000Z",
"edited": "2017-04-19T10:57:29.544256Z",
"url": "https://swapi.co/api/films/2/"
}{
"title": "Return of the Jedi",
"episode_id": 6,
"opening_crawl": "Luke Skywalker has returned to\r\nhis home planet of Tatooine in\r\nan attempt to rescue his\r\nfriend Han Solo from the\r\nclutches of the vile gangster\r\nJabba the Hutt.\r\n\r\nLittle does Luke know that the\r\nGALACTIC EMPIRE has secretly\r\nbegun construction on a new\r\narmored space station even\r\nmore powerful than the first\r\ndreaded Death Star.\r\n\r\nWhen completed, this ultimate\r\nweapon will spell certain doom\r\nfor the small band of rebels\r\nstruggling to restore freedom\r\nto the galaxy...",
"director": "Richard Marquand",
"producer": "Howard G. Kazanjian, George Lucas, Rick McCallum",
"release_date": "1983-05-25",
"characters": [
"https://swapi.co/api/people/1/",
"https://swapi.co/api/people/2/",
"https://swapi.co/api/people/3/",
"https://swapi.co/api/people/4/",
"https://swapi.co/api/people/5/",
"https://swapi.co/api/people/10/",
"https://swapi.co/api/people/13/",
"https://swapi.co/api/people/14/",
"https://swapi.co/api/people/16/",
"https://swapi.co/api/people/18/",
"https://swapi.co/api/people/20/",
"https://swapi.co/api/people/21/",
"https://swapi.co/api/people/22/",
"https://swapi.co/api/people/25/",
"https://swapi.co/api/people/27/",
"https://swapi.co/api/people/28/",
"https://swapi.co/api/people/29/",
"https://swapi.co/api/people/30/",
"https://swapi.co/api/people/31/",
"https://swapi.co/api/people/45/"
],
"planets": [
"https://swapi.co/api/planets/5/",
"https://swapi.co/api/planets/7/",
"https://swapi.co/api/planets/8/",
"https://swapi.co/api/planets/9/",
"https://swapi.co/api/planets/1/"
],
"starships": [
"https://swapi.co/api/starships/15/",
"https://swapi.co/api/starships/10/",
"https://swapi.co/api/starships/11/",
"https://swapi.co/api/starships/12/",
"https://swapi.co/api/starships/22/",
"https://swapi.co/api/starships/23/",
"https://swapi.co/api/starships/27/",
"https://swapi.co/api/starships/28/",
"https://swapi.co/api/starships/29/",
"https://swapi.co/api/starships/3/",
"https://swapi.co/api/starships/17/",
"https://swapi.co/api/starships/2/"
],
"vehicles": [
"https://swapi.co/api/vehicles/8/",
"https://swapi.co/api/vehicles/16/",
"https://swapi.co/api/vehicles/18/",
"https://swapi.co/api/vehicles/19/",
"https://swapi.co/api/vehicles/24/",
"https://swapi.co/api/vehicles/25/",
"https://swapi.co/api/vehicles/26/",
"https://swapi.co/api/vehicles/30/"
],
"species": [
"https://swapi.co/api/species/1/",
"https://swapi.co/api/species/2/",
"https://swapi.co/api/species/3/",
"https://swapi.co/api/species/5/",
"https://swapi.co/api/species/6/",
"https://swapi.co/api/species/8/",
"https://swapi.co/api/species/9/",
"https://swapi.co/api/species/10/",
"https://swapi.co/api/species/15/"
],
"created": "2014-12-18T10:39:33.255000Z",
"edited": "2015-04-11T09:46:05.220365Z",
"url": "https://swapi.co/api/films/3/"
}{
"title": "The Phantom Menace",
"episode_id": 1,
"opening_crawl": "Turmoil has engulfed the\r\nGalactic Republic. The taxation\r\nof trade routes to outlying star\r\nsystems is in dispute.\r\n\r\nHoping to resolve the matter\r\nwith a blockade of deadly\r\nbattleships, the greedy Trade\r\nFederation has stopped all\r\nshipping to the small planet\r\nof Naboo.\r\n\r\nWhile the Congress of the\r\nRepublic endlessly debates\r\nthis alarming chain of events,\r\nthe Supreme Chancellor has\r\nsecretly dispatched two Jedi\r\nKnights, the guardians of\r\npeace and justice in the\r\ngalaxy, to settle the conflict....",
"director": "George Lucas",
"producer": "Rick McCallum",
"release_date": "1999-05-19",
"characters": [
"https://swapi.co/api/people/2/",
"https://swapi.co/api/people/3/",
"https://swapi.co/api/people/10/",
"https://swapi.co/api/people/11/",
"https://swapi.co/api/people/16/",
"https://swapi.co/api/people/20/",
"https://swapi.co/api/people/21/",
"https://swapi.co/api/people/32/",
"https://swapi.co/api/people/33/",
"https://swapi.co/api/people/34/",
"https://swapi.co/api/people/36/",
"https://swapi.co/api/people/37/",
"https://swapi.co/api/people/38/",
"https://swapi.co/api/people/39/",
"https://swapi.co/api/people/40/",
"https://swapi.co/api/people/41/",
"https://swapi.co/api/people/42/",
"https://swapi.co/api/people/43/",
"https://swapi.co/api/people/44/",
"https://swapi.co/api/people/46/",
"https://swapi.co/api/people/48/",
"https://swapi.co/api/people/49/",
"https://swapi.co/api/people/50/",
"https://swapi.co/api/people/51/",
"https://swapi.co/api/people/52/",
"https://swapi.co/api/people/53/",
"https://swapi.co/api/people/54/",
"https://swapi.co/api/people/55/",
"https://swapi.co/api/people/56/",
"https://swapi.co/api/people/57/",
"https://swapi.co/api/people/58/",
"https://swapi.co/api/people/59/",
"https://swapi.co/api/people/47/",
"https://swapi.co/api/people/35/"
],
"planets": [
"https://swapi.co/api/planets/8/",
"https://swapi.co/api/planets/9/",
"https://swapi.co/api/planets/1/"
],
"starships": [
"https://swapi.co/api/starships/40/",
"https://swapi.co/api/starships/41/",
"https://swapi.co/api/starships/31/",
"https://swapi.co/api/starships/32/",
"https://swapi.co/api/starships/39/"
],
"vehicles": [
"https://swapi.co/api/vehicles/33/",
"https://swapi.co/api/vehicles/34/",
"https://swapi.co/api/vehicles/35/",
"https://swapi.co/api/vehicles/36/",
"https://swapi.co/api/vehicles/37/",
"https://swapi.co/api/vehicles/38/",
"https://swapi.co/api/vehicles/42/"
],
"species": [
"https://swapi.co/api/species/1/",
"https://swapi.co/api/species/2/",
"https://swapi.co/api/species/6/",
"https://swapi.co/api/species/11/",
"https://swapi.co/api/species/12/",
"https://swapi.co/api/species/13/",
"https://swapi.co/api/species/14/",
"https://swapi.co/api/species/15/",
"https://swapi.co/api/species/16/",
"https://swapi.co/api/species/17/",
"https://swapi.co/api/species/18/",
"https://swapi.co/api/species/19/",
"https://swapi.co/api/species/20/",
"https://swapi.co/api/species/21/",
"https://swapi.co/api/species/22/",
"https://swapi.co/api/species/23/",
"https://swapi.co/api/species/24/",
"https://swapi.co/api/species/25/",
"https://swapi.co/api/species/26/",
"https://swapi.co/api/species/27/"
],
"created": "2014-12-19T16:52:55.740000Z",
"edited": "2015-04-11T09:45:18.689301Z",
"url": "https://swapi.co/api/films/4/"
}GET api/films/1
GET api/films/2
GET api/films/3
GET api/persons-with-films/1
GET api/persons/1?include-films
GET api/persons/1?include=films,...
App #1
App #2
App #3
App #4
http://graphql.org/swapi-graphql
https://www.amazeelabs.com/en/blog/graphql-introduction
APPLICATION LAYER
DATA QUERYING LANGUAGE
BACKED BY A
SCHEMA
BASED ON A
TYPE SYSTEM
STRONGLY TYPED
THEREFORE INTROSPECTIVE
ARBITRARY CODE
THEREFORE AGNOSTIC
GRAPHQL PARSER
APPLICATION CODE
DABATASE
INTERNAL API
REMOTE API
SCHEMA DEFINITION
?!
Evolving the server–client relationship
Server publishes possibilities
Client specifies concrete data requirements
https://facebook.github.io/graphql
https://github.com/graphql/graphql-js
GraphQL and React
By Sebastian Siemssen
