Pular para o conteúdo principal

Desenvolvimento Profissional de Aplicações Nuxt

  • Antes de começar, certifique-se de que você possui Node.js e npm instalados no seu sistema. Se ainda não tiver, você pode baixá-los pelo site oficial do Node.js.
  • Em seguida, crie uma conta na Square Cloud através da página de cadastro. Você pode usar seu e-mail para registrar rapidamente.
  • Por fim, garanta que você possui um plano pago ativo em sua conta. Você pode visualizar e adquirir um plano conforme suas necessidades aqui.

Configuração do Nuxt

Para criar um projeto Nuxt, você precisa instalar o Nuxt CLI. Execute o seguinte comando:
npx nuxi init my-nuxt-app
Este comando inicializa um novo projeto Nuxt dentro da pasta my-nuxt-app. Depois, instale as dependências do projeto:
cd my-nuxt-app
npm install

Criando um Projeto Nuxt

Após instalar as dependências, você pode iniciar seu servidor de desenvolvimento local com:
npm run dev
O Nuxt iniciará um servidor local, geralmente disponível em http://localhost:3000. Para criar uma página simples, edite o arquivo pages/index.vue:
index.vue
<template>
  <div>
    <h1>Olá do Nuxt!</h1>
  </div>
</template>

Criando o Arquivo de Configuração da Square Cloud

Saiba mais sobre: como criar o arquivo de configuração da Square Cloud.

O arquivo squarecloud.app é um arquivo de configuração que define o nome, descrição, versão, arquivo principal e outras configurações da sua aplicação.

Compra de um Plano Antes de Enviar o Projeto

Antes de realizar o deploy do seu projeto na Square Cloud, verifique se você possui um plano ativo que atenda às necessidades de recursos da sua aplicação.
Não sabe quanta RAM e CPU uma aplicação Nuxt precisa? Nuxt é um framework poderoso que suporta SSR, ISR e renderização estática. Para a maioria dos projetos Nuxt, o plano Standard, com 4GB de RAM e 4vCPU, é suficiente. Contudo, se seu projeto fizer uso intenso de SSR ou tiver alto tráfego, considere atualizar para o plano Pro.

Build do Nuxt para Produção

Antes de enviar para a Square Cloud, gere o build de produção:
npm run build
Esse comando cria a pasta .output, necessária para executar o servidor Nuxt. Ela contém o arquivo MAIN neste caminho: .output/server/index.mjs

Upload do Projeto para a Square Cloud

Após preparar todos os arquivos do projeto, proceda com o upload para a Square Cloud e hospede sua aplicação profissionalmente.
  • Upload via Dashboard
  • Upload via CLI
Acesse o Dashboard da Square Cloud e faça o upload dos arquivos do seu projeto.

Recursos Adicionais

Para mais informações sobre o Nuxt, visite a documentação oficial aqui.

Solução de Problemas

Domínio Personalizado

Para usar domínio personalizado (ex: meusite.com) ao invés da URL padrão https://meusite.squareweb.app/, você precisa do plano Standard ou superior. O subdomínio é definido pelo campo SUBDOMAIN no arquivo de configuração. Veja: Como configurar seu domínio personalizado.

Requisitos Mínimos de RAM

Mínimo: 512MB de RAM para websites/APIs simples. Para sites com frameworks (Next.JS, React, Vue, Angular, etc.), sugerimos sempre pelo menos 1GB de RAM. Para aplicações maiores, use mais RAM para evitar erro LACK_OF_RAM e garantir performance.

Não foi possível encontrar esse site.

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.

Site demorou demais para responder...

Verifique se configurou corretamente a porta 80 e host 0.0.0.0 na aplicação. Recomendamos usar as variáveis de ambiente forçadas da Square: PORT e HOST do arquivo .env.
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.