Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
Introdução ao GraphQL
Search
Dan Vitoriano
December 12, 2017
Programming
310
3
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Introdução ao GraphQL
Apresentada no Meetup React SP no Cubo em São Paulo.
Dan Vitoriano
December 12, 2017
More Decks by Dan Vitoriano
See All by Dan Vitoriano
Produtos & Agilidade na Visão Dev
danvitoriano
1
430
Modelos de Maturidade de Times de Alta Performance
danvitoriano
1
120
Google Material Design
danvitoriano
3
380
FEMUG ABC
danvitoriano
2
120
Other Decks in Programming
See All in Programming
ソニーのクラウド共通基盤の変遷とAI時代の開発スタイルに合わせた進化 / The Journey of Sony’s Common Cloud Platform and Its Evolution for AI-Native Development
kenjiyoneyama
0
240
見えないものを探る要求要件定義に必要な基本的思考 / invisible-requirement-thinking
minodriven
15
7.9k
パーソナライズPodcastを作った話
repunit11
0
130
外から家のPCの電源入れたい!をPHPで解決する
kawashimo0
1
120
AI が書く Go コードの品質を劇的に向上させる Linter: “declscope”
mpyw
0
480
Augmenting AI with the Power of Jakarta EE
ivargrimstad
0
570
Everything will be SERVERLESS — 信じて運用した10年の経験値 / Everything Will be Serverless — Lessons Learned from 10 Years of Operational Experience
seike460
PRO
1
850
Heart of Swift Concurrency
koher
0
1.2k
気持ちぃ〜角丸 Squircle
ryu1013
0
120
Verilogで学ぶCPU自作入門
uyuki234
8
4k
Simple Storage Service(S3) is not simple
iwatsukayura
0
220
mrbgem 三角測量 開発
ogom
0
210
Featured
See All Featured
A Soul's Torment
seathinner
8
3.7k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
254
22k
The Director’s Chair: Orchestrating AI for Truly Effective Learning
tmiket
1
320
Agile that works and the tools we love
rasmusluckow
331
22k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
18k
Digital Ethics as a Driver of Design Innovation
axbom
PRO
1
450
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
9
1.6k
Data-driven link building: lessons from a $708K investment (BrightonSEO talk)
szymonslowik
1
1.4k
Why Your Marketing Sucks and What You Can Do About It - Sophie Logan
marketingsoph
0
420
Measuring Dark Social's Impact On Conversion and Attribution
stephenakadiri
2
300
Side Projects
sachag
456
43k
Jess Joyce - The Pitfalls of Following Frameworks
techseoconnect
PRO
1
440
Transcript
GraphQL A Graph Query Language to your API Danilo Vitoriano
Meetup React SP @Cubo.Network Dezembro 2017
Baseado na apresentação GraphQL & Relay de @zetavg
Introdução
API "Application Programming Interface” “Interface de Programação de Aplicativos"
RESTful A evolução da API “Representation State Transfer” “Transferência de
Estado Representacional”
/api/posts.json?cover=true&include=author,comments,avatar REST API da bagunça
A Solução
GraphQL Uma linguagem para consulta através de Grafos
Grafo Conjunto onde os elementos são unidos por um arco
None
None
Breve História • 2012 - Utilizada pelo app mobile do
Facebook • 2015 - Lançada publicamente • 2016 - GitHub usa GraphQL para APIs públicas
2017 Assunto de maior interesse da React Conf Brasil
Fotos: Leandro Godoi Sashko Stubailo Apollo James Bailey Meteor Raphael
Costa Pipefy
Quem usa http://graphql.org/users/
Bibliotecas https://github.com/chentsulin/awesome-graphql
Ecossistema
2017 GraphQL & Relay re-licenciados sob Licença MIT
Visão Geral
Todos os dados da sua aplicação podem ser representados como
um grafo
None
Um subgrupo do grafo é utilizado para montar uma
Interface do Usuário (UI)
None
None
None
None
Conceitos Básicos de GraphQL
Consulta (Query) Básica
• Comece selecionando os campos na raiz da “consulta"
• Consulta aninhadas
Árvore de Consulta
• Cada consulta é uma árvore extraída do grafo
None
• Árvore da consulta
Tipos
• Receba o tipo de cada nó usando o metacampo
__typename
Documentando Tipos
Documentar os tipos de dados de cada nó facilita quando
você precisa consultar alguma informação
None
Argumentos
• Cada campo pode definir alguns argumentos nele
• Campos aninhados também possuem argumentos
Fragmentos
• Pré definido conjunto de campos como fragmento de
informação
Dados mutáveis com Mutation
• Use mutation ao invés de query, e coloque
dados nos argumentos
Resumo
http://graphql.org
• Descreva seus dados
• Pergunte pelo o que você deseja
• Receba resultados previsíveis
Bibliotecas Cliente Como consumo GraphQL?
Apollo GraphQL https://www.apollographql.com/
Relay https://facebook.github.io/relay/
Obrigado Danilo Vitoriano @dnvtrn Especialista em TI Foto: Leandro Godoi
reactconfbr.com.br
Foto por Rafael Ventura Apresentação no Cubo Network 12/12/2017