APIs de WhatsApp, Automação e Chatbots, Disparo em Massa, Geral, Infraestrutura e Servidores, Inteligência Artificial

Live Z-PRO: Nova Interface

20 de março de 2026 Comentários desativados em Live Z-PRO: Nova Interface

Links importantes

				
					## FRONTEND NOVO

1- Acessar máquina como deployzdg e subir o arquivo .zip
	unzip frontNovo.zip
	cd frontNovo
	npm i -f
	configurar .env.local
	npm run build
	pm2 start npm --name "frontendNovo" -- start
	
==============================================================
	
2- Navegar até a pasta do backend
	configurar .env
	
	SECURE_URL=* 
	FRONTEND_URL_2=https://demonext.zdg.com.brcomu;
	
==============================================================

3- Criar o registro DNS e gerar o certbot

sudo nano /etc/nginx/sites-available/frontendNovo

server {
  server_name demonext.zdg.com.br;

  location / {
    proxy_pass http://127.0.0.1:3201;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection 'upgrade';
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-Proto $scheme;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_cache_bypass $http_upgrade;
  }
}

sudo ln -s /etc/nginx/sites-available/frontendNovo /etc/nginx/sites-enabled

sudo certbot --nginx

==============================================================
Guia de Deploy: Subindo um Novo Frontend com PM2, Nginx e Certbot

Guia de Deploy: Subindo um Novo Frontend com PM2, Nginx e Certbot

Bora pra ação! Hoje o tutorial é para quem já está com a mão na massa e precisa fazer o deploy de uma nova versão do frontend em um servidor. Vamos seguir o passo a passo completo, desde o upload do arquivo até a configuração do Nginx com certificado SSL.

Este guia assume que você já tem um backend rodando no servidor e agora quer apontar um novo subdomínio para uma nova interface.

Material de Apoio

Todo o passo a passo e os blocos de código que você precisa para este deploy estão disponíveis logo acima nesta página.

Pré-requisitos

Antes de começar, garanta que seu ambiente está pronto:

  • Um servidor VPS com acesso SSH (neste exemplo, usamos o usuário deployzdg).
  • O backend da sua aplicação já deve estar rodando no servidor.
  • Nginx, PM2 e Certbot já devem estar instalados na máquina.
  • Um registro DNS do tipo "A" já criado, apontando seu novo subdomínio (ex: demonext.zdg.com.br) para o IP do seu servidor.
  • O seu projeto de frontend compilado e compactado em um arquivo .zip (ex: frontNovo.zip).

Passo 1: Fazendo o Deploy da Aplicação Frontend

A primeira etapa é colocar os arquivos do seu frontend no servidor e prepará-los para serem executados.

  1. Upload e Descompactação: Acesse seu servidor (por exemplo, via SFTP com o Bitvise) e envie o arquivo frontNovo.zip. Em seguida, acesse via terminal e descompacte: 
    unzip frontNovo.zip
  2. Instale as Dependências: Navegue para a pasta recém-criada e instale os pacotes necessários: 
    cd frontNovo
npm install -f

    O -f (force) pode ser útil para resolver conflitos de dependências entre pacotes.

Atenção: Configure seu .env.local!

Este é um passo crucial. Seu frontend precisa saber onde encontrar o backend. Na pasta do projeto, renomeie o arquivo .env.example para .env.local e preencha as variáveis de ambiente, principalmente a URL da sua API backend.

  1. Compile a Aplicação: Gere a versão de produção do seu frontend: 
    npm run build