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

# Faça deploy de um site Gatsby

> Faça deploy de um site Gatsby na Square Cloud: gere o build com npm run build e sirva a pasta public/ com o runtime estático ou um pequeno servidor Node.js.

export const folder_2 = "public"

export const folder_1 = "public"

export const folder_0 = "public"

export const RecommendedPlan = ({lang, plan, tier, cpu, appType, min}) => {
  const t = {
    'en': {
      q: <>Which plan should you choose for {appType}?</>,
      rec: p => <>We recommend the {p} plan: its <b>{tier} GB</b> of RAM and <b>{cpu} vCPU</b> handle most projects of this kind, with headroom for traffic spikes.</>,
      min: m => <> Lighter projects also run on the {m} plan.</>,
      pro: p => <> For larger projects, the {p} plan adds more RAM and CPU.</>
    },
    'pt-br': {
      q: <>Qual plano escolher para {appType}?</>,
      rec: p => <>Recomendamos o plano {p}: seus <b>{tier} GB</b> de RAM e <b>{cpu} vCPU</b> atendem a maioria dos projetos desse tipo, com folga para picos de tráfego.</>,
      min: m => <> Projetos mais leves também rodam no plano {m}.</>,
      pro: p => <> Para projetos maiores, o plano {p} oferece mais RAM e CPU.</>
    },
    'es': {
      q: <>¿Qué plan elegir para {appType}?</>,
      rec: p => <>Te recomendamos el plan {p}: sus <b>{tier} GB</b> de RAM y <b>{cpu} vCPU</b> cubren la mayoría de los proyectos de este tipo, con margen para picos de tráfico.</>,
      min: m => <> Los proyectos más ligeros también funcionan en el plan {m}.</>,
      pro: p => <> Para proyectos más grandes, el plan {p} ofrece más RAM y CPU.</>
    },
    'fr': {
      q: <>Quel plan choisir pour héberger {appType} ?</>,
      rec: p => <>Nous recommandons le plan {p} : ses <b>{tier} Go</b> de RAM et <b>{cpu} vCPU</b> suffisent pour la plupart des projets de ce type, avec une marge pour les pics de trafic.</>,
      min: m => <> Les projets plus légers fonctionnent aussi avec le plan {m}.</>,
      pro: p => <> Pour les projets plus importants, le plan {p} offre davantage de RAM et de CPU.</>
    },
    'de': {
      q: <>Welcher Plan eignet sich für {appType}?</>,
      rec: p => <>Wir empfehlen den {p}-Plan: <b>{tier} GB</b> RAM und <b>{cpu} vCPU</b> reichen für die meisten Projekte dieser Art, mit Reserven für Lastspitzen.</>,
      min: m => <> Kleinere Projekte laufen auch mit dem {m}-Plan.</>,
      pro: p => <> Für größere Projekte bietet der {p}-Plan mehr RAM und CPU.</>
    },
    'it': {
      q: <>Quale piano scegliere per {appType}?</>,
      rec: p => <>Ti consigliamo il piano {p}: i suoi <b>{tier}GB</b> di RAM e <b>{cpu}vCPU</b> bastano per la maggior parte dei progetti di questo tipo, con margine per i picchi di traffico.</>,
      min: m => <> I progetti più leggeri funzionano anche con il piano {m}.</>,
      pro: p => <> Per progetti più grandi, il piano {p} offre più RAM e CPU.</>
    },
    'ja': {
      q: <>{appType}にはどのプランを選べばよいですか？</>,
      rec: p => <>{p}プランをおすすめします。<b>{tier}GB</b>のRAMと<b>{cpu}vCPU</b>があれば、この種のプロジェクトの多くをトラフィックのピークにも余裕を持って動かせます。</>,
      min: m => <>軽量なプロジェクトは{m}プランでも動作します。</>,
      pro: p => <>より大規模なプロジェクトには、RAMとCPUが増える{p}プランをご検討ください。</>
    },
    'zh': {
      q: <>托管{appType}应该选择哪个套餐？</>,
      rec: p => <>我们推荐 {p} 套餐：<b>{tier}GB</b> RAM 和 <b>{cpu}vCPU</b> 足以运行大多数此类项目，并能从容应对流量高峰。</>,
      min: m => <>较轻量的项目也可以在 {m} 套餐上运行。</>,
      pro: p => <>对于更大的项目，{p} 套餐提供更多 RAM 和 CPU。</>
    }
  };
  const siteLang = t[lang] ? lang : 'en';
  const c = t[siteLang];
  const pay = (name, query) => <a href={`https://squarecloud.app/${siteLang}/pay?${query}`}>{name}</a>;
  const isPro = plan.toLowerCase() === 'pro';
  return <Note>
      <b>{c.q}</b><br />
      {c.rec(pay(plan, `plan=${plan.toLowerCase()}&tier=${tier}`))}
      {min ? c.min(pay(min, `plan=${min.toLowerCase()}`)) : null}
      {isPro ? null : c.pro(pay('Pro', 'plan=pro'))}
    </Note>;
};

export const appType_0 = "uma aplicação Gatsby"

## Introdução

Para desenvolver e hospedar {appType_0} na Square Cloud, siga a sequência de configurações e pré-requisitos abaixo.
Este guia cobre todo o processo, da configuração inicial ao deploy em produção.

### Pré-requisitos

* **Conta Square Cloud**: Cadastre-se através da [página de cadastro](https://squarecloud.app/pt-br/signup) usando seu e-mail.
* **Plano ativo**: Garante recursos dedicados e desempenho otimizado para seu aplicativo. Confira nossos [planos disponíveis](https://squarecloud.app/pt-br/pricing) e escolha o mais adequado às suas necessidades.

<RecommendedPlan appType="aplicações Gatsby" plan="Standard" tier="4" cpu="4" min="Hobby" lang="pt-br" />

Este guia usa o [runtime estático](/pt-br/articles/getting-started-with-html) ou o [runtime Node.js](/pt-br/articles/getting-started-with-nodejs). Testado com Gatsby 5 no Node.js 24 em setembro de 2026.

## Crie o projeto

Você precisa do Node.js e do npm na sua máquina. Se ainda não os tiver, baixe-os no [site oficial do Node.js](https://nodejs.org/). Crie um projeto com o inicializador oficial:

```bash theme={"system"}
npm create gatsby@latest
```

O inicializador pergunta o nome do site, a pasta e opções como TypeScript e um CMS, e depois instala as dependências. Entre na pasta que ele criou:

```bash theme={"system"}
cd <your-site-folder>
```

Inicie o servidor de desenvolvimento com `npm run develop` (ele escuta em `http://localhost:8000`). As páginas ficam em `src/pages/`: edite o `src/pages/index.js` (ou `index.tsx`) para mudar a página inicial.

## Faça o build para produção

```bash theme={"system"}
npm run build
```

O Gatsby grava o site na pasta `public/`, com um arquivo HTML por página.

## Escolha como servir o site

Um build do Gatsby é um [site estático](/pt-br/articles/getting-started-with-html#sites-estáticos-e-aplicações-renderizadas-no-servidor): arquivos HTML, CSS e JavaScript que qualquer servidor web consegue entregar. Escolha uma destas opções:

<Tabs>
  <Tab title="Runtime estático (recomendado)">
    O runtime estático serve os arquivos do seu build com um servidor web gerenciado pela Square Cloud. Nenhum processo Node.js roda, então essa é a forma mais leve de hospedar um site sem código no servidor.

    <Steps>
      <Step title="Faça o build do site">
        Execute `npm run build`. A saída vai para a pasta <code>{folder_0}</code>.
      </Step>

      <Step title="Mantenha as rotas do lado do cliente funcionando">
        Se a sua aplicação troca de página no navegador sem recarregar (roteamento no lado do cliente), renomeie <code>{folder_0}/index.html</code> para `vite.html`. O runtime estático responde qualquer caminho que não seja um arquivo com o `vite.html`, então recarregar uma rota como `/about` continua carregando a sua aplicação. Um site com um arquivo HTML por página mantém o `index.html`: caminhos desconhecidos passam a retornar o seu `404.html`. Veja [como o runtime estático serve os arquivos](/pt-br/articles/getting-started-with-html#como-o-runtime-estático-serve-os-arquivos).
      </Step>

      <Step title="Adicione o arquivo de configuração">
        Crie um arquivo `squarecloud.app` dentro de <code>{folder_0}</code>. Um `MAIN` que aponta para um arquivo HTML seleciona o runtime estático:

        ```systemd squarecloud.app theme={"system"}
        MAIN=vite.html
        MEMORY=512
        VERSION=recommended
        DISPLAY_NAME=My website
        SUBDOMAIN=mywebsite
        ```

        Use `MAIN=index.html` se você manteve o `index.html`. 512 MB é a memória mínima para um site. Quando você faz o upload pelo dashboard, ele pede esses valores e escreve o arquivo para você.
      </Step>

      <Step title="Compacte a saída do build">
        Compacte o conteúdo de <code>{folder_0}</code>, e não a pasta em si, para que o `squarecloud.app` fique na raiz do ZIP. Com a CLI, execute `squarecloud upload` de dentro de <code>{folder_0}</code>.
      </Step>
    </Steps>

    <Warning>Tudo o que está no ZIP fica público no seu site. Envie apenas a saída do build, nunca o código-fonte ou arquivos `.env`.</Warning>

    <Tip>A maioria das ferramentas de build esvazia <code>{folder_0}</code> a cada build. Mantenha uma cópia do `squarecloud.app` na pasta que o seu framework copia sem alterações para o build (`public/` em projetos baseados em Vite), ou repita os três últimos passos após cada build.</Tip>
  </Tab>

  <Tab title="Servidor Express">
    Esta opção roda um pequeno servidor [Express](https://expressjs.com/) no runtime Node.js. Instale o Express como dependência comum, e não como `devDependency`, que a Square Cloud não instala:

    ```bash theme={"system"}
    npm install express
    ```

    Crie um arquivo `server.mjs` na raiz do projeto. Ele serve a pasta de saída do build, <code>{folder_1}</code>, e retorna o `index.html` para qualquer outro caminho, para que o roteamento no lado do cliente continue funcionando:

    ```javascript server.mjs theme={"system"}
    import express from 'express';
    import path from 'node:path';

    const app = express();
    const distPath = path.join(import.meta.dirname, 'public');

    app.use(express.static(distPath));

    // Fallback SPA: serve o index.html para qualquer rota não atendida acima
    app.use((req, res) => {
      res.sendFile(path.join(distPath, 'index.html'));
    });

    // A Square Cloud define PORT=80; 0.0.0.0 aceita conexões de fora do container
    const port = Number(process.env.PORT) || 80;
    app.listen(port, '0.0.0.0', () => console.log(`Server running on port ${port}`));
    ```

    Para testar na sua máquina, escolha uma porta livre: `PORT=3000 node server.mjs`.

    Crie um arquivo `squarecloud.app` na raiz do projeto. A Square Cloud inicia o seu site com `node server.mjs`:

    ```systemd squarecloud.app theme={"system"}
    MAIN=server.mjs
    MEMORY=512
    VERSION=recommended
    DISPLAY_NAME=My website
    SUBDOMAIN=mywebsite
    ```

    Execute `npm run build` antes de criar o ZIP. O ZIP precisa conter `server.mjs`, `package.json`, `squarecloud.app` e a pasta <code>{folder_1}</code>, sem `node_modules`: a Square Cloud instala as dependências na primeira inicialização. As ferramentas de build costumam ser `devDependencies`, que a Square Cloud não instala, então o build precisa rodar na sua máquina.
  </Tab>

  <Tab title="Pacote serve">
    Esta opção roda o pacote [`serve`](https://www.npmjs.com/package/serve) no runtime Node.js, sem nenhum código de servidor para escrever. Instale-o como dependência comum:

    ```bash theme={"system"}
    npm install serve
    ```

    Adicione um script `start:prod` aos `scripts` do seu `package.json`, ao lado dos que você já tem:

    ```json package.json theme={"system"}
    "scripts": {
      "start:prod": "serve -s public"
    }
    ```

    <code>serve -s {folder_2}</code> serve a pasta de saída do build, <code>{folder_2}</code>, no modo single-page: qualquer caminho que não seja um arquivo retorna o `index.html`, para que o roteamento no lado do cliente continue funcionando. O `serve` escuta em todas as interfaces de rede, na porta da variável de ambiente `PORT`, que a Square Cloud define como `80` (localmente, ele usa `3000`).

    Crie um arquivo `squarecloud.app` na raiz do projeto:

    ```systemd squarecloud.app theme={"system"}
    RUNTIME=nodejs
    START=npm run start:prod
    MEMORY=512
    VERSION=recommended
    DISPLAY_NAME=My website
    SUBDOMAIN=mywebsite
    ```

    `RUNTIME=nodejs` seleciona o runtime Node.js sem um arquivo `MAIN`, e `START` substitui o comando de inicialização padrão.

    Execute `npm run build` antes de criar o ZIP. O ZIP precisa conter `package.json`, `squarecloud.app` e a pasta <code>{folder_2}</code>, sem `node_modules`: a Square Cloud instala as dependências na primeira inicialização. As ferramentas de build costumam ser `devDependencies`, que a Square Cloud não instala, então o build precisa rodar na sua máquina.
  </Tab>
</Tabs>

O Gatsby grava um arquivo HTML por página, então no runtime estático mantenha o `index.html` (sem renomear para `vite.html`): a sua página `src/pages/404.js` vira o `404.html` que responde os caminhos desconhecidos. Para manter o `squarecloud.app` entre os builds, coloque-o na pasta `static/`: o Gatsby copia essa pasta sem alterações para `public/`.

<Note>Este guia cobre sites Gatsby estáticos. Páginas que usam renderização no servidor (`getServerData`), Deferred Static Generation ou Gatsby Functions precisam de um servidor Gatsby e não são cobertas aqui.</Note>

## Faça o deploy e verifique

Crie o ZIP descrito na opção que você escolheu e faça o upload:

### Via dashboard

<Steps>
  <Step title="Acesse a página de upload">
    Acesse a [página de upload](https://squarecloud.app/pt-br/dashboard/new) e envie seu arquivo zip.
  </Step>

  <Step title="Configure seu ambiente">
    Após fazer o upload do seu arquivo zip, você precisará configurar o nome, o arquivo principal ou o ambiente de execução e outras configurações do seu projeto.\
    Se você estiver enviando um projeto web, certifique-se de selecionar "Publicação na Web" e definir um subdomínio para o seu projeto.
  </Step>

  <Step title="Faça o deploy do projeto">
    Por fim, clique no botão "Deploy" para hospedar seu projeto na Square Cloud.
    Após o deploy, você poderá monitorar o status e os registros do seu projeto no dashboard.

    <Frame>
      <img src="https://cdn.squarecloud.app/docs/articles/dashboard/uploading-pt-br.gif" alt="Enviando aplicação para a Square Cloud" style={{ borderRadius: "0.2rem" }} />
    </Frame>
  </Step>

  <Step title="Confirme que seu app está no ar">
    Seu primeiro deploy geralmente leva menos de um minuto. No [dashboard](https://squarecloud.app/pt-br/dashboard), aguarde o status da sua aplicação mudar para em execução e verifique os registros em busca de erros de inicialização.\
    Se você fez deploy de um site ou API, abra `https://<seu-subdominio>.squareweb.app` no navegador: você deve ver sua aplicação respondendo. Se você fez deploy de um bot, envie um comando para confirmar que ele está online.
    <Tip>Seu app não está iniciando? Veja o [guia de solução de problemas](/pt-br/platform/troubleshooting/app-wont-start) para as causas e correções mais comuns.</Tip>
  </Step>
</Steps>

### Via CLI

Para usar esse método, seu projeto precisa de um arquivo de configuração chamado `squarecloud.app` na raiz. Ele informa à Square Cloud como executar a sua aplicação.

<Card title="Guia do arquivo de configuração" icon="link" href="/pt-br/getting-started/config-file">
  Saiba como criar o arquivo de configuração `squarecloud.app` que define o ambiente da sua aplicação.
</Card>

<Steps>
  <Step title="Instale a CLI">
    Instale a [CLI da Square Cloud](/pt-br/cli-reference/installation). Se você já a tem, execute o mesmo comando para atualizá-la:

    <CodeGroup>
      ```bash macOS, Linux e WSL theme={"system"}
      curl -fsSL https://cli.squarecloud.app/install | bash
      ```

      ```bash Windows com npm theme={"system"}
      npm install -g @squarecloud/cli@latest
      ```
    </CodeGroup>
  </Step>

  <Step title="Faça login">
    Execute o comando abaixo. Ele abre o seu navegador: aprove o login lá e a CLI está pronta. Não há nenhuma chave de API para copiar. Para scripts e CI, veja [autenticação da CLI](/pt-br/cli-reference/authentication).

    ```bash theme={"system"}
    squarecloud auth login
    ```
  </Step>

  <Step title="Envie o seu projeto">
    Na pasta do seu projeto, execute o comando abaixo. A CLI compacta a pasta atual, deixando de fora o que o [`squarecloud.ignore`](/pt-br/getting-started/squarecloud-ignore) lista, e faz o upload:

    ```bash theme={"system"}
    squarecloud upload
    ```

    Para enviar um zip que você mesmo criou, passe-o com `--file`:

    ```bash theme={"system"}
    squarecloud upload --file <caminho/para/zip>
    ```
  </Step>

  <Step title="Confirme que seu app está no ar">
    Seu primeiro deploy geralmente leva menos de um minuto. Verifique o status e os registros da sua aplicação diretamente pelo terminal:

    ```bash theme={"system"}
    squarecloud app status
    squarecloud app logs
    ```

    Se você fez deploy de um site ou API, abra `https://<seu-subdominio>.squareweb.app` no navegador: você deve ver sua aplicação respondendo. Se você fez deploy de um bot, envie um comando para confirmar que ele está online.
    <Tip>Seu app não está iniciando? Veja o [guia de solução de problemas](/pt-br/platform/troubleshooting/app-wont-start) para as causas e correções mais comuns.</Tip>
  </Step>
</Steps>

## Erros comuns

<CardGroup cols={1}>
  ### Domínio personalizado

  <Card horizontal>
    Para usar um domínio personalizado (ex.: `meusite.com`) no lugar da URL padrão `meusite.squareweb.app`, você precisa do **plano Standard ou superior**. A URL padrão vem do campo **SUBDOMAIN** no arquivo de configuração. Para conectar o seu domínio, veja [como configurar seu próprio domínio](https://help.squarecloud.app/pt-br/article/como-configurar-seu-proprio-dominio-cnamedns-j39hh2/).
  </Card>

  ### Requisitos mínimos de RAM

  <Card horizontal>
    **Mínimo: 512MB de RAM** para sites e APIs, o suficiente para um build estático no runtime estático. Para aplicações que renderizam páginas no servidor (Next.js, Nuxt, Angular SSR e similares), recomendamos **pelo menos 1GB de RAM**. Para aplicações maiores, aloque mais RAM para evitar que a aplicação fique sem memória e trave.
  </Card>

  ### Não foi possível encontrar esse site.

  <Card horizontal>
    Verifique se o **subdomínio/domínio** corresponde ao configurado no campo **SUBDOMAIN** ou nas **configurações de domínio personalizado**. Se você acabou de enviar o site, aguarde até **60 segundos** para a Square liberar o **primeiro acesso**.
  </Card>

  ### Site demorou demais para responder...

  <Card horizontal>
    O seu servidor precisa escutar na **porta 80** e no **host 0.0.0.0**. A Square Cloud define as variáveis de ambiente **PORT** (`80`) e **HOST** (`0.0.0.0`) na sua aplicação: leia essas variáveis no código em vez de fixar outros valores. Um servidor que escuta apenas em `localhost` ou `127.0.0.1` nunca recebe requisições.
  </Card>
</CardGroup>

## Próximos passos

<CardGroup cols={3}>
  <Card title="Variáveis de ambiente" icon="key" href="/pt-br/platform/environment-variables">
    Mantenha segredos e configurações fora do código e leia-os em tempo de execução.
  </Card>

  <Card title="Domínio personalizado" icon="globe" href="https://help.squarecloud.app/pt-br/article/como-configurar-seu-proprio-dominio-cnamedns-j39hh2/">
    Sirva a sua aplicação no seu próprio domínio, a partir do plano Standard.
  </Card>

  <Card title="Solução de problemas" icon="wrench" href="/pt-br/platform/troubleshooting">
    Corrija uma aplicação que não inicia ou um site que não responde.
  </Card>
</CardGroup>

Para saber mais sobre o Gatsby, consulte a [documentação oficial do Gatsby](https://www.gatsbyjs.com/docs/).

## Contate-nos

Se você continuar enfrentando **dificuldades técnicas**, nossa **equipe de suporte especializada** está disponível para auxiliá-lo. [**Entre em contato conosco**](https://squarecloud.app/pt-br/support) e teremos prazer em ajudá-lo a resolver qualquer questão: a qualidade do suporte é uma grande parte do motivo pelo qual desenvolvedores avaliam a Square Cloud com [**4,9/5 em 402 avaliações**](https://www.trustpilot.com/review/squarecloud.app) no Google e Trustpilot.


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