Skip to main content
O runtime estático serve HTML, CSS, JavaScript, imagens e outros arquivos direto do seu ZIP, com um servidor web gerenciado pela Square Cloud. Não há nenhum processo seu para manter rodando, então essa é a forma mais leve de publicar um site.

Antes de começar

  • Um editor de texto para os seus arquivos HTML e CSS, como o Visual Studio Code.
  • Uma conta na Square Cloud: cadastre-se com seu e-mail ou GitHub.
  • Um plano ativo. Veja os planos e escolha o que combina com o seu projeto.

Sites estáticos e aplicações renderizadas no servidor

Um site estático é um conjunto de arquivos que é igual para todos os visitantes: páginas HTML simples, ou a saída do build de um framework como Vite, React, Vue, Angular, Astro ou Gatsby. O runtime estático serve esses arquivos como estão. Uma aplicação renderizada no servidor monta as páginas a cada requisição, com código de servidor como Next.js, Nuxt, React Router ou uma API. Ela precisa de um processo que continue rodando, então roda em um runtime de linguagem, como o runtime Node.js, com um arquivo MAIN ou um comando START. Se o seu framework faz as duas coisas, um build estático é a opção mais leve. Cada guia de framework mostra quais opções ele suporta.

Configure a Square Cloud

Se você envia sua aplicação pelo dashboard, pode pular esta seção: o dashboard cria o arquivo de configuração squarecloud.app para você.

Referência do arquivo de configuração

O arquivo squarecloud.app diz à Square Cloud como executar a sua aplicação: o arquivo principal, a memória, a versão do runtime, o nome e, para um site, o subdomínio.
Um MAIN que aponta para um arquivo HTML seleciona o runtime estático:
squarecloud.app
512 MB é a memória mínima para um site, e é mais do que suficiente para arquivos estáticos.

Como o runtime estático serve os arquivos

  • A raiz do ZIP é a raiz do seu site: about.html é servido em /about.html, e blog/index.html em /blog/.
  • / serve o vite.html se ele existir, senão o index.html.
  • Quando um caminho não corresponde a nenhum arquivo, o runtime serve o vite.html se ele existir. Isso mantém as rotas do lado do cliente de aplicações single-page funcionando ao recarregar, qualquer que seja o framework: renomeie o index.html do build para vite.html.
  • Sem vite.html, caminhos desconhecidos retornam o seu 404.html, ou uma página 404 padrão se você não tiver uma.
  • Os arquivos são comprimidos na hora, e o seu arquivo squarecloud.app nunca é servido.
Todo arquivo do ZIP é público. Não envie código-fonte, arquivos .env ou qualquer outra coisa que você não queira que os visitantes baixem.

Prepare o projeto

Coloque os seus arquivos na raiz do ZIP, ao lado do squarecloud.app:
  • index.html, ou vite.html para uma aplicação single-page.
  • Os seus arquivos CSS, JavaScript, imagens e fontes, em qualquer estrutura de pastas.
  • 404.html, opcional: a página para caminhos que não existem.
Para o build de um framework, compacte o conteúdo da pasta de saída do build, e não a pasta em si.

Guias de frameworks

Cada guia mostra o comando de build, a pasta de saída e como publicá-la no runtime estático.

Vite

React

Vue

Angular

Astro

Gatsby

Preact

Qwik

SolidJS

Nuxt

Solução de problemas

A página diz “Hi, I’m Square Shield”: o runtime não encontrou index.html nem vite.html na raiz do ZIP. Provavelmente você compactou a pasta do build em vez do conteúdo dela: compacte os arquivos que estão dentro da pasta.
A sua aplicação single-page trata as rotas no navegador. Renomeie o index.html dela para vite.html, para que caminhos desconhecidos carreguem a aplicação, e atualize o MAIN.
Para outros problemas, veja Solução de problemas.

Faça o deploy

Via dashboard

1

Acesse a página de upload

Acesse a página de upload e envie seu arquivo zip.
2

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.
3

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.
Enviando aplicação para a Square Cloud
4

Confirme que seu app está no ar

Seu primeiro deploy geralmente leva menos de um minuto. No 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.
Seu app não está iniciando? Veja o guia de solução de problemas para as causas e correções mais comuns.

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.

Guia do arquivo de configuração

Saiba como criar o arquivo de configuração squarecloud.app que define o ambiente da sua aplicação.
1

Instale a CLI

Instale a CLI da Square Cloud. Se você já a tem, execute o mesmo comando para atualizá-la:
2

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.
3

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 lista, e faz o upload:
Para enviar um zip que você mesmo criou, passe-o com --file:
4

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:
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.
Seu app não está iniciando? Veja o guia de solução de problemas para as causas e correções mais comuns.

Próximos passos

Variáveis de ambiente

Mantenha segredos e configurações fora do código e leia-os em tempo de execução.

Domínio personalizado

Sirva a sua aplicação no seu próprio domínio, a partir do plano Standard.

Solução de problemas

Corrija uma aplicação que não inicia ou um site que não responde.

Contate-nos

Se você continuar enfrentando dificuldades técnicas, nossa equipe de suporte especializada está disponível para auxiliá-lo. Entre em contato conosco 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 no Google e Trustpilot.