Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Introdução ao GraphQL
Search
Sponsored
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
Dan Vitoriano
December 12, 2017
Programming
3
290
Introdução ao GraphQL
Apresentada no Meetup React SP no Cubo em São Paulo.
Dan Vitoriano
December 12, 2017
Tweet
Share
More Decks by Dan Vitoriano
See All by Dan Vitoriano
Produtos & Agilidade na Visão Dev
danvitoriano
1
410
Modelos de Maturidade de Times de Alta Performance
danvitoriano
1
100
Google Material Design
danvitoriano
3
340
FEMUG ABC
danvitoriano
2
100
Other Decks in Programming
See All in Programming
HTTPプロトコル正しく理解していますか? 〜かわいい猫と共に学ぼう。ฅ^•ω•^ฅ ニャ〜
hekuchan
2
680
AIエージェントのキホンから学ぶ「エージェンティックコーディング」実践入門
masahiro_nishimi
5
430
AIによる開発の民主化を支える コンテキスト管理のこれまでとこれから
mulyu
3
240
コマンドとリード間の連携に対する脅威分析フレームワーク
pandayumi
1
450
AIによる高速開発をどう制御するか? ガードレール設置で開発速度と品質を両立させたチームの事例
tonkotsuboy_com
7
2.3k
Patterns of Patterns
denyspoltorak
0
1.4k
OCaml 5でモダンな並列プログラミングを Enjoyしよう!
haochenx
0
140
コントリビューターによるDenoのすゝめ / Deno Recommendations by a Contributor
petamoriken
0
200
インターン生でもAuth0で認証基盤刷新が出来るのか
taku271
0
190
Spinner 軸ズレ現象を調べたらレンダリング深淵に飲まれた #レバテックMeetup
bengo4com
1
230
Smart Handoff/Pickup ガイド - Claude Code セッション管理
yukiigarashi
0
130
Implementation Patterns
denyspoltorak
0
280
Featured
See All Featured
Why Mistakes Are the Best Teachers: Turning Failure into a Pathway for Growth
auna
0
51
A Modern Web Designer's Workflow
chriscoyier
698
190k
Introduction to Domain-Driven Design and Collaborative software design
baasie
1
580
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
31
9.9k
What Being in a Rock Band Can Teach Us About Real World SEO
427marketing
0
170
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
17k
Leveraging LLMs for student feedback in introductory data science courses - posit::conf(2025)
minecr
0
140
Lessons Learnt from Crawling 1000+ Websites
charlesmeaden
PRO
1
1.1k
DBのスキルで生き残る技術 - AI時代におけるテーブル設計の勘所
soudai
PRO
62
49k
Music & Morning Musume
bryan
47
7.1k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
37
6.3k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
31
3.1k
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