Cómo instalar Excalidraw en un VPS

Importante: Esta guía despliega el editor de Excalidraw como una aplicación para un solo usuario. La imagen oficial de Docker sirve una SPA estática — no hay servidor WebSocket, no hay backend de sincronización y no hay colaboración en tiempo real. Las funciones como enlaces compartibles, cursores de presencia y cifrado extremo a extremo (disponibles en excalidraw.com) requieren que traigas tu propio proyecto Firebase o te suscribas a Excalidraw+. Esta guía cubre únicamente el editor.

Requisitos previos

• VPS con Ubuntu 22.04 o 24.04, acceso SSH y una IP pública
• Un dominio (ej. whiteboard.example.com) apuntando a tu VPS
• Docker instalado (se cubre en el Paso 2)
• Familiaridad básica con la línea de comandos

El editor es ligero. Una instancia de 1 GB RAM / 1 vCPU es suficiente para uso personal.

Paso 1, Conectar y preparar el servidor

ssh root@SERVER_IP
apt update && apt upgrade -y
apt install -y ca-certificates curl

Paso 2, Instalar Docker

Instala Docker Engine desde el repositorio oficial:

curl -fsSL https://get.docker.com | sh
systemctl enable --now docker
docker --version

Paso 3, Ejecutar Excalidraw con Docker

La imagen oficial de Excalidraw es excalidraw/excalidraw:latest. Ejecútala enlazada a un puerto local para no exponerla directamente a internet:

docker run -d \
  --name excalidraw \
  --restart unless-stopped \
  -p 127.0.0.1:8080:80 \
  excalidraw/excalidraw:latest

Esto descarga la imagen e inicia el editor en el puerto 8080 de la interfaz loopback. El contenedor sirve únicamente el editor estático — sin base de datos, sin WebSocket, sin colaboración.

Para verificar que el contenedor está corriendo:

docker ps --filter name=excalidraw

Paso 4, Configurar el proxy inverso

Dirige tu dominio al contenedor local con Nginx o Caddy y obtén un certificado TLS. A diferencia de aplicaciones de chat o herramientas colaborativas, no se necesitan cabeceras de actualización WebSocket — el canal de colaboración de Excalidraw se conecta directamente a Firebase (o al backend que configures), no a través de tu servidor.

Ejemplo con Nginx:

server {
    listen 443 ssl;
    server_name whiteboard.example.com;

    ssl_certificate /etc/letsencrypt/live/whiteboard.example.com/fullchain.pem;
    ssl_certificate_key /etc/letsencrypt/live/whiteboard.example.com/privkey.pem;

    location / {
        proxy_pass http://127.0.0.1:8080;
        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;
    }
}

Si usas Caddy, una sola línea en tu Caddyfile es suficiente:

whiteboard.example.com {
    reverse_proxy 127.0.0.1:8080
}

Caddy gestiona TLS automáticamente.

Paso 5, Primer acceso

Abre https://whiteboard.example.com en tu navegador. Verás el editor de Excalidraw.

Dibuja algo, luego recarga la página. El dibujo desaparece. Esto es normal — el editor guarda los datos en el almacenamiento local del navegador. Cerrar la pestaña o borrar los datos del navegador pierde el trabajo no guardado. Exporta siempre los dibujos importantes:

• Usa el botón Export para guardar como .excalidraw (reabrible) o como PNG/SVG.
• Usa la opción Save to disk para conservar una copia local.

Si necesitas almacenamiento persistente, considera configurar un proyecto Firebase propio o usar Excalidraw+.

Mantenimiento

Fija la etiqueta de la imagen a una versión específica en lugar de latest para evitar cambios inesperados:

docker pull excalidraw/excalidraw:latest
docker inspect excalidraw/excalidraw:latest | grep -i "org.opencontainers.image.version"

Una vez identificada una versión funcional, actualiza el contenedor:

docker stop excalidraw
docker rm excalidraw
docker run -d \
  --name excalidraw \
  --restart unless-stopped \
  -p 127.0.0.1:8080:80 \
  excalidraw/excalidraw:VERSION_ETIQUETADA

Monitorea los logs del contenedor para detectar errores de inicio:

docker logs excalidraw