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

# Publique no seu domínio

> Coloque o site de área de membros no ar em uma hospedagem estática, com o seu próprio domínio.

O site gerado pelo template é estático: um conjunto de arquivos HTML, CSS e JavaScript, sem servidor. Ele funciona em qualquer hospedagem de sites estáticos e no domínio que você escolher, enquanto a sua área de membros na MemberKit continua no endereço dela.

## Como fica cada endereço

* **O seu site**, em um domínio seu, por exemplo `membros.suamarca.com.br`. É onde os alunos assistem às aulas.
* **A área de membros na MemberKit**, em `suamarca.memberkit.com.br` ou no [domínio personalizado](https://ajuda.memberkit.com.br/como-funciona/dominio-personalizado.md) dela. Continua com o painel administrativo, os links de convite e a área de membros hospedada.

Os dois funcionam juntos sem configuração extra: a API de membros aceita chamadas de qualquer domínio.

## Gere o site

Defina as variáveis de ambiente antes de gerar o site, porque elas são gravadas nos arquivos durante a geração:

| Variável | Valor |
| - | - |
| `VITE_MEMBERKIT_API_URL` | `https://memberkit.com.br/api/headless/v1` |
| `VITE_MEMBERKIT_HEADLESS_KEY` | A chave headless da sua área de membros, em **Configurações > Acesso via API**. |

```bash theme={null}
pnpm build
```

Se o suporte trocar a sua chave headless, atualize a variável e gere o site de novo: a chave antiga para de funcionar na hora.

O resultado fica na pasta `build/client`. É ela que vai para a hospedagem. Para conferir antes de publicar, rode `pnpm preview` e abra `http://localhost:4321`.

> [!WARNING]
>
> Sem `VITE_MEMBERKIT_API_URL`, o site gerado usa os dados de exemplo. Confira que a variável está definida na hospedagem, e não só no seu computador.

## Escolha a hospedagem

O site é de página única: todos os endereços, como `/courses/12` ou `/lessons/102`, são resolvidos no navegador a partir do mesmo `index.html`. A hospedagem precisa responder qualquer endereço com esse arquivo. Sem isso, um aluno que abre um link direto ou recarrega a página vê um erro 404.

> [tab] Netlify
>
> 1. Crie um site a partir do repositório do seu projeto.
> 2. Use `pnpm build` como comando de build e `build/client` como pasta de publicação.
> 3. Defina as duas variáveis em **Site configuration › Environment variables**.
>
> O arquivo `public/_redirects` do template já faz a Netlify responder qualquer endereço com o `index.html`.

> [tab] Cloudflare Pages
>
> 1. Crie um projeto a partir do repositório.
> 2. Use `pnpm build` como comando de build e `build/client` como pasta de saída.
> 3. Defina as duas variáveis nas configurações do projeto.
>
> O arquivo `public/_redirects` do template já faz o Cloudflare Pages responder qualquer endereço com o `index.html`.

> [tab] Vercel
>
> 1. Importe o repositório.
> 2. Use `pnpm build` como comando de build e `build/client` como pasta de saída.
> 3. Defina as duas variáveis em **Settings › Environment Variables**.
>
> A Vercel não lê o `_redirects`. Crie um `vercel.json` na raiz do projeto:
>
> ```json vercel.json theme={null}
> {
>   "rewrites": [{ "source": "/(.*)", "destination": "/index.html" }]
> }
> ```

## Conecte o seu domínio

Adicione o domínio nas configurações da hospedagem e crie no seu provedor de DNS o registro que ela pedir, normalmente um `CNAME` para um subdomínio como `membros.suamarca.com.br`. A hospedagem emite o certificado HTTPS automaticamente.

Use um domínio diferente do que a área de membros da MemberKit usa. Se a sua área de membros já está em `membros.suamarca.com.br`, publique o site em outro endereço, como `aulas.suamarca.com.br`.

## Depois de publicar

**1. Teste com uma conta de aluno**

Entre com uma conta de aluno, assista a uma aula, baixe um material e abra direto um endereço interno, como `/courses/1`, para confirmar que a hospedagem responde com o `index.html`.

**2. Aponte os e-mails para o site**

Edite os templates de e-mail para que os links abram o seu site. Veja [E-mails para o seu site](https://ajuda.memberkit.com.br/headless/emails-para-seu-frontend.md).

**3. Revise os links escritos à mão**

Links que você escreveu no conteúdo das aulas, nos banners ou no texto do onboarding continuam apontando para onde foram escritos. Revise os que levam à área de membros hospedada.

## Segurança

O token de cada aluno fica salvo no navegador, e qualquer script da página consegue lê-lo. Não adicione ao site scripts de terceiros, como ferramentas de análise, widgets de chat ou gerenciadores de tags, a menos que confie a eles as sessões dos seus alunos.

Se quiser reforçar isso com uma Content-Security-Policy, publique o cabeçalho pela hospedagem (um arquivo `public/_headers` na Netlify e no Cloudflare Pages). O `index.html` gerado tem scripts inline que mudam a cada build, então a política precisa listar os hashes deles, recalculados a cada publicação.


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