amayo/AmayoWeb/VPS_SETUP_COMMANDS.md

# 🎯 Comandos Exactos para el VPS

## ✅ Ya Tienes Configurado

```
✓ Certificado SSL para api.amayo.dev
✓ Certificado SSL para docs.amayo.dev (según tu configuración)
✓ NGINX instalado
```

## 📝 Pasos a Seguir

### 1. Configurar NGINX para docs.amayo.dev (Frontend Vue)

Editar el archivo de configuración existente:

```bash
sudo nano /etc/nginx/sites-available/default
```

**Reemplazar la configuración de `docs.amayo.dev` con esto:**

```nginx
server {
    listen 80;
    listen [::]:80;
    server_name docs.amayo.dev;
    return 301 https://$host$request_uri;
}

server {
    listen 443 ssl http2;
    listen [::]:443 ssl http2;
    server_name docs.amayo.dev;

    ssl_certificate /etc/letsencrypt/live/docs.amayo.dev/fullchain.pem;
    ssl_certificate_key /etc/letsencrypt/live/docs.amayo.dev/privkey.pem;
    include /etc/letsencrypt/options-ssl-nginx.conf;
    ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem;

    # IMPORTANTE: Cambiar a archivos estáticos
    root /var/www/docs.amayo.dev;
    index index.html;

    access_log /var/log/nginx/docs.amayo.dev.access.log;
    error_log /var/log/nginx/docs.amayo.dev.error.log;

    # Gzip
    gzip on;
    gzip_vary on;
    gzip_min_length 1024;
    gzip_types text/plain text/css text/xml text/javascript application/x-javascript application/xml+rss application/json application/javascript;

    # SPA fallback
    location / {
        try_files $uri $uri/ /index.html;
    }

    # Cache assets
    location ~* \.(js|css|png|jpg|jpeg|gif|ico|svg|woff|woff2|ttf|eot)$ {
        expires 1y;
        add_header Cache-Control "public, immutable";
    }

    # Security headers
    add_header X-Frame-Options "SAMEORIGIN" always;
    add_header X-Content-Type-Options "nosniff" always;
    add_header X-XSS-Protection "1; mode=block" always;
}
```

### 2. Configurar NGINX para api.amayo.dev (Backend)

En el mismo archivo o crear uno separado:

```bash
sudo nano /etc/nginx/sites-available/default
```

**Agregar o modificar la sección de `api.amayo.dev`:**

```nginx
server {
    listen 80;
    listen [::]:80;
    server_name api.amayo.dev;
    return 301 https://$host$request_uri;
}

server {
    listen 443 ssl http2;
    listen [::]:443 ssl http2;
    server_name api.amayo.dev;

    ssl_certificate /etc/letsencrypt/live/api.amayo.dev/fullchain.pem;
    ssl_certificate_key /etc/letsencrypt/live/api.amayo.dev/privkey.pem;
    include /etc/letsencrypt/options-ssl-nginx.conf;
    ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem;

    access_log /var/log/nginx/api.amayo.dev.access.log;
    error_log /var/log/nginx/api.amayo.dev.error.log;

    # Proxy al bot en puerto 3000
    location / {
        proxy_pass http://127.0.0.1:3000;
        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-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
        proxy_cache_bypass $http_upgrade;

        proxy_connect_timeout 60s;
        proxy_send_timeout 60s;
        proxy_read_timeout 60s;
    }

    # CORS para el frontend
    add_header Access-Control-Allow-Origin "https://docs.amayo.dev" always;
    add_header Access-Control-Allow-Methods "GET, POST, PUT, DELETE, OPTIONS" always;
    add_header Access-Control-Allow-Headers "Authorization, Content-Type" always;
    add_header Access-Control-Allow-Credentials "true" always;

    # Manejar preflight
    if ($request_method = 'OPTIONS') {
        add_header Access-Control-Allow-Origin "https://docs.amayo.dev" always;
        add_header Access-Control-Allow-Methods "GET, POST, PUT, DELETE, OPTIONS" always;
        add_header Access-Control-Allow-Headers "Authorization, Content-Type" always;
        add_header Access-Control-Max-Age 1728000;
        add_header Content-Type 'text/plain; charset=utf-8';
        add_header Content-Length 0;
        return 204;
    }

    # Security headers
    add_header X-Frame-Options "SAMEORIGIN" always;
    add_header X-Content-Type-Options "nosniff" always;
    add_header X-XSS-Protection "1; mode=block" always;
}
```

### 3. Verificar y Reiniciar NGINX

```bash
# Verificar sintaxis
sudo nginx -t

# Si está OK, reiniciar
sudo systemctl restart nginx

# Ver estado
sudo systemctl status nginx
```

### 4. Crear Directorio para el Frontend

```bash
# Crear directorio
sudo mkdir -p /var/www/docs.amayo.dev

# Ajustar permisos
sudo chown -R $USER:www-data /var/www/docs.amayo.dev
sudo chmod -R 755 /var/www/docs.amayo.dev
```

### 5. Deploy del Frontend (Desde tu PC Local)

En tu PC con Windows, en la carpeta `AmayoWeb`:

```powershell
# Build
npm run build

# El contenido estará en la carpeta dist/
```

**Transferir archivos al VPS:**

Opción A - Con SCP desde PowerShell:
```powershell
scp -r dist/* shnimlz@tu_ip_servidor:/home/shnimlz/amayo-frontend/
```

Opción B - Con WinSCP o FileZilla (interfaz gráfica)

**En el VPS, mover los archivos:**

```bash
# Copiar archivos al directorio web
sudo cp -r /home/shnimlz/amayo-frontend/* /var/www/docs.amayo.dev/

# Ajustar permisos
sudo chown -R www-data:www-data /var/www/docs.amayo.dev
sudo chmod -R 755 /var/www/docs.amayo.dev
```

### 6. Verificar Variables de Entorno del Bot

En el servidor VPS:

```bash
cd /ruta/a/tu/proyecto/amayo

# Editar .env
nano .env
```

Asegúrate de tener:

```env
PORT=3000
DISCORD_TOKEN=tu_token
# ... resto de tus variables
```

### 7. Verificar que el Bot Esté Corriendo

```bash
# Si usas PM2
pm2 status

# Ver logs
pm2 logs amayo

# Reiniciar si es necesario
pm2 restart amayo

# Si no usas PM2, verificar el proceso
ps aux | grep node

# Verificar que esté en el puerto 3000
netstat -tulpn | grep 3000
```

### 8. Verificar que Todo Funcione

```bash
# Verificar frontend
curl https://docs.amayo.dev

# Verificar backend API
curl https://api.amayo.dev/api/bot/stats

# Ver logs de NGINX
sudo tail -f /var/log/nginx/docs.amayo.dev.access.log
sudo tail -f /var/log/nginx/api.amayo.dev.access.log
```

## 🔥 Comando Rápido de Deploy (Crear Script)

Crear archivo en el servidor:

```bash
nano ~/deploy-amayo-frontend.sh
```

Contenido:

```bash
#!/bin/bash

echo "🚀 Deploying Amayo Frontend..."

# Limpiar directorio
sudo rm -rf /var/www/docs.amayo.dev/*

# Copiar nuevos archivos (ajusta la ruta según donde subas los archivos)
sudo cp -r /home/shnimlz/amayo-frontend/* /var/www/docs.amayo.dev/

# Permisos
sudo chown -R www-data:www-data /var/www/docs.amayo.dev
sudo chmod -R 755 /var/www/docs.amayo.dev

# Reiniciar NGINX
sudo systemctl reload nginx

echo "✅ Deploy completado!"
echo "🌐 https://docs.amayo.dev"
```

Hacer ejecutable:

```bash
chmod +x ~/deploy-amayo-frontend.sh
```

Usar:

```bash
./deploy-amayo-frontend.sh
```

## 🎯 Resumen de URLs

| Servicio | URL | Puerto Interno |
|----------|-----|----------------|
| Frontend | https://docs.amayo.dev | Archivos estáticos |
| Backend API | https://api.amayo.dev | → localhost:3000 |

## 🔍 Troubleshooting Rápido

### El frontend no carga

```bash
# Ver logs
sudo tail -f /var/log/nginx/error.log

# Verificar archivos
ls -la /var/www/docs.amayo.dev/

# Verificar NGINX
sudo nginx -t
```

### La API no responde (502)

```bash
# Verificar bot
pm2 status
pm2 logs amayo

# Verificar puerto
netstat -tulpn | grep 3000

# Reiniciar bot
pm2 restart amayo
```

### CORS errors

Verificar que la configuración de NGINX tenga los headers CORS correctos en la sección de `api.amayo.dev`.

---

**Notas:**
- El bot se ejecuta en el puerto **3000** (no 3001)
- El frontend son **archivos estáticos** de Vue
- NGINX hace **proxy** del API al bot en puerto 3000