Dando continuidade à nossa série sobre Comunicação entre Sistemas, após explorarmos a maturidade do padrão REST, hoje avançamos para uma tecnologia que revolucionou a forma como consumimos dados, especialmente em dispositivos móveis: o GraphQL.Na NetExperts, como especialistas em infraestrutura e desenvolvimento, vemos o GraphQL não apenas como uma alternativa ao REST, mas como o motor principal para uma arquitetura de alta performance chamada BFF (Backend For Frontend).
O que é o padrão BFF (Backend For Frontend)?
O BFF é uma camada de backend intermediária, desenhada especificamente para atender às necessidades de uma interface de usuário particular (como um aplicativo iOS, Android ou um painel Web).
Em arquiteturas tradicionais, o frontend muitas vezes precisa consultar múltiplos microsserviços para montar uma única tela. O BFF centraliza essas chamadas:
- Agregação: Ele busca dados de diferentes fontes (bancos de dados ou APIs REST legadas) e consolida tudo em uma única resposta.
- Customização: Entrega apenas o que aquela interface específica precisa, sem carregar dados inúteis.
- Segurança: Atua como um proxy, escondendo a complexidade e os endereços internos da sua infraestrutura.
Por que o GraphQL Reina no BFF?
O GraphQL é a linguagem de consulta perfeita para essa camada intermediária. Enquanto no REST o servidor impõe a estrutura do dado, no GraphQL o cliente solicita exatamente o que deseja.
A Otimização Vital para o Mobile
Aplicações móveis enfrentam desafios como latência de rede e consumo de bateria. O uso de GraphQL no BFF resolve dois problemas críticos:
- Overfetching: O app não baixa informações desnecessárias. Se a tela precisa apenas do nome do cliente, o GraphQL não enviará o endereço, CPF e histórico de compras.
- Underfetching: Resolve o problema de precisar fazer 5 requisições diferentes para exibir uma tela. Com uma única query, o BFF resolve todas as dependências no lado do servidor, onde a conexão é estável e rápida.
Tutorial: Implementando uma API GraphQL com Node.js
Para criar essa camada de comunicação, utilizaremos o Apollo Server, a biblioteca mais robusta para ecossistemas Node.js.
1. Estrutura de Arquivos
- package.json (configurações)
- schema.graphql (definição dos tipos)
- index.js (servidor e lógica)
2. Instalação
Bash
npm init -y
npm install apollo-server graphql
3. Implementação do Servidor (index.js)
JavaScript
const { ApolloServer, gql } = require(‘apollo-server’);
// 1. Definição do Schema (Contrato entre Frontend e Backend)
const typeDefs = gql`
type Servidor {
id: ID!
hostname: String
ip: String
status: String
}
type Query {
# Rota para buscar servidores da empresa
listaServidores: [Servidor]
}
`;
// 2. Resolvers (A “mágica” que busca os dados)
const resolvers = {
Query: {
listaServidores: () => {
// Aqui você poderia buscar de um banco de dados ou outra API
return [
{ id: “1”, hostname: “srv-google-premier”, ip: “10.0.0.1”, status: “Ativo” },
{ id: “2”, hostname: “srv-vpn-netexperts”, ip: “10.0.0.2”, status: “Manutenção” }
];
},
},
};
const server = new ApolloServer({ typeDefs, resolvers });
server.listen().then(({ url }) => {
console.log(`🚀 BFF GraphQL NetExperts pronto em ${url}`);
});
Como o Frontend realiza a chamada (Passo a Passo)
Diferente do REST, onde usamos vários endpoints, no GraphQL existe apenas um único endpoint (geralmente /graphql) e todas as requisições são do tipo POST.
Exemplo de Query enviada pelo Frontend:
GraphQL
query {
listaServidores {
hostname
status
}
}
Implementação no Frontend (JavaScript):
JavaScript
async function fetchBFF() {
const query = `
query {
listaServidores {
hostname
status
}
}
`;
const response = await fetch(‘http://localhost:4000/’, {
method: ‘POST’,
headers: { ‘Content-Type’: ‘application/json’ },
body: JSON.stringify({ query }),
});
const { data } = await response.json();
console.log(“Dados recebidos do BFF:”, data.listaServidores);
}
Conclusão
A comunicação entre sistemas via GraphQL permite que a NetExperts entregue softwares mais rápidos e resilientes. Ao adotar o padrão BFF, você isola a complexidade do seu ecossistema de servidores e entrega uma experiência fluida para o usuário final, especialmente em dispositivos móveis onde cada byte conta.
Referências e Documentações Oficiais:
- GraphQL Official Documentation
- Apollo Server Docs
- Pattern: Backends For Frontends (Sam Newman)
- Best Practices for Mobile GraphQL (Apollo Blog)
