[FRONT IN VALE - 2019] - INTRODUÇÃO AO MARAVILHOSO MUNDO DO GRAPHQL

Transcript

1. Maravilhoso mundo do Graphql INTRODUÇÃO AO
2. @kamila_code kamilahsantos /kamila-santos-oliveira @kamilah_santos Kamila Santos, 21 anos Developer @devsjavagirl
3. Quem é esse tal de Graphql Linguagem de consulta baseada em grafos, criada pelo Facebook em 2012
4. Quem é esse tal de Graphql O retorno dos dados é totalmente previsível, e tornou open-source em 2015.
5. Quem usa Graphql?
6. É tipo Rest? NÃO
7. É tipo Rest? Em Rest, ao realizar buscas, temos vários endpoints, no GraphQl só temos um endpoint para acessar os dados do servidor
8. É tipo Rest? Em Rest temos estrutura de dados fixa, o que faz com que sempre traga mais dados do que o necessário
9. É tipo Rest? No Graphql trazemos exatamente o que precisamos da nossa API através da construção de queries.
10. Como funciona?
11. Como funciona? Query language, server-side runtime para execução dessas queries a partir da definição de schema (tipagem)
12. Como funciona? Não está vinculado a nenhum banco de dados específico ou mecanismo de armazenamento.
13. Como funciona? Um service é criado definindo types e fields e depois criando funções para cada type e cada field
14. Como funciona?
15. Como funciona?
16. Queries? Com o seu service em execução, podemos enviar queries para serem validadas e executadas.
17. Queries? Um query é recebida e verificada para que somente retorne os types e fields informados na query e depois é executada
18. Queries?
19. Queries?
20. Fields? As queries solicitam fields específicos em objetos .
21. Fields?
22. Fields? As queries em Graphql permitem percorrer objetos relacionados e seus campos em uma única solicitação
23. Fields?
24. Fields?
25. Arguments? Além de atravessar pelos objetos e campos podemos passar argumentos na busca desses dados
26. Arguments?
27. Arguments?
28. Arguments? Podemos passar argumentos para campos escalares, para fazer conversões de dados no server em vez de cada client individualmente.
29. Arguments?
30. Arguments?
31. Aliases Os fields do objeto do resultado correspondem ao nome do campo na consulta, não seria possível consultar diretamente o mesmo campo com argumentos diferentes.
32. Aliases Para resolver isto, podemos criar aliases, para renomear o resultado do campo para algo mais descritivo que deseje.
33. Aliases
34. Aliases
35. Fragments Imagine uma situação que você tem duas pessoas e quer exibi-las lado a lado junto com seus amigos, precisaríamos repetir os campos um para cada lado da comparação?
36. Fragments NÃO. Com os fragments podemos construir conjuntos de campos e inclui-los nas consultas necessárias
37. Fragments
38. Fragments
39. Fragments
40. Fragments A ideia dos fragments é recomendada em situações em que precisamos dividir os requisitos de dados do aplicativo em parte menores, quando precisa combinar componentes da UI com vários fragments diferentes numa busca inicial.
41. Usando variables em fragments Temos a possibilidade de usar variáveis nos fragments das nossas consultas
42. Usando variables em fragments
43. Usando variables em fragments
44. Usando variables em fragments
45. Variáveis Para argumentos dinâmicos, o client pode precisar manipular os arquivos em runtime e seriariza-la em formato em Graphql.
46. Variáveis O Graphql vai pegar esses dados e passar como um dicionário separado.
47. Variáveis Substitua o valor estático na consulta por $variableName
48. Variáveis Declarar $variableNamecomo uma das variáveis aceitas pela consulta
49. Variáveis Passe variableName: value no dicionário de variáveis separado, específico do transporte (geralmente JSON)
50. Variáveis
51. Variáveis
52. Directives Podem ser anexadas a um field ou inclusão de fragment, podendo alterar a execução da consulta da forma que o servidor desejar
53. Directives @include(if: Boolean) Inclui somente se o resultado do campo é true @skip(if: Boolean) pula o argumento se o elemento for true
54. Directives
55. Directives
56. Directives
57. Mutations? Da mesma forma que as Queries, nas Mutations podemos passar campos aninhados
58. Mutations?
59. Mutations?
60. Mutations?
61. Schemas and Types
62. Schemas and Types
63. Interfaces Abstrai um conjunto de campos para serem implementados
64. Interfaces
65. Interfaces
66. Interfaces
67. Servers Clients
68. Referências https://graphql.org/learn https://graphql.org/code/#server-libraries https://graphql.org/code/#graphql-clients https://tableless.com.br/graphql-a-nova-era-d as-apis-web/
69. Referências https://speakerdeck.com/ketemartinsrufino/gr aphql-para-reduzir-complexidade-no-front-e-n o-back https://www.slideshare.net/PaulaSantana12?ut m_campaign=profiletracking&utm_medium=ss site&utm_source=ssslideview
70. Referências https://medium.com/idexo-developers/graphql -e-rest-quais-as-diferen%C3%A7as-99cae22871 a7 https://www.apollographql.com/ https://relay.dev/
71. Referências https://www.graph.cool/ https://hasura.io/
72. Obrigada <3