ruicesar/instrucoes_gerais

Fork 0

Table of Contents

🚀 Guia de Desenvolvimento - NewWhats

📋 Portas
🛠️ Setup Inicial

1. Requisitos
2. Instalar Dependências

🏃 Executar em Desenvolvimento (Hot-Reload)

Opção 1: Usar Serviços Systemd (Recomendado)

Iniciar Ambos os Serviços
Parar Serviços Dev
Ativar Auto-start na Boot

Opção 2: Rodar Manualmente (Terminal)

Terminal 1 - Frontend (Hot-Reload)
Terminal 2 - Backend (Hot-Reload)

📝 Variáveis de Ambiente

Frontend
Backend

🔄 Hot-Reload em Ação

Frontend
Backend

🚨 Troubleshooting

Porta já em uso
Serviço não inicia
Mudanças não aparecem

⚙️ Scripts Disponíveis

Frontend
Backend

🔗 URLs de Desenvolvimento
📌 Produção vs Desenvolvimento
🤝 Boas Práticas
📞 Suporte

🚀 Guia de Desenvolvimento - NewWhats

Este documento descreve como configurar e rodar o ambiente de desenvolvimento com hot-reload para desenvolvimento rápido.

📋 Portas

Serviço	Produção	Desenvolvimento
Frontend (Next.js)	3003	4004
Backend (Express)	8008	8009

🛠️ Setup Inicial

1. Requisitos

Node.js (verifique com node -v)
npm (verifique com npm -v)
PostgreSQL rodando
DragonflyDB (Redis-compatible) rodando
NATS JetStream rodando
Temporal.io rodando

2. Instalar Dependências

# Frontend
cd frontend
npm install

# Backend
cd ../backend
npm install

🏃 Executar em Desenvolvimento (Hot-Reload)

Opção 1: Usar Serviços Systemd (Recomendado)

Iniciar Ambos os Serviços

# Iniciar dev services
sudo systemctl start newwhats-frontend-dev newwhats-backend-dev

# Verificar status
sudo systemctl status newwhats-frontend-dev newwhats-backend-dev

# Ver logs em tempo real
sudo journalctl -u newwhats-frontend-dev -f
sudo journalctl -u newwhats-backend-dev -f

Parar Serviços Dev

sudo systemctl stop newwhats-frontend-dev newwhats-backend-dev

Ativar Auto-start na Boot

sudo systemctl enable newwhats-frontend-dev newwhats-backend-dev

Opção 2: Rodar Manualmente (Terminal)

Terminal 1 - Frontend (Hot-Reload)

cd /home/deploy/projetos/newwhats.local/frontend
npm run dev

# Output esperado:
# ▲ Next.js 14.2.35
# - Local:        http://localhost:4004
#  ✓ Ready in X.Xs

Terminal 2 - Backend (Hot-Reload)

cd /home/deploy/projetos/newwhats.local/backend
npm run dev

# Output esperado:
# Server running on port 8009
# Watching for file changes...

📝 Variáveis de Ambiente

Frontend

NODE_ENV=development → Ativa React DevTools e hot-reload
Porta: 4004 (configurado em package.json)

Backend

NODE_ENV=development → Logs detalhados, sem compressão
PORT=8009 → Porta dev (não conflita com produção 8008)
.env já está configurado com valores corretos

🔄 Hot-Reload em Ação

Frontend

Edite arquivos em frontend/pages/, frontend/components/, etc.
Next.js recompila automaticamente e atualiza o navegador
Para mudanças em next.config.mjs, reinicie o serviço

Backend

Edite arquivos em backend/src/
tsx watch reinicia o servidor automaticamente
Mudanças em .env requerem restart manual

🚨 Troubleshooting

Porta já em uso

# Verificar qual processo usa a porta
lsof -i :4004  # Frontend
lsof -i :8009  # Backend

# Matar processo (último recurso)
sudo kill -9 <PID>

Serviço não inicia

# Verificar logs detalhados
sudo systemctl status newwhats-frontend-dev
sudo journalctl -u newwhats-frontend-dev -n 50

# Recarregar systemd após editar .service
sudo systemctl daemon-reload

Mudanças não aparecem

Frontend: Limpar cache do navegador (Ctrl+Shift+Del)
Backend: Aguarde a mensagem de restart no terminal

⚙️ Scripts Disponíveis

Frontend

npm run dev        # Desenvolvimento com hot-reload (porta 4004)
npm run build      # Build para produção
npm run start      # Rodar build (produção, porta 3003)
npm run lint       # Linting

Backend

npm run dev        # Desenvolvimento com tsx watch (porta 8009)
npm run build      # Compilar TypeScript
npm run start      # Rodar compilado (produção, porta 8008)
npm run db:migrate # Migrar database
npm run db:push    # Push schema para database
npm run db:studio  # Prisma Studio

🔗 URLs de Desenvolvimento

Frontend: http://localhost:4004
Backend API: http://localhost:8009
Prisma Studio: npm run db:studio (backend)

📌 Produção vs Desenvolvimento

Aspecto	Produção	Desenvolvimento
Hot-reload	❌	✅
Compilação	✅ Build prévio	❌ On-the-fly
Logs	Estruturados (JSON)	Pretty-printed
Otimização	✅	❌
Velocidade Dev	Lenta	⚡ Rápida

🤝 Boas Práticas

Sempre use dev em desenvolvimento — hot-reload economiza tempo
Teste em produção antes de deploy — verifique otimizações
Mantenha .env sincronizado — mudanças críticas requerem restart
Limpe logs regularmente — journalctl --vacuum=time=7d
Verifique portas antes de mudar — evite conflitos

📞 Suporte

Para problemas ou dúvidas, verifique:

Logs dos serviços: journalctl -u newwhats-*-dev -f
Status das dependências: systemctl status postgresql dragonfly nats
Conectividade: curl http://localhost:8009/health

Última atualização: 2026-04-10 Ambiente: Linux (Debian/Ubuntu)