Ir ao conteúdo principal
2026

E-commerce storefront and admin

Next.js
React 19
Supabase
PostgreSQL
Row Level Security
next-intl
Mercado Pago
TanStack Query
Tailwind CSS
TypeScript

Descrição

Uma loja e um painel para um negócio de roupa: catálogo com filtros, sacola, checkout no Mercado Pago com cartão e Pix, e um admin para produtos, variações, promoções e banners. Publicado como demo no ar, em português e inglês.

Funcionalidades

  • Catálogo com filtro por coleção, categoria, tamanho e cor, com a paginação na URL
  • Sacola e checkout pelo Mercado Pago, cartão e Pix, consultando o pedido até o pagamento compensar
  • Admin de produtos, variações, estoque, promoções, banners e quais blocos da home aparecem
  • Português e inglês com o idioma na URL, incluindo o conteúdo do catálogo que mora no banco
  • Row Level Security em sacola, pedidos e pagamentos: cliente logado só lê as próprias linhas

Desafios

  • Reconstruir o schema depois que o banco original sumiu: as migrations do repositório criavam 3 das 14 tabelas, e o resto saiu do arquivo de tipos gerado de uma versão antiga do projeto
  • O Partial Prerendering caía para renderização no cliente em toda página, porque um único Suspense na raiz transformava a árvore inteira num buraco só
  • Cachear o catálogo público sem o cookie da requisição, para essas consultas deixarem de ser dado de requisição

Aprendizados

  • Que um 200 no curl não prova que a página funciona: com streaming o primeiro HTML é esqueleto, e os links quebrados só apareceram no console do navegador
  • Que o arquivo de tipos gerado serve de backup de schema quando as migrations estão incompletas
  • Onde o Cache Components compensa, e onde ele só atrapalha