Home / How To / How to install the Visual Studio code

How to install the Visual Studio code



Code Server is a Visual Studio (VS) code that can be run remotely on the server and accessed through a web browser. It allows you to create and have a consistent development environment that you can access anytime, anywhere.

In this tutorial we will show you how to install the code server with Nginx as a reverse proxy and SSL Letsencrypt on the latest Ubuntu 20.04 server.

Conditions

For this guide, we will install Visual Code Server on the Ubuntu 20.04 server with 4 GB of RAM, 25 GB of free disk space and 2CPU.

What we should do:

  • Download and install Visual Code Server packages
  • Set up Visual Code Server authentication
  • Generate SSL Letsnecrypt
  • Install and configure Nginx as a reverse proxy
  • Testing

Step 1 – Download and install packages with Visual Code Server

First we will download Visual Code Server latest version of Ubuntu FocalFossa and install it in our system.

By default, the code server packages are available for multiple operating systems. You can check the publisher page for the code server on GitHub with the following link.

https://github.com/cdr/code-server/releases

Download the Visual Code Server for Ubuntu packages now using the wget command below.

wget -q https://github.com/cdr/code-server/releases/download/3.4.1/code-server_3.4.1_amd64.deb

Then install the visual code server package using the dpkg command below.

sudo dpkg -i code-server_3.4.1_amd64.deb

When the installation is complete, start the code server service and add it to the system boot.

systemctl --user start code-server
systemctl --user enable code-server

Download and install Visual Code Studio Server

Visual Code Server is running, check it with the following command.

ss -plnt
systemctl --user status code-server

Below you see the result.

Checks service status and port for Visual Code Studio Server

As shown, by default, the Visual Code Server runs at the local IP address ‘127.0.0.1’ with the TCP port ‘8080’.

Step 2 – Setup Authentication for Visual Code Server

By default, the visual code server runs with authentication enabled on it.

The password authentication of the visual code server is generated by default to the file ‘~ / .config / code-server / config.yaml’.

Check the visual code server configuration with the following command.

cat ~/.config/code-server/config.yaml

You will get something similar in this configuration.

bind-addr: 127.0.0.1:8080
auth: password
password: 58403006a03529a2d26c08af
cert: false

Details configurations:

  • “Bind-addr” is an option used to define the IP address and port on which the code server is to run.
  • The “authorization” option is used as the authentication method for Visual Code Server, and by default the “password” authentication method is used.
  • The “password” option is used to define your Visual Code Server access password and ensure that you use a strong password.

To change the Visual Code Server binding address, port, and password, change the default configuration ‘~ / .config / code-server / config.yaml’ as needed.

Default configuration Visual Code Server

Step 3 – Generate SSL Letsencrypt

In this step, we will generate SSL song encryption with the certbot tool to secure the code server.

Install the certbot tool with the apt command below.

sudo apt install certbot -y

When the installation is complete, generate the SSL easy-to-use encryption using the certbot command below.

certbot certonly --standalone --agree-tos -m [email protected] -d vscode.hakase-labs.io

When done, your certificates will be in the directory ‘/etc/letsencrypt/live/vscode.hakase-labs.io/’.

ls -lah /etc/letsencrypt/live/vscode.hakase-labs.io/

Now you have generated SSL Letsencrypt to secure the code server installation with the certbot tool.

Step 4 – Set up Nginx as a reverse proxy

In this step, we will install the Nginx web server and configure it as a reverse proxy for the code server with SSL enabled on top.

Install the Nginx package using the apt command below.

sudo apt install nginx -y

When the installation is complete, go to the directory ‘/ etc / nginx / sites-available’ and create a new virtual host configuration ‘code server’.

cd /etc/nginx/sites-available/
vim code-server

Now change the domain name and path for SSL with your own and paste the configuration into it.

server {
listen 80;
server_name vscode.hakase-labs.io;
# enforce https
return 301 https://$server_name:443$request_uri;
}

server {
listen 443 ssl http2;
server_name vscode.hakase-labs.io;

ssl_certificate /etc/letsencrypt/live/vscode.hakase-labs.io/fullchain.pem;
ssl_certificate_key /etc/letsencrypt/live/vscode.hakase-labs.io/privkey.pem;

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;
}
}

Save and close.

Now enable the virtual code “code server”, test the nginx configuration and make sure there is no error.

ln -s /etc/nginx/sites-available/code-server /etc/nginx/sites-enabled/
nginx -t

Set up Nginx as a reverse proxy for Visual Code Server

Then restart the nginx service and add it to the system boot.

systemctl restart nginx
systemctl enable nginx

The Nginx service is now running as a reverse proxy for the code server. Check it with the command below.

netstat -plntu
systemctl status nginx

And you will get the result as below.

Set up Nginx as a reverse proxy for Visual Code Server

The Nginx service is running on the Ubuntu 20.04 server with the HTTP and HTTPS ports enabled on top of it.

Step 5 – Test

Open your browser and enter the URL of your code server installation.

https://vscode.hakase-labs.io/

Log in with your password that you have configured in the code server’s service file.

Visual code server login page

When the password is correct, you will get the VS Code Editor in your browser as below.

Visual code server in Ubuntu 20.04

As a result, you installed the code server on the Ubuntu 20.04 server using Nginx as a reverse proxy and secured the code server installation with SSL Letsencrypt.

Reference


Source link