Web Based VSCode with code-server 🌱

Installing code-server

  1. Log into the Linux device
  2. Run the following commands in a terminal:
    # download the code-server install.sh
    wget https://code-server.dev/install.sh
    # make it executable
    chmod +x ./install.sh
    # run the installer
    sudo ./install.sh --prefix=/usr/local
    # start the service as root
    sudo su
    sudo systemctl enable --now code-server@$USER
    exit
    # edit the config.yaml
    sudo nano /root/.config/code-server/config.yaml
  3. Edit the password, or change the authentication type to none and change the bind-addr to bind-addr: 127.0.0.1:8888
  4. Continue with the following command in terminal:
    # restart code-server service
    sudo systemctl restart code-server@root.service
  5. Launch on web browser on the host running code-server and navigate to http://DNSorIP:8888
  6. Browser based VS Code......pretty nice

Out of the box, code-server is only reachable from the host that it is installed on. An easy to configure workaround is to setup a proxy server to allow requests to Apache/NGINX to be routed to code-server.

Apache Proxy Server (optional, but recommended)

  1. Run the following commands in terminal:
    # install apache httpd
    sudo apt install apache2
    # enable headers, rewrite, proxy and proxy_http modules
    sudo a2enmod proxy proxy_http rewrite headers proxy_wstunnel
    # edit the default site
    sudo nano /etc/apache2/sites-available/000-default.conf
  2. Paste the following configuration into the existing VirtualHost

    <location /code>
    RewriteEngine On
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_URI} !(.*)/$
    RewriteRule ^(.*)$ http://%{HTTP_HOST}/code/ [L,R=301]
    </location>

    <location /code/>
    Header set X-Frame-Options ALLOWALL
    RewriteEngine On
    RewriteCond %{HTTP:Upgrade} =websocket [NC]
    RewriteRule /(.*) ws://127.0.0.1:8888/$1 [P,L]
    ProxyPreserveHost on
    ProxyPass http://127.0.0.1:8888/
    ProxyPassReverse http://127.0.0.1:8888/
    </location>

  3. Press CTRL+O, Enter, CTRL+X to write the changes to code-server.conf
  4. Continue with the following commands in terminal:
    # restart the apache service
    sudo systemctl restart apache2
  5. Back in the web browser, navigate to http://DNSorIP/vscode
  6. Enjoy your web based VS Code

Source: https://github.com/cdr/code-server
Proxy resource: https://github.com/cdr/code-server/issues/282