Tracking

O módulo Tracking é responsável por padronizar e simplificar o disparo de eventos de analytics no novo modelo do GA4 (Google Analytics 4).

Mais do que apenas enviar eventos para o dataLayer, o Tracking atua como uma camada inteligente que:

• Consome a API automaticamente
• Dispara eventos no padrão GA4
• Dispara eventos no Facebook Pixel, com deduplicação pela API de Conversões
• Retorna os dados da requisição

Como funciona

Ao utilizar o Tracking:

• Uma ação é executada (ex: adicionar ao carrinho)
• O Tracking chama o recurso correspondente da API
• Com base na resposta, ele dispara o evento no dataLayer
• Quando o fbq está carregado na página, registra o evento no servidor (API de Conversões) e dispara o mesmo evento no Pixel com o eventID retornado
• Retorna os dados para uso no front-end

Fluxo simplificado: Tracking → API → dataLayer (+ fbq) → retorno para aplicação

ℹ️ Informação

O SDK não carrega o Facebook Pixel. Se o window.fbq não existir, os eventos do Facebook são ignorados e apenas os do GA4 são disparados.

Por que usar Tracking?

Ao invés de fazer isso manualmente:

• Chamar API
• Tratar resposta
• Montar payload GA4
• Disparar evento

Você simplesmente faz:

1await Tracking.cart.addProduct(...)

E tudo acontece automaticamente.

⚠️ Atenção

Ao utilizar o módulo Tracking, não é necessário utilizar o módulo Api diretamente para essas ações.
Isso porque o Tracking:
- Já realiza a requisição para API
- Já dispara os eventos necessários
- Já retorna os dados processados

Estrutura dos recursos

Assim como no módulo Api, os recursos são organizados por domínios de responsabilidade, o que facilita a curva de aprendizado e a manutenção.

view

Responsável por emitir eventos referente a visualização de página, como: view_home, view_not_found, e mais.

• viewHome
• viewNotFound
• viewOther
• viewPayment
• viewShipping

🎨 customization

Responsável pelos eventos relacionados à exibição de conteúdo dinâmico, como banners e vitrines.

• listBanners
• listShowcase
• selectPromotion

👤 customer

Responsável pelos eventos relacionados ao cliente.

• addNewsletter
• detail
• signinByDocument
• signinByEmail
• signup

🛒 cart

Responsável pelos eventos relacionados ao carrinho.

• addPaymentInfo
• addProduct
• beginCheckout
• buy
• deleteProduct
• listDetail
• selectShipment
• shipmentQuote
• upsertProduct

🛍️ product

Responsável pelos eventos de interação com produtos.

• getSearch
• getUrl
• listShipmentQuoteProduct
• search
• selectItem

publicApiTracking

• install: instala o Google Tag Manager em ambiente de desenvolvimento

Benefícios

• ✅ Padronização de eventos (GA4)
• ✅ Menos código no front-end
• ✅ Menor chance de erro
• ✅ Integração nativa com analytics
• ✅ Melhor organização da aplicação

🏁 Próximo passo

Na próxima etapa, serão apresentados todos os recursos disponíveis, bem como exemplos de uso.

SDK Público - Tracking: Recursos