Instalación de Code-Server: VS Code en el Navegador

Code-server es la implementación oficial de VS Code que puedes ejecutar en tu servidor Linux y acceder desde cualquier navegador, convirtiendo cualquier dispositivo en una estación de desarrollo completa. Al combinar la potencia de un entorno remoto con la familiaridad del editor más popular, es perfecta para equipos distribuidos, desarrollo en servidores de producción o entornos con recursos limitados en el cliente.

Requisitos Previos

Servidor Linux con Ubuntu 20.04+, Debian 11+ o CentOS 8+
Mínimo 1 GB de RAM (recomendado 2 GB)
Dominio configurado apuntando al servidor (para SSL)
Acceso root o sudo
Nginx instalado (para proxy inverso)

Instalación de Code-Server

El método más sencillo es usar el script oficial de instalación:

# Descargar e instalar code-server (método recomendado)
curl -fsSL https://code-server.dev/install.sh | sh

# Verificar la versión instalada
code-server --version

# Habilitar y arrancar el servicio
sudo systemctl enable --now code-server@$USER

# Comprobar el estado
sudo systemctl status code-server@$USER

Para instalación manual con el paquete .deb:

# Obtener la última versión disponible
VERSION=$(curl -s https://api.github.com/repos/coder/code-server/releases/latest \
  | grep '"tag_name"' | cut -d'"' -f4 | sed 's/v//')

# Descargar el paquete para Debian/Ubuntu
wget "https://github.com/coder/code-server/releases/download/v${VERSION}/code-server_${VERSION}_amd64.deb"

# Instalar el paquete
sudo dpkg -i code-server_${VERSION}_amd64.deb

Configuración Inicial

El fichero de configuración se encuentra en ~/.config/code-server/config.yaml:

# Ver la configuración actual
cat ~/.config/code-server/config.yaml

Edita la configuración según tus necesidades:

# Escucha solo en localhost (Nginx hará el proxy)
bind-addr: 127.0.0.1:8080
auth: password
password: CAMBIA_ESTA_CONTRASEÑA_SEGURA
cert: false

# Reiniciar el servicio para aplicar cambios
sudo systemctl restart code-server@$USER

# Ver los logs
sudo journalctl -u code-server@$USER -f

Proxy Inverso con Nginx y SSL

Instala Nginx y Certbot para gestionar los certificados SSL:

# Ubuntu/Debian
sudo apt update && sudo apt install -y nginx certbot python3-certbot-nginx

# CentOS/Rocky
sudo dnf install -y nginx certbot python3-certbot-nginx

Crea la configuración de Nginx:

sudo tee /etc/nginx/sites-available/code-server << 'EOF'
server {
    listen 80;
    server_name vscode.tudominio.com;
    return 301 https://$host$request_uri;
}

server {
    listen 443 ssl http2;
    server_name vscode.tudominio.com;

    # Certificados SSL (Certbot los gestionará)
    ssl_certificate /etc/letsencrypt/live/vscode.tudominio.com/fullchain.pem;
    ssl_certificate_key /etc/letsencrypt/live/vscode.tudominio.com/privkey.pem;

    # Configuración SSL segura
    ssl_protocols TLSv1.2 TLSv1.3;
    ssl_ciphers HIGH:!aNULL:!MD5;

    location / {
        proxy_pass http://127.0.0.1:8080/;
        proxy_set_header Host $host;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection upgrade;
        proxy_set_header Accept-Encoding gzip;
        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;
    }
}
EOF

# Habilitar el sitio
sudo ln -s /etc/nginx/sites-available/code-server \
  /etc/nginx/sites-enabled/code-server

# Verificar la configuración de Nginx
sudo nginx -t

# Obtener certificado SSL
sudo certbot --nginx -d vscode.tudominio.com

# Recargar Nginx
sudo systemctl reload nginx

Autenticación y Seguridad

Code-server soporta autenticación por contraseña o token. Para mayor seguridad, considera añadir autenticación HTTP básica en Nginx además de la de code-server:

# Instalar apache2-utils para htpasswd
sudo apt install -y apache2-utils

# Crear fichero de contraseñas
sudo htpasswd -c /etc/nginx/.htpasswd tuusuario

Añade autenticación básica al bloque location de Nginx:

location / {
    # Capa adicional de autenticación
    auth_basic "Acceso Restringido";
    auth_basic_user_file /etc/nginx/.htpasswd;

    proxy_pass http://127.0.0.1:8080/;
    proxy_set_header Host $host;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection upgrade;
}

Restringe el acceso por IP si solo accedes desde ubicaciones conocidas:

location / {
    # Solo permitir acceso desde tu IP
    allow 203.0.113.10;  # Tu IP pública
    deny all;

    proxy_pass http://127.0.0.1:8080/;
    # ... resto de directivas
}

Gestión de Extensiones

Instala extensiones directamente desde la terminal del servidor:

# Instalar extensión por ID
code-server --install-extension ms-python.python
code-server --install-extension esbenp.prettier-vscode
code-server --install-extension dbaeumer.vscode-eslint

# Listar extensiones instaladas
code-server --list-extensions

# Instalar un conjunto de extensiones de desarrollo
for ext in \
  ms-python.python \
  golang.go \
  rust-lang.rust-analyzer \
  ms-vscode.cpptools \
  redhat.java; do
  code-server --install-extension $ext
done

Las extensiones de VS Code Marketplace no siempre están disponibles en el marketplace open-source de code-server. Para instalar extensiones del marketplace oficial:

# Descargar la extensión .vsix y luego instalar
wget https://marketplace.visualstudio.com/_apis/public/gallery/publishers/ms-vscode/vsextensions/remote-ssh/latest/vspackage \
  -O remote-ssh.vsix

code-server --install-extension remote-ssh.vsix

Despliegue con Docker

Para un despliegue aislado con Docker:

# Ejecutar code-server con Docker
docker run -d \
  --name code-server \
  -p 127.0.0.1:8080:8080 \
  -v "$HOME/.config:/home/coder/.config" \
  -v "$PWD:/home/coder/project" \
  -u "$(id -u):$(id -g)" \
  -e "DOCKER_USER=$USER" \
  ghcr.io/coder/code-server:latest

Con Docker Compose para un entorno más completo:

# docker-compose.yml
version: "3.8"

services:
  code-server:
    image: ghcr.io/coder/code-server:latest
    container_name: code-server
    restart: unless-stopped
    ports:
      - "127.0.0.1:8080:8080"
    environment:
      - PASSWORD=TU_CONTRASEÑA_SEGURA
      - DOCKER_USER=${USER}
    volumes:
      - ./config:/home/coder/.config
      - ./workspace:/home/coder/workspace
      - /var/run/docker.sock:/var/run/docker.sock
    user: "1000:1000"

# Arrancar el contenedor
docker compose up -d

# Ver logs
docker compose logs -f code-server

Solución de Problemas

Error de WebSocket al conectar:

# Verificar que Nginx pasa las cabeceras de upgrade
sudo nginx -t

# Comprobar los logs de Nginx
sudo tail -f /var/log/nginx/error.log

Code-server no arranca:

# Ver logs detallados del servicio
sudo journalctl -u code-server@$USER -n 50 --no-pager

# Comprobar que el puerto 8080 está libre
sudo ss -tlnp | grep 8080

Extensiones que no se instalan:

# Verificar conectividad desde el servidor
curl -I https://open-vsx.org

# Instalar extensión desde fichero local .vsix
code-server --install-extension /ruta/a/extension.vsix

Problemas de permisos en el workspace:

# Ajustar propietario del directorio de trabajo
sudo chown -R $USER:$USER /ruta/al/workspace

Conclusión

Code-server transforma cualquier servidor Linux en un entorno de desarrollo completo accesible desde el navegador, eliminando la necesidad de configurar entornos locales. Con Nginx como proxy inverso y certificados SSL, obtienes una instalación segura y profesional lista para equipos de cualquier tamaño. Combínalo con Docker para aislar proyectos y mantener entornos reproducibles.

Code-Server VS Code in Browser Installation

On this page