Blog

A stack por trás de gramsstyling.com: Medusa v2 e Next.js em Cloudflare Workers

Como substituímos uma stack de plugins WooCommerce por uma arquitetura headless: Medusa como motor de comércio, uma loja Next.js em Cloudflare Workers e a lógica própria em módulos reutilizáveis.

Este é o complemento técnico do nosso estudo de caso sobre a saída da G.R.A.M.S Styling do WooCommerce. A migração está em curso: a stack descrita abaixo está construída, carregada com os dados reais e funciona por trás do Cloudflare Access até ao lançamento.

Antes e depois

No WooCommerce, um único servidor PHP fazia tudo: gerava cada página, corria a base de dados e alojava dezenas de plugins para moedas, envios, extras de produto, cache, pesquisa, email, sincronização com marketplaces e muito mais. Cada funcionalidade era código de terceiros a partilhar um processo e uma tabela de opções na base de dados, e cada visitante esperava por esse servidor.

A nova arquitetura separa três coisas. A loja corre em Cloudflare Workers, perto do visitante, e serve páginas em cache. O motor de comércio, Medusa, corre num servidor pequeno e só responde aos pedidos que precisam dele: carrinhos, checkout, contas, o painel de administração. Tudo o que é específico desta loja está escrito como módulos Medusa, versionados e testados como qualquer outro código. O diagrama acima mostra as duas configurações lado a lado.

O motor de comércio: Medusa v2

O Medusa deu-nos as peças de que uma loja precisa e nada mais: regiões e moedas, carrinhos, encomendas, expedições, clientes, uma interface de administração e um sistema de módulos para estender tudo isto. Corre como uma stack Docker Compose com Postgres e Redis, gerida pelo Coolify num servidor com 2 vCPU. Um workflow de GitHub Actions compila e analisa a imagem a cada merge, e o servidor limita-se a descarregá-la, por isso um deploy demora cerca de um minuto e meio. A base de dados é exportada de hora a hora e copiada para fora do servidor, e o restauro foi testado.

O comportamento próprio da loja vive num conjunto de módulos com licença MIT que escrevemos para serem reutilizáveis noutras lojas Medusa:

A loja: Next.js 16 em Cloudflare Workers

A loja é uma aplicação Next.js App Router implementada como Cloudflare Worker, com páginas em cache no edge e revalidadas em segundo plano, para que o motor de comércio receba apenas uma pequena parte do tráfego. O URL indica o mercado (/uk, /eu, /us e variantes de idioma como /eu-fr), com canonical e hreflang por mercado. O middleware trata dos redirecionamentos da loja antiga, da sugestão de região por país, do cookie de idioma e dos cabeçalhos de segurança.

O blogue é um site estático separado, reconstruído automaticamente quando um editor guarda um artigo no painel do Medusa. O quadro das oficinas é uma página estática por trás do Cloudflare Access.

Como os dados foram migrados

Cada registo importado do WooCommerce guarda o seu identificador original nos metadados, para que a comparação entre a loja antiga e a nova possa ser repetida a qualquer momento: produtos, variantes, preços, pesos, clientes, encomendas, pagamentos, reembolsos e números de seguimento foram verificados por id, e a última execução não mostrou diferenças nos preços. As encomendas feitas na loja antiga antes do lançamento são importadas uma a uma.

O que voltaríamos a fazer

Esta é a arquitetura que agora propomos a qualquer empresa que precise de uma loja com alcance global, velocidade no edge e segmentação por mercado, com a qualidade de uma loja ao nível da Shopify e sem uma percentagem cobrada em cada venda. Headless foi a escolha certa para este catálogo. As regras de envio, os extras e os acabamentos do proprietário não cabiam em nenhuma plataforma alojada, e escrevê-los como pequenos módulos manteve cada um deles testável. Colocar a loja em Workers eliminou toda uma categoria de trabalho de alojamento. E manter os identificadores antigos transformou cada auditoria num script em vez de um palpite.

Leia a seguir

ServiçosBlogMarketplaceConquistasClientesContacto