Já faz bastante tempo que o WordPress deixou de ser uma plataforma para blogs e se tornou um excelente gerenciador de conteúdo (CMS) que permite servir dados para diferentes aplicações desktop, web e mobile. GraphQL é uma linguagem de consulta, desenvolvida pelo facebook, que serve para fazer requisições e entregar apenas o resultado solicitado na ordem que este foi solicitado. Nesta apresentação vamos ver: GraphQL e REST, em que se assemelham e quais as vantagens de utilizar GraphQL em relação a REST; Quando utilizar GraphQL com WordPress é uma boa ideia; Como utilizar GraphQL com WordPress através do plugin WPGraphQL (https://github.com/wp-graphql/wp-graphql); Consultas e mutações de dados WordPress através de uma ferramenta de exploração de dados chamada GraphiQL; Exemplos de soluções para aplicativos desacoplados utilizando GraphQL.

1. GraphQL e WordPress,
uma bonita união
Leo Baiano

2. Ajude as fadinhas
… não use query_posts( );

3. pre_get_posts();
Preguetinho
para os íntimos.

4. Leo Baiano
● Programador desde 2001;
● 9 anos trabalhando em
agências
● Passou pela revista istoÉ
● Programador Senior na
Descomplica

5. O que é GraphQL
GraphQL é uma linguagem de
consulta de dados
desenvolvida e usada pelo
Facebook para realizar
requisições e entregar
informações para aplicações
web e mobile.
Fonte: Tableless

6. Princípios básicos do GraphQL
No GraphQL temos 3 estruturas principais:
Query;
Mutation;
Subscription.

7. Princípios básicos do GraphQL
Em uma API GraphQL nós precisamos criar Types para representar
cada estrutura de dados.
Type Post {
ID: ID,
title: String!,
author: Author,
categories: Terms
}
Type Author {
ID: ID,
name: String!
...
}
Type Terms {
ID: ID,
name: String!
...
}

8. Princípios básicos do GraphQL
Com nossos types definidos nós podemos expor consultas dentro
da nossa API através do objeto query. Para simplificar você pode
entender o exemplo abaixo como se fosse um endpoint de uma API
REST.
Type Query {
posts( id: String): Post
}
Querys

9. Princípios básicos do GraphQL
{
query {
posts(id:$id) {
title
categorias {
name
}
author {
name
}
}
}
}
// Variáveis
{
id: 1
}
Querys

10. Princípios básicos do GraphQL
Mutations
As mutations possuem um princípio parecido com o das query,
porém são utilizadas para a inserção de dados. Abaixo um exemplo
de criação de uma mutation.
Type Mutation {
inserirPosts( post: Post): Post
}

11. Princípios básicos do GraphQL
{
mutation {
inserirPost(post: $post) {
id,
title,
}
}
}
// Variáveis
{
title: "Titulo do post"
}
Mutation

12. Princípios básicos do GraphQL
Subscriptions
As subscriptions permitem reagir a modificações de informações
no servidor dentro de um cliente de uma API GraphQL em tempo
real.

13. O GraphQL precisa saber onde buscar e inserir informações, para
isso utilizamos resolver. Uma mesma API GraphQL pode possuir
diversos resolver, isso significa que podemos trabalhar com mysql,
MongoDB e qualquer outra fonte de dados dentro da mesma API.
Princípios básicos do GraphQL
Resolver

14. Porque precisamos dela se já
temos o REST?
Calmaaaaaa garoto!

15. GraphQL VS REST - As vantagens do GraphQL
- Com GraphQL é possível solicitar, em uma única requisição, todos
os dados que você precisa e receber apenas os dados que você
especificar;
- Tem muito mais liberdade para criar consultas e filtros complexos
sem precisar modificar a API;
- Apenas uma requisição HTTP.

16. GraphQL: Exemplo 1 - trazendo só o necessário
Lista de posts com título, link e descrição

17. REST - Exemplo 1 - trás tudo
Lista de posts com título, link e descrição

18. GraphQL - Exemplo 2 - Uma única requisição
Lista de posts com título e nome do autor

19. REST - Exemplo 2 - Cadê o autor?
Lista de posts com título e nome do autor

20. Eu gostei, mas e o WP???
Caaaaaaaaalma garoto!

21. Plugin WP-GraphQL
https://github.com/wp-graphql/wp-graphql
WPGraphQL é um plugin WordPress gratuito e de código aberto que
oferece um esquema e API GraphQL extensível para qualquer site
WordPress.
O WPGraphQL fornece uma API GraphQL e / ponto de extremidade
graphql para o seu site WordPress, permitindo a interação com
dados do WordPress usando consultas e mutações do GraphQL.

22. Plugin WP-GraphQL
https://github.com/wp-graphql/wp-graphql/wiki/Action-and-Filter-Reference
O WP-GraphQL tem uma série de actions e filters, assim como o WP
e plugins mais robustos, com o WooCommerce, você consegue ver
uma lista na URL acima.
Para executar querys ou mutations GraphQL direto no seu tema
WordPress normal é possível utilizar a action do_graphql_request

23. Plugin WP-GraphQL
do_graphql_request
<?php
$query = '{
posts {
edges {
node {
title
}
}
}
}';
$data = do_graphql_request( $query );

24. Plugin WP-GraphiQL
https://github.com/wp-graphql/wp-graphiql

25. Fim!
@wpsampa
@leobaiano