GraphQL na Era das APIs

GraphQL na Era das APIs
Daniel Varanda
API Specialist | Solution Architect
daniel.varanda@sensedia.com
http://linkedin.com/in/danielvaranda
Daniel Varanda trabalha há 18 anos em TI. Sua missão
é projetar arquiteturas de soluções focadas em garantir
o sucesso dos projetos de TI e contribuir para o
aumento da maturidade das empresas nas estratégias
de APIs, Microservices e Cloud Solutions.

Agenda
❖ APIs
❖ RESTful
❖ GrapghQL
❖ Dicas e Boas Práticas
❖ Ecossistema GraphQL
❖ Pontos de Atenção
❖ GraphQL em poucas palavras

API (em português: Interface de Programação de Aplicação), é um conjunto de
rotinas e padrões estabelecidos por um software para utilização de suas
funcionalidades por aplicativos que não pretendem envolver-se em detalhes
de implementação do software, mas apenas utilizar suas funcionalidades.
Exemplos: RMI, JMS, trocas de arquivo
Web API é uma das formas possíveis para construção de APIs, onde as trocas
de informações entre as aplicações são feitas através da Internet (mais
especificamente através do protocolo de transporte HTTP).
Exemplos: WebService SOAP, RESTful, GraphQL
API

RESTfulAPI
Backend
RESTful API
APIGateway
Client App
GET: http://api.sensedia.com/produtos/123
Database
Database
Database
HTTP Status: 200
{
"id": 123,
"nome": "API Management Suite",
"descricao": "Exponha APIs de forma rápida e segura."
}
Request
JSON Payload

RESTful API
Imagine que precisamos construir uma aplicação na qual sejam
obtidos todos os nossos amigos do Facebook que curtiram a
página do Sérgio Moro

RESTful API
Consulta em RESTful
1. Um GET em:
GET: me/friends
2. Agora para cada um dos “N” amigos retornados, temos que fazer um GET em:
GET: me/friends/{friend_id}/pages?page_name=Sérgio Moro

RESTful API
Bem que o Facebook poderia ter o seguinte recurso:
GET: me/friendsLikedPage?page_name=Sérgio Moro

Quando as APIs são de uso interno, até podemos fazer um
workaround para resolver determinados problemas
Mas isso não é escalável!
● Demanda implementações específicas (ou caso a caso)
● Mais tempo de desenvolvimento
● Novas recursos a serem mantidos
● E muito mais...
RESTful API

Em uma estratégia de Open APIs, é impossível prever
todas necessidades que os desenvolvedores de
aplicativos terão sobre nossas APIs
RESTful API

GraphQL API
GraphQL é uma Declarative
Query Language
Uma especificação para
interações client/server
Independente de data store
Independente de plataforma
Desenvolvido em 2012 pela equipe do
Facebook e Open source desde Julho
de 2015
Utilizado principalmente para
melhorar a performance e experiência
de uso de aplicações Mobile

Facebook
Quem está utilizando GraphQL?
Github Pinterest
Coursera Shopify Natura
Intruit
E muitos outros...
Os aplicativos móveis do Facebook utilizam a API GraphQL desde 2012
Desde que se tornou Open Source, em 2015, muitas outras equipes e
de todos os tamanhos também vêm utilizando GraphQL

GraphQL API
Descreva seu dado
type Project {
name: String
tagline: String
contributors: [User]
}
Diga o que você quer
{
project(name: "GraphQL") {
tagline
}
}
Obtenha o resultado
{
"project": {
"tagline": "A query language for APIs"
}
}

Backend
GraphQL API
GraphQL-Server
APIGateway
Client App
POST: http://api.sensedia.com/graphQL
{
produto(id: 123) {
id
nome
}
}
Database
Database
Database
HTTP Status: 200
{
"data": {
"produto": {
"id": 123,
"name": "API Management Suite"
}
}
}
GraphQL Query
JSON Payload
Validation
Resolver
Producing the result

GraphQL API
Queries
Análogo a operação GET do Restful

GraphQL API
{
"data": {
"person": {
"id": "cGVvcGxlOjE=",
"name": "Luke Skywalker",
"gender": "male",
"height": 172,
"mass": 77,
"birthYear": "19BBY",
"skinColor": "fair",
"hairColor": "blond",
"eyeColor": "blue"
}
}
}
Response - JSON e dados solicitados
{
person(id: "cGVvcGxlOjE=") {
id
name
gender
height
mass
birthYear
skinColor
hairColor
eyeColor
}
}
Request
Declarative query language
O client declara os dados que precisa e a resposta é um espelho da entrada

GraphQL API
{
"data": {
"starship": {
"id": "c3RhcnNoaXBzOjI=",
"length": 150
},
"film": {
"id": "ZmlsbXM6MQ==",
"title": "A New Hope"
}
}
}
{
starship(id: "c3RhcnNoaXBzOjI=") {
id
length
}
film(id: "ZmlsbXM6MQ==") {
id
title
}
}
Request
Permite múltiplas queries na mesma requisição

GraphQL API
{
"data": {
"starship": {
"id": " 1",
"length": 150,
"model": "CR90 corvette",
"manufacturers": [
"Corellian Engineering Corporation"
]
}
}
}
{
starship(id: " 1") {
id
length
}
starship(id: " 1") {
model
manufacturers
}
}
Request
Merge da mesma instância de objeto

GraphQL API
{
"data": {
"starship1": {
"id": "1",
"length": 150
},
"starship2": {
"id": "2",
"length": 1600
}
}
}
{
starship1: starship(id: " 1") {
id
length
}
starship2: starship(id: " 2") {
id
length
}
}
Request
Alias: evitando conflitos entre instâncias diferentes do mesmo objeto

GraphQL API
{
"data": {
"film": {
"title": "A New Hope",
"speciesConnection ": {
"edges": [
{
"node": {
"id": "c3BlY2llczox",
"name": "Human"
}
},
...
{
id
title
speciesConnection {
edges {
node {
id
name
}
}
}
}
}
Request
Objetos aninhados

GraphQL API
{
"data": {
"film": {
"speciesConnection ": {
"edges": [
{
"node": {
"id": "c3BlY2llczox",
" filmConnection ": {
"edges": [
{
"node": {
"id": "ZmlsbXM6MQ=="
}
},
...
{
id
speciesConnection {
edges {
node {
id
filmConnection {
edges {
node {
id
}
}
}
}
}
}
}
}
Request
Permite inclusive referências cíclicas

GraphQL API
{
"data": {
"person": {
"gender": "male",
"height": 172,
}
}
}
{
id
name
gender
height( unit: METER )
}
}
Request
Argumentos
Cada atributo e objeto aninhado pode ter seu próprio conjunto de argumentos

GraphQL API
{
"data": {
"film": {
"created": " 2014-12-10"
}
}
}
{
id
created( format: "YYYY-MM-DD" )
}
}
Request
Argumentos

GraphQL API
{
"data": {
"allFilms": {
"edges": [
{
"node": {
"id": "ZmlsbXM6Ng==",
"speciesConnection": {
"species": [
{
"id": "c3BlY2llczox"
}
],
"totalCount": 40
}
}
...
{
allFilms( last:1,
orderBy: {field: id ,
direction: DESC} ) {
edges {
node {
id
speciesConnection( first: 1) {
species {
id
}
totalCount
}
}
}
}
}
Request
Paginação

GraphQL API
{
"data": {
"allFilms": {
"edges": [
{
"node": {
"starshipConnection": {
"edges": [
{
"node": {
"name": "CR90 corvette"
}
},
...
query($registros: Int=1, $expand: Boolean=true) {
allFilms(first: $registros) {
edges {
node {
starshipConnection @include(if: $expand) {
edges {
node {
name
}
}
}
}
}
}
}
{
"rgistros": 1,
"expand": true
}
Request
Variáveis e Directivas

GraphQL API
{
"data": {
"person": {
"gender": "male",
"height": 172,
"mass": 77
}
}
}
{
id
...Atributos
}
}
fragment Atributos on Person {
name
gender
height
mass
}
Request
Fragmentos

GraphQL API
{
"data": {
"search": [
{
"__typename": "Human" ,
"name": "H an Solo"
},
{
"__typename": "Human" ,
"name": "Leia Org ana"
},
{
"__typename": "Starship" ,
"name": "TIE Adv anced x1"
}
]
}
}
{
search(text: " an") {
__typename
... on Human {
name
}
... on Droid {
name
}
... on Starship {
name
}
}
}
Request
Uniões e Polimorfismo
Situações em que você não sabe o tipo de retorno, você precisará de alguma maneira para determinar como
lidar com esses dados no cliente

GraphQL API
Mutações
Análogo as operações POST / PUT / DELETE do Restful
Enquanto que as Queries são executados em paralelo, as mutação são executados
em série, uma após a outra. Isto significa que, se enviarmos duas mutações de
“IncrementoDeCredito”, o primeiro irá terminar antes que o segundo inicie

GraphQL API
{
"data": {
"CreatePerson": {
"id": "123",
"name": "Daniel Varanda"
}
}
}
mutation {
CreatePerson(name: "Daniel Varanda") {
id
name
}
}
Request
Mutações
Caso a operação de mutação retorne um objeto, você pode solicitar atributos específicos e objetos aninhados

GraphQL API
{
"data": {
"DeletePerson": {
"deleted": true
}
}
}
mutation {
DeletePerson(id: "123")
}
Request
Mutações

GraphQL API
{
"data": {
"UpdatePerson": null
},
"errors": [
{
"message": "Person not found",
"path": [
"UpdatePerson"
],
}
]
}
mutation {
UpdatePerson(id: "123")
}
Request
Mutações e Validações

Dicas e Boas Práticas
Use primeiro para APIs internas, ou para uso externo restrito
Use para melhorar a experiências/performance de APPs que consomem
dados de backends
Tenha cuidado em expor para o mundo!
Não permita queries arbitrárias (sem controle) de um client
desconhecido
1
2
3

GraphQL Clients
● JavaScript - Relay, Apollo Client, Lokka
● Swift / iOS - Apollo iOS
● Java / Android - Apollo Android
● C# / .NET - graphql-net-client
Ecossistema GraphQL

Server Libraries
● JavaScript - GraphQL.js, express-graphql, graphql-server
● Ruby - graphql-ruby
● Python - Graphene
● Scala - Sangria
● Java - graphql-java
● Clojure - alumbra, graphql-clj, lacinia
● Go - graphql-go, graphql-relay-go, neelance/graphql-go
● PHP - graphql-php, graphql-relay-php
● C# / .NET - graphql-dotnet, graphql-net
● Elixir - absinthe, graphql-elixir
Ecossistema GraphQL

IDE for Documentation and exploring GraphQL
● GitHub: https://github.com/graphql/graphiql
● Exemplo: http://graphql.org/swapi-graphql/
Ecossistema GraphQL

Pontos de Atenção
As operações não são claras como em
REST - GET/POST/PUT/DELETE...
Todo retorno é HTTP 200 OK
Mais poder para os developers de
APPs
Não facilita o lado de prover as APIs
Não resolve sozinho os problemas (esforço) de design
Efeito colateral de utilizar mais dados de
entrada na chamada e uso do servidor
(processamento)
Dificuldade em fazer troubleshooting de problemas e
dar suporte aos desenvolvedores de APPs

Pontos de Atenção
Trace GraphQL

Pontos de Atenção
Trace RESTful

❖ Único endpoint
❖ A query language for your API
❖ Pedir o que você precisa e obter exatamente isso (nada mais, nada menos)
❖ Obtenha muitos recursos em um único pedido
❖ Descrever o que é possível com um sistema de tipagem
❖ Mova-se mais rápido com poderosas ferramentas de desenvolvedor
❖ Evolua sua API sem necessidade de versionamento
❖ Utilize o suas próprias bases de dados e código
GraphQL em poucas palavras

Obrigado!
Daniel Varanda
API Specialist | Solution Architect
daniel.varanda@sensedia.com
http://linkedin.com/in/danielvaranda

GraphQL na Era das APIs

Recomendados

Recomendados

Mais conteúdo relacionado

Semelhante a GraphQL na Era das APIs

Semelhante a GraphQL na Era das APIs (20)

GraphQL na Era das APIs