metadata.title

Desplegar una app Next.js en Clouding.io es totalmente posible, pero Clouding no tiene un servicio “Next.js nativo” como Vercel o Netlify, así que normalmente se hace desplegando en un servidor VPS con Node.js. Te explico paso a paso la forma más típica de hacerlo:

1. Preparar el VPS en Clouding

1. Crea un VPS desde Clouding.io.

• Recomiendo Ubuntu 22.04 LTS.
• Elige al menos 2 GB de RAM para Next.js en producción.
• Parece una locura, pero elige 10GB, porque a poco que añadas paquetes se te consumen 5GB

2. Conéctate al VPS por SSH:

1ssh usuario@IP_DEL_SERVIDOR

2. Instalar Node.js y npm

1. Actualiza el sistema:

1sudo apt update && sudo apt upgrade -y

2. Instala Node.js (recomiendo LTS, actualmente 20.x):

1curl -fsSL https://deb.nodesource.com/setup_20.x | sudo -E bash -
2sudo apt install -y nodejs

3. Verifica:

1node -v
2npm -v

3. Subir tu app Next.js al servidor

1git clone https://github.com/usuario/mi-app-next.git
2cd mi-app-next

Si tienes dudas o problemas, visita mi guía, Adding a SSH key to an VPN.

4. Instalar dependencias y construir la app

Paso previo, por si acaso:

1sudo apt install -y bzip2

Y ahora intenta isntalar las dependencias

1npm install
2npm run build

Esto generará la carpeta .next lista para producción.

5. Ejecutar la app

1npm start

Por defecto Next.js corre en el puerto 3000, algo así:

1
2   ▲ Next.js 15.3.4
3   - Local:        http://localhost:3000
4   - Network:      http://[IP]:3000
5
6 ✓ Starting...
7 ✓ Ready in 484ms

6. Crear el archivo .env en tu proyecto

1. En tu VPS, dentro de la carpeta de tu app (/root/[proyecto]):

1vi .env

Ejemplo:

1NODE_ENV=production
2NEXT_PUBLIC_API_URL=https://api.midominio.com
3DATABASE_URL=mysql://user:pass@localhost:3306/dbname

2. Reconstruir la app cuando cambies el `.env`` Next.js lee el .env en build time, así que cada vez que lo modifiques, debes volver a construir:

1npm run build
2npm start

7. Configurar un proceso en segundo plano (opcional pero recomendado)

Usa PM2 para que la app siga corriendo si cierras la sesión SSH:

1sudo npm install -g pm2
2pm2 start npm --name "mi-app-next" -- start
3pm2 save
4pm2 startup

Mas información sobre pm2: https://help.clouding.io/hc/es/articles/4402736917394-C%C3%B3mo-usar-PM2-para-gestionar-una-app-en-Node-js

8. Configurar Nginx como reverse proxy (para usar tu dominio y HTTPS)

1. Instala Nginx:

1sudo apt install nginx -y

2. Configura el archivo de sitio (/etc/nginx/sites-available/mi-app):

1server {
2    listen 80;
3    server_name midominio.com www.midominio.com;
4
5    location / {
6        proxy_pass http://localhost:3000;
7        proxy_http_version 1.1;
8        proxy_set_header Upgrade $http_upgrade;
9        proxy_set_header Connection 'upgrade';
10        proxy_set_header Host $host;
11        proxy_cache_bypass $http_upgrade;
12    }
13}

3. Habilita el sitio:

1sudo ln -s /etc/nginx/sites-available/mi-app /etc/nginx/sites-enabled/
2sudo nginx -t
3sudo systemctl restart nginx

4. Instala Certbot para HTTPS:

1sudo apt install certbot python3-certbot-nginx -y
2sudo certbot --nginx -d midominio.com -d www.midominio.com

Con esto, tu app Next.js debería estar corriendo en Clouding.io con tu dominio y HTTPS.

Troubleshooting

Activar la el acceso via IP sin nombre de dominio aun?

Usar Nginx como reverse proxy

No es muy práctico exponer el puerto 3000. Lo normal es:

Dejar Next.js corriendo en localhost:3000.

Configurar Nginx para que escuche en el puerto 80 (y 443 con HTTPS) y redirija las peticiones al 3000.

Ejemplo de config /etc/nginx/sites-available/NOMBRE:

1server {
2    listen 80;
3    server_name 200.234.238.114 tu-dominio.com;
4
5    location / {
6        proxy_pass http://127.0.0.1:3000;
7        proxy_http_version 1.1;
8        proxy_set_header Upgrade $http_upgrade;
9        proxy_set_header Connection 'upgrade';
10        proxy_set_header Host $host;
11        proxy_cache_bypass $http_upgrade;
12    }
13}

Activar config:

1sudo ln -s /etc/nginx/sites-available/accessiblai /etc/nginx/sites-enabled/
2sudo nginx -t
3sudo systemctl restart nginx

Con eso podrás abrir tu app directamente en http://200.234.238.114 (y luego añadir HTTPS con Let’s Encrypt).