> ## Documentation Index
> Fetch the complete documentation index at: https://docs-loja.usecorvex.com.br/llms.txt
> Use this file to discover all available pages before exploring further.

# Conceitos

> O que é loja, tema, página, template, seção, bloco e schema na Corvex.

Esta página explica a Corvex para quem ainda não desenvolveu um tema. Os nomes técnicos ficam iguais aos contratos. O passo a passo de instalação está no [Quickstart](https://docs-loja.usecorvex.com.br/introduction/quickstart.md).

Temas usam **React (JSX)** com `schema.json` e o [Theme SDK](https://docs-loja.usecorvex.com.br/sdk/overview.md).

## Loja e tema

A **loja** é o site do lojista: produtos, coleções, carrinho e páginas. O **tema** é o pacote de código que define a aparência e o que o lojista pode editar.

O desenvolvedor entrega o tema. O lojista monta o conteúdo no editor visual. A plataforma renderiza o preview e a loja publicada.

***

## Página, template, seção e bloco

Imagine a página inicial. Ela pode ter um banner, uma vitrine de produtos e uma área de perguntas. Cada uma dessas áreas é uma **seção**. Dentro do banner, um título, um texto e um botão podem ser **blocos**, se a seção declarar que aceita esses blocos.

| Nome | O que é | Onde fica no tema |
| - | - | - |
| **Página** | Uma tela da loja, com as seções que o lojista deixou | Persistida pela plataforma (rascunho e publicação) |
| **Template** | O ponto de partida de um tipo de página | `templates/index.json`, `product.json`, `collection.json`, `cart.json`, `search.json` |
| **Seção** | Uma região da página, com interface e campos editáveis | `sections/{id}/section.jsx` + `schema.json` |
| **Bloco** | Um item repetível dentro de uma seção | `blocks/{id}/block.jsx` + `schema.json` |
| **Snippet** | Um componente React reutilizado por várias seções | `snippets/{id}/snippet.jsx`, importado como `@corvex/snippets/{id}` |

O template JSON não é a página ao vivo. Ele define o conteúdo **padrão** na instalação. Depois disso, o que o lojista muda no editor fica salvo na loja. Veja [Defaults do tema](https://docs-loja.usecorvex.com.br/guides/theme-defaults.md).

***

## Schema

O `schema.json` descreve o painel do editor: nome do campo, tipo e valor inicial. O JSX lê esses valores em `settings`, nunca como props soltas na raiz.

```jsx theme={"theme":{"light":"github-light","dark":"github-dark"}}
export default function HeroSection({ settings }) {
  return (
    <section>
      <h1>{settings.title}</h1>
      <p>{settings.description}</p>
    </section>
  );
}
```

O campo `title` só aparece no editor se existir um setting com o mesmo `id` no schema. Tipos estáveis e regras: [Schema](https://docs-loja.usecorvex.com.br/schema/overview.md).

***

## Como a informação chega na página

Há três origens. Não misture as três.

1. **Código do tema** — JSX, CSS e schemas. Muda quando você roda `corvex build` e envia o tema.
2. **Defaults do tema** — JSON de templates e grupos (cabeçalho e rodapé). Vira o conteúdo inicial da loja.
3. **Conteúdo do lojista** — ordem das seções, textos, imagens e blocos salvos no editor.

Dados da loja (produto da página, lista de produtos, carrinho) vêm do **Theme SDK** (`@corvex/theme-sdk`), por exemplo `usePage` e `useCorvexCart`. No tema, use esses hooks. Não chame APIs administrativas nem rotas HTTP da plataforma. Contrato: [Dados da vitrine](https://docs-loja.usecorvex.com.br/data/overview.md) · [SDK](https://docs-loja.usecorvex.com.br/sdk/overview.md).

***

## Editor e publicação

O editor mostra o tema e o painel gerado pelos schemas. O lojista altera textos, imagens, ordem de seções e blocos. **Publicar** no editor coloca esse conteúdo na loja que o visitante vê.

`corvex publish` envia o **código** do tema para o catálogo. Não substitui a publicação de conteúdo do lojista. A diferença está em [Publicação](https://docs-loja.usecorvex.com.br/reference/contracts/publish.md).

***

## Próximo passo

> **[Quickstart](https://docs-loja.usecorvex.com.br/introduction/quickstart.md)**
>
> Criar, validar e abrir o primeiro tema

> **[Estrutura de pastas](https://docs-loja.usecorvex.com.br/themes/structure.md)**
>
> O que cada arquivo faz

> **[Theme SDK](https://docs-loja.usecorvex.com.br/sdk/overview.md)**
>
> Hooks e dados no JSX

> **[Contrato da seção](https://docs-loja.usecorvex.com.br/reference/contracts/section.md)**
>
> O que é obrigatório no código


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.