GraphQL parte 3: integrando com sua aplicação | Alura Cursos Online
Primeiras aulas do curso GraphQL parte 3: integrando com sua aplicação
GraphQL parte 3: integrando com sua aplicação
Iniciando o servidor GraphQL - Introdução
Olá, tudo bem com você? Eu sou a Juliana e vou te acompanhar durante este curso de Graphql. Nós iremos entrar mais fundo no Graphql e entender como integramos ele no nosso frontend. No nosso caso, estamos usando o react na nossa aplicação. Atualmente consumimos uma API rest e iremos migrar dela para uma API Graphql.
No final do curso, teremos terminado nossos clientes e feito queries e mutation nos nossos pets utilizando outra ferramenta, que é o Apollo. Iremos usar o Apollo client para react e vamos entender melhor como funcionam queries, mutation, o que o Apollo acrescenta, como podemos organizar nosso projeto.
Junto com tudo isso vamos entrar bastante no playground e usar muito a documentação nativa do Graphql. Nos vemos durante o curso.
Iniciando o servidor GraphQL - Setup do Projeto
Olá. Vamos fazer agora nossa configuração inicial básica para rodar os servidores. Para isso, preciso que vocês já tenham baixado nossos dois repositórios iniciais, que é o de front, com o aplicativo, e o de rest, com a API. Peço também que vocês já tenham instalado tudo que pedimos para instalar na pasta anterior.
Primeiro, vou abrir o WorkBench, entrar com a senha e criar um novo scheme, chamado agenda petshop. Dou um apply e ele cria o scheme. Rodando os projetos, entro na pasta e vou digitar npm install, para instalar todas as dependências que vieram junto com o projeto. Pode ser que seja rápido ou pode demorar.
Terminada a instalação, dou um npm start para colocar nosso servidor no ar. Ele vai abrir uma aba para nós e carregar o aplicativo. Só que não tem nenhum cliente sendo listado, porque ele está buscando dados dentro da API e nós não subimos ela ainda.
Vou abrir uma nova aba, sem fechar a antiga, entrar na pasta agenda petshop, mas do rest. Aqui dentro dou o npm install. Ele vai colocar a API, instalar tudo que precisamos, e vamos subir ele no ar. Damos o start também, para ele fazer algumas outras configurações.
Executando a página, temos os dados aparecendo. Conseguimos visualizar, está funcionando. É o que precisávamos.
Iniciando o servidor GraphQL - Conhecendo o playground
Então, o primeiro passo que temos que fazer para começar a migração do nosso API Graphql ao invés da API rest é subir a API Graphql. Vou clonar do repositório, abrir mais uma linha de comando e dar um get clone, porque em algum ponto da aplicação usaremos a rest e a Graphql. Eventualmente ele vai ter só Graphql, mas até lá vamos usar os dois.
Vou entrar na nossa pasta e dar o npm install para ele instalar todas as dependências. Terminando, podemos rodar o npm start. Ele subiu o servidor. Por padrão, ele vai subir sempre na porta 4000. Vamos dar uma olhada.
Aqui é o playground do Graphql, e ele tem várias funções bem legais. A mais importante, sem dúvida, é a documentação. Nela, vamos ter todos os dados, as formas que podemos consumir, como vamos consumir. Iremos usar muito isso durante o curso, porque é através dele que vamos entender certinho como vamos pegar os dados, o que podemos pegar, o que temos que usar. É onde vamos rodar queries ou mutations.
Sobre o curso GraphQL parte 3: integrando com sua aplicação
O curso GraphQL parte 3: integrando com sua aplicação possui 108 minutos de vídeos, em um total de 44 atividades. Gostou? Conheça nossos outros cursos de Node.JS em Programação, ou leia nossos artigos de Programação.