Slide 1

Slide 1 text

Implementando GraphQL com PHP @alefesouza https://as.dev

Slide 2

Slide 2 text

Alefe Souza @alefesouza https://as.dev Full Stack Developer @alefesouza Programador PHP desde os 17 anos, instrutor de desenvolvimento de software, formado em análise e desenvolvimento de sistemas, Microsoft Specialist em tecnologias web.

Slide 3

Slide 3 text

Agenda • O que é GraphQL • Conceitos básicos • Demo • Implementação em Laravel • Implementação no front-end @alefesouza https://as.dev

Slide 4

Slide 4 text

@alefesouza https://as.dev GraphQL? Uma especificação de linguagem de consulta de APIs, desenvolvida pelo Facebook.

Slide 5

Slide 5 text

@alefesouza https://as.dev GraphQL? Baseado em apenas um endpoint.

Slide 6

Slide 6 text

@alefesouza https://as.dev GraphQL? Fortemente tipada.

Slide 7

Slide 7 text

@alefesouza https://as.dev GraphQL? Documentação automática.

Slide 8

Slide 8 text

@alefesouza https://as.dev Conceitos básicos ● Tipos ● Queries ● Mutations

Slide 9

Slide 9 text

@alefesouza https://as.dev Tipos Permitem especificar objetos de entrada e saída, impedindo a requisição caso ocorra algo fora do padrão.

Slide 10

Slide 10 text

@alefesouza https://as.dev Queries Utilizadas para consultas no endpoint único, também é muito fácil de solicitar apenas o que os campos necessários.

Slide 11

Slide 11 text

@alefesouza https://as.dev Mutations Utilizadas para realizar qualquer tipo de alteração nos dados, equivalente ao POST, PUT, PATCH, DELETE, identificados pelo nome.

Slide 12

Slide 12 text

@alefesouza https://as.dev Onde funciona?

Slide 13

Slide 13 text

@alefesouza https://as.dev Onde funciona?

Slide 14

Slide 14 text

@alefesouza https://as.dev Quem utiliza?

Slide 15

Slide 15 text

@alefesouza https://as.dev $ composer install webonyx/graphql-php Como iniciar?

Slide 16

Slide 16 text

@alefesouza https://as.dev Demo! http://bit.ly/talk-graphql-php

Slide 17

Slide 17 text

@alefesouza https://as.dev Implementação no Laravel $ composer install rebing/graphql-laravel $ php artisan vendor:publish --provider="Rebing\GraphQL\GraphQLServiceProvider"

Slide 18

Slide 18 text

@alefesouza https://as.dev Implementação no front-end $ npm install --save vue-apollo graphql apollo-boost

Slide 19

Slide 19 text

@alefesouza https://as.dev Implementação no front-end import VueApollo from 'vue-apollo'; import ApolloClient from 'apollo-boost'; import App from './App.vue'; Vue.use(VueApollo); const apolloClient = new ApolloClient(); const apolloProvider = new VueApollo({ defaultClient: apolloClient, }); new Vue({ el: '#app', apolloProvider, render: h => h(App), });

Slide 20

Slide 20 text

@alefesouza https://as.dev
Carregando...
Houve um erro
  • Nome: {{ user.name }}
    E-mail: {{ user.email }}
    Empresa: {{ user.company.name }}

Slide 21

Slide 21 text

@alefesouza https://as.dev
Carregando...
Houve um erro
Nome: {{ data.user.name }}
E-mail: {{ data.user.email }}
Empresa: {{ data.user.company.name }}

Slide 22

Slide 22 text

@alefesouza https://as.dev
Nome:
E-mail:
ID da empresa:
Salvar

Ocorreu um erro: {{ error }}

Slide 23

Slide 23 text

@alefesouza https://as.dev Obrigado! @alefesouza https://bit.ly/talk-graphql-php https://bit.ly/talk-laravel-vue-graphql