212 lines
4.8 KiB
Markdown
212 lines
4.8 KiB
Markdown
# 🚀 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
|
|
|
|
```bash
|
|
# 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
|
|
```bash
|
|
# 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
|
|
```bash
|
|
sudo systemctl stop newwhats-frontend-dev newwhats-backend-dev
|
|
```
|
|
|
|
#### Ativar Auto-start na Boot
|
|
```bash
|
|
sudo systemctl enable newwhats-frontend-dev newwhats-backend-dev
|
|
```
|
|
|
|
---
|
|
|
|
### Opção 2: Rodar Manualmente (Terminal)
|
|
|
|
#### Terminal 1 - Frontend (Hot-Reload)
|
|
```bash
|
|
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)
|
|
```bash
|
|
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
|
|
```bash
|
|
# 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
|
|
```bash
|
|
# 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
|
|
```bash
|
|
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
|
|
```bash
|
|
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
|
|
|
|
1. **Sempre use dev em desenvolvimento** — hot-reload economiza tempo
|
|
2. **Teste em produção antes de deploy** — verifique otimizações
|
|
3. **Mantenha `.env` sincronizado** — mudanças críticas requerem restart
|
|
4. **Limpe logs regularmente** — `journalctl --vacuum=time=7d`
|
|
5. **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)
|