Criando Pages Functions super rápidas para projetos pontuais

Como usar a pasta /functions em projetos do Cloudflare Pages para prototipar APIs completas em minutos, sem configurar um Worker complexo.

A Cloudflare dividiu a sua hospedagem de ponta em dois produtos distintos: Workers (onde o foco é 100% backend/API em um roteador customizado) e Pages (onde o foco principal é hospedar arquivos estáticos como HTML, CSS e React/Vue/Astro gerados localmente).

Mas o que muitos não sabem, e que salvou meu tempo no deploy rápido de protótipos de simuladores de provas, é que o Cloudflare Pages possui capacidades de API embutidas e baseadas em convenção de rotas.

Você não precisa criar um projeto paralelo apenas para criar dois endpoints simples de formulário. Conheça o poder oculto da pasta /functions.

A Convenção da Pasta Functions

Se você tiver um diretório estático (ex: uma pasta public ou dist contendo seu index.html), basta criar uma pasta chamada functions ao lado da pasta estática.

Dentro da pasta functions, os arquivos .js criam as rotas da sua API magicamente, baseadas no nome do arquivo.

Por exemplo, criamos o arquivo functions/api/feedback.js.

Na web, essa função responderá automaticamente pela URL seu-site.pages.dev/api/feedback. Você não precisa instalar bibliotecas como itty-router ou instanciar middlewares pesados.

O Código Mínimo

O arquivo dentro de /functions só precisa exportar as funções HTTP que ele atende (onRequestGet, onRequestPost, etc).

Exemplo: functions/api/hello.js

export async function onRequestGet({ request, env }) {
  // Pega uma query param (ex: /api/hello?nome=Joao)
  const url = new URL(request.url);
  const nome = url.searchParams.get("nome") || "Visitante";
  
  // Retorna um JSON formatado no Edge Server
  return Response.json({
    mensagem: `Olá ${nome}!`,
    timestamp: Date.now()
  });
}

Como Fazer Deploy?

Ao subir o projeto com o Wrangler, você aponta para a pasta onde seus arquivos HTML estão. O Wrangler varre inteligentemente a pasta vizinha de functions e injeta o código V8 na mesma distribuição.

npx wrangler pages deploy ./pasta-arquivos-html --project-name meu-site-rapido

O uso das “Pages Functions” remove a fricção de configurar um arquivo de rotas globais. É a forma definitiva de fazer projetos frontend que precisem apenas de um servidor minúsculo para disparar e-mails, inserir feedback em banco ou consultar chaves secretas sem expô-las no JavaScript do cliente.