Vercel lança Vercel Services: deploy unificado de frontend e backend no mesmo projeto

A Vercel apresentou o Vercel Services, novo recurso que permite rodar vários frameworks ao mesmo tempo — por exemplo, um frontend em Next.js e um backend em FastAPI — dentro de um único Vercel Project, com deploys compartilhados e rede interna entre os serviços.

Como configurar o Vercel Services

Os serviços são declarados no arquivo vercel.json, sob a chave "services": para cada serviço, define-se o caminho (root) e o framework ou o ponto de entrada (entrypoint), enquanto o roteamento do tráfego público é configurado por meio de rewrites. É possível direcionar o tráfego público apenas para o serviço de frontend e deixar o backend acessível exclusivamente de dentro do projeto.

• A configuração dos serviços é feita pela chave "services" no vercel.json
• Exemplo da documentação da Vercel: o serviço my_frontend em Next.js e o serviço my_backend em FastAPI (entrypoint main:app)
• No exemplo, o backend não tem rota pública — fica acessível apenas para o serviço my_frontend pela rede interna
• O painel Deployments exibe uma visualização do grafo de serviços, e a Logs UI permite filtrar os logs por serviço
• O comando vercel dev sobe automaticamente todos os serviços localmente, reproduzindo o ambiente de produção

Que problema a unificação dos serviços resolve

Até agora, equipes que combinavam no mesmo produto um frontend em JavaScript e, por exemplo, um backend em Python normalmente precisavam espalhá-los por plataformas de nuvem diferentes. Historicamente, o ponto forte da Vercel era o deploy de frontend baseado em Next.js, enquanto serviços de backend em FastAPI, Django ou Flask costumavam ir para plataformas de hospedagem separadas. Na prática, isso significava dois sistemas de CI/CD independentes, dois conjuntos de logs e monitoramento e a sincronização manual das versões de frontend e backend a cada release. O Vercel Services elimina essa lacuna: a configuração de vários frameworks e serviços completos fica descrita em um único arquivo vercel.json, em vez de ser montada manualmente a partir das configurações de plataformas diferentes.

O que os deploys atômicos e os service bindings oferecem

Os deploys atômicos garantem que o frontend, o backend e os demais serviços do projeto passem por deploy e rollback de forma sincronizada, e não isoladamente. Os preview deploys compartilhados mostram como uma única alteração afeta todos os serviços de uma vez. Uma configuração específica de bindings permite que os serviços se comuniquem diretamente, sem passar pela internet pública: a chave BACKEND_INTERNAL_URL, por exemplo, é injetada automaticamente nas variáveis de ambiente do frontend e aponta para o endereço interno do backend.

O que isso significa

O Vercel Services fecha uma lacuna antiga entre o frontend e o backend de um mesmo produto, que muitas vezes rodavam em nuvens diferentes, cada um com seus próprios processos de desenvolvimento e deploy. Para equipes que combinam um frontend em JavaScript com, por exemplo, um backend em Python com FastAPI, isso significa deploy unificado, um ambiente de preview compartilhado e comunicação interna direta entre os serviços, sem proxy reverso nem configuração de CORS. Para a plataforma, é também uma forma de manter dentro do seu ecossistema as equipes que antes levavam o backend do projeto para hospedagens de terceiros simplesmente porque a Vercel não oferecia uma maneira prática de manter toda a stack em um só lugar.

Perguntas frequentes

O que é o Vercel Services?

É um recurso da Vercel para rodar vários serviços — por exemplo, um frontend em Next.js e um backend em FastAPI — dentro de um único Vercel Project, com roteamento compartilhado, deploys atômicos e escalonamento automático; a configuração é definida no vercel.json, sob a chave "services".

É preciso um proxy reverso para os serviços se comunicarem?

Não. Segundo a documentação da Vercel, os serviços podem ser conectados a uma tabela de roteamento compartilhada e ter sua comunicação configurada por meio de bindings, sem proxy reverso e sem configuração de CORS.