Vscode en tu navegador

Esto no es algo nuevo, pero lo he descubierto hace poco y me ha parecido increíble. Se trata de auto alojar un servidor de vscode para que puedas programar desde tu navegador y continuar en cualquier dispositivo.

Para ello, voy a utilizar docker, porque es la opción mas conveniente para mí, pero puedes instalar este servicio de más formas.

Esto es mucho más útil si tienes un dominio, porque podrás acceder desde fuera de tu red local y continuar programando en cualquier lugar. Recomiendo ver mi post sobre cómo acceder de forma remota a servicios auto alojados, de forma gratuita y sencilla.

Puedes instalarlo en tu raspberry, de forma que esté disponible las 24h. Si a alguien le gusta este mundo, yo recomiendo montar un servidor casero, puede ser un ordenador viejo que haya por casa, instalar linux server o otro sistema operativo y trastear con él.

Comencemos

Para continuar con la instalación en docker, lógicamente debes tenerlo instalado. En mi caso, lo uso en ubuntu. Recomiendo mucho la instalación de portainer CE para un manejo más sencillo de docker.

Usaremos la imagen de docker de linuxserver. Usaremos docker compose, o si tienes portainer, es lo mismo que un custom template.

Portainer

Ve a App Templates > Custom Templates > Add Custom Template

Luego rellena la información necesaria (nombre, descripción) y pega el contenido del dockerfile en el editor web.

Docker compose

Debes crear un archivo llamado docker-compose.yml y pegar el siguiente contenido.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
---
version: "2.1"
services:
  code-server:
    image: lscr.io/linuxserver/code-server:latest
    container_name: code-server
    environment:
      - PUID=1000
      - PGID=1000
      - TZ=Etc/UTC
      - PASSWORD=password
      - SUDO_PASSWORD=password
    volumes:
      - /path/to/appdata/config:/config
    ports:
      - 8443:8443
    restart: unless-stopped

Ahora tenemos que cambiar los parámetros para que se ajusten a tí.

  • TZ escribe tu zona horaria. La mía es Europe/Madrid.

  • PASSWORD Una contraseña para poder acceder.

  • SUDO_PASSWORD Una contraseña para los privilegios root.

  • /path/to/appdata/config Debes cambiar esta ruta por la que tu quieras, aquí será donde se guarden los datos del contenedor.

  • El puerto lo puedes cambiar si ya tienes ese en uso.

Ahora toca desplegar el contenedor.

  • Para desplegar desde portainer es muy sencillo, una vez creado el template, pulsa sobre él y despliegalo.

  • Para hacerlo desde la linea de comandos, ejecuta sudo docker-compose up -d (en el mismo directorio que el archivo). Si no tienes docker-compose deberás instalarlo, para ubuntu sudo apt update && sudo apt install docker-compose.

Si lo has hecho todo correctamente, debes poder acceder desde tu navegador a la dirección ip de la máquina con docker y el puerto indicado.

¡Listo! Ahora tienes VS code en tu navegador, puedes instalar todas las dependencias y extensiones que quieras.

Continuar desde fuera de casa

Si quieres acceder de forma remota a tu code server, primero lee mi post sobre como conseguir un dominio y un tunel de cloudflare.

Cuando estés en el cuarto paso, simplemente completa los datos con el subdominio que quieras, la ip de la máquina ejecutando el code server y tipo HTTP. Listo! Cloudflare se ocupará de todo y ya podrás continuar con tu proyecto desde cualquier sitio.