Dados da vitrine

Como o tema lê produtos, coleções, carrinho e contexto de página pelo Theme SDK.

No tema, dados da loja entram só pelo Theme SDK (@corvex/theme-sdk). Você não chama rotas HTTP da plataforma no JSX.

@corvex/theme-sdk (usePage, useCorvexCart, storefront.*)
        ↓
Seção / bloco / snippet do tema

Regra de ouro

Use apenas o Theme SDK documentado aqui e em SDK.

O desenvolvedor de tema não precisa de:

• Acesso ao backend interno da Corvex
• Rotas administrativas
• Credenciais de backoffice
• Conhecimento de banco ou infraestrutura

usePage devolve o contexto inteiro da página. O argumento ('product', 'collection') tipa a leitura; o host já sabe qual recurso renderizar.

import {
  createStorefront,
  usePage,
  defineSection,
  defineSectionData,
} from '@corvex/theme-sdk';

Três categorias de dados

Categoria	Quando usar	Exemplo
Contexto de página	A plataforma já sabe qual recurso renderizar	usePage('product') em /products/camiseta
Consulta	A seção precisa buscar dados extras	storefront.products.list() na home
Referência do lojista	Valor escolhido no editor (picker)	Field product_list → UUIDs em settings

API do cliente

const products = await storefront.products.list({
  first: 8,
  sortBy: 'BEST_SELLING',
});

Na vitrine, prefira hooks (usePage, useStorefront, useCorvexCart) em seções React. Lista completa de namespaces: Theme SDK.

storefront.query() (GraphQL) está reservado para versões futuras. Use a API high-level hoje.

Por recurso

• Product · Coleção · Cart
• products.list · Reviews · Leads
• Recommendations
• Menus e Blog

Versão da API

import { STOREFRONT_API_VERSION } from '@corvex/theme-sdk';
// '2026-08'

Veja Versionamento.

Próximos passos

• Erros comuns — leia antes de gerar código de tema
• Contexto de página
• Regras de escopo
• Mapa de dados
• Theme SDK