Como Instalar o Visual Studio Code Cloud IDE no Servidor Ubuntu 24.04

O Visual Studio Code Cloud IDE é uma versão online do popular editor Visual Studio Code (VS Code) da Microsoft, projetado para fornecer um ambiente de desenvolvimento flexível e acessível na nuvem. Ele permite que os desenvolvedores codifiquem diretamente de seus navegadores da web, sem precisar instalar nada em suas máquinas locais. Este IDE baseado em nuvem se integra perfeitamente com o GitHub e outros serviços em nuvem, permitindo colaboração em tempo real, fácil acesso a projetos de qualquer dispositivo e a capacidade de trabalhar em ambientes distribuídos. Com recursos como realce de sintaxe, depuração e extensões, o Visual Studio Code Cloud IDE oferece uma experiência de desenvolvimento completa, tornando-se uma solução conveniente para desenvolvedores que precisam de um ambiente de codificação poderoso e portátil que pode ser acessado de praticamente qualquer lugar.

Este guia mostrará como instalar o Visual Code-Server no servidor Ubuntu 24.04 com o Nginx como um proxy reverso.

Pré-requisitos

Antes de começar, certifique-se de ter o seguinte:

• Um servidor Ubuntu 24.05.
• Um usuário não-root com privilégios de administrador.
• Um nome de domínio apontado para um endereço IP do servidor.

Instalando o code-server com o script de instalação

Para instalar o code-server, você pode baixar e executar o script de instalação do code-server. Neste exemplo, você estará instalando um code-server como um usuário não-root. Portanto, certifique-se de ter feito login como seu usuário.

Primeiro, execute o comando abaixo para garantir que o code-server pode ser instalado em seu sistema.

curl -fsSL https://code-server.dev/install.sh | sh -s -- --dry-run

Quando o code-server estiver instalado em seu sistema, você verá a seguinte saída:

Agora instale o code-server com o comando abaixo. Digite sua senha de sudo/administrador quando solicitado.

curl -fsSL https://code-server.dev/install.sh | sh

Após a conclusão da instalação, inicie e habilite o code-server com o seguinte comando ‘ systemctl ‘.

sudo systemctl enable --now code-server@$USER

Por último, verifique o serviço do code-server com o seguinte comando para garantir que o serviço está em execução.

sudo systemctl status code-server@$USER

Nesta saída, você pode ver que o code-server está em execução, que opera na porta padrão 8080.

Configurando a senha do code-server

Após instalar o code-server, você configurará a autenticação por senha para proteger o ambiente do code-server.

Abra o arquivo de configuração padrão do code-server ~/.config/code-server/config.yaml com o editor ‘ nano ‘.

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

Altere a senha padrão pela sua senha segura.

bind-addr: 127.0.0.1:8080  
auth: password  
password: 0e0cb3af923c659366334664  
cert: false

Salve o arquivo e saia do editor.

Agora execute o comando abaixo para reiniciar o code-server e aplicar suas alterações.

sudo systemctl restart code-server@$USER

Configurando o Nginx como um proxy reverso

Agora que você protegeu o code-server, você instalará o Nginx e o configurará como um proxy reverso. Portanto, certifique-se de que seu nome de domínio esteja apontado para um endereço IP do servidor.

Instale o servidor web Nginx com o seguinte comando ‘ apt ‘. Digite ‘ Y ‘ para confirmar a instalação.

sudo apt install nginx -y

Após a conclusão da instalação, crie uma nova configuração de bloco de servidor ‘ /etc/nginx/sites-available/code-server.conf ‘ com o editor ‘ nano ‘.

sudo nano /etc/nginx/sites-available/code-server.conf

Insira a seguinte configuração no arquivo e certifique-se de alterar o nome de domínio ‘ code.howtoforge.local ‘.

server {  
listen 80;  
listen [::]:80;  
server_name code.howtoforge.local;  
  
location / {  
proxy_pass http://localhost:8080/;  
proxy_set_header Host $http_host;  
proxy_set_header Upgrade $http_upgrade;  
proxy_set_header Connection upgrade;  
proxy_set_header Accept-Encoding gzip;  
}  
}

Quando terminar, salve o arquivo e saia do editor.

Em seguida, execute o seguinte comando para ativar o bloco de servidor ‘ code-server.conf ‘ e verificar sua configuração do Nginx.

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

Se você estiver correto e tiver uma configuração adequada do Nginx, verá uma saída ‘ syntax is ok - test is successful’.

Agora execute o comando abaixo para reiniciar o servidor web Nginx e aplicar as alterações. Em seguida, verifique o status do Nginx para garantir que o servidor web está em execução.

sudo systemctl restart nginx  
sudo systemctl status nginx

Na saída a seguir, você pode ver que o servidor web Nginx está em execução como um proxy reverso para a aplicação code-server.

Configurando o UFW (Firewall Simples)

Para permitir acesso ao code-server, você deve abrir as portas HTTP e HTTPS através do UFW (Firewall Simples).

Execute o comando abaixo para habilitar o perfil ‘ Nginx Full ‘ e permitir tráfego HTTP e HTTPS para sua instalação do Nginx. Uma vez adicionado, você verá uma saída ‘Regra adicionada’.

sudo ufw allow 'Nginx Full'

Agora execute o seguinte comando para verificar o status do UFW. Certifique-se de que o perfil ‘Nginx Full’ esteja habilitado para permitir acesso de qualquer lugar.

sudo ufw status

Protegendo o code-server com HTTPS

Nesta seção, você protegerá o code-server com HTTPS gerando certificados SSL/TLS através do certbot e letsencrypt.

Instale os pacotes ‘certbot’ e ‘python3-certbot-nginx’ com o seguinte comando ‘apt’.

sudo apt install certbot python3-certbot-nginx

Após a conclusão da instalação, execute o comando ‘certbot’ abaixo para gerar certificados SSL/TLS e proteger sua instalação do code-server. Certifique-se de alterar o nome de domínio e o endereço de e-mail com suas informações.

sudo certbot --nginx --agree-tos --redirect --hsts --staple-ocsp --email [email protected] -d code.howtoforge.local

Quando o processo estiver completo, sua instalação do code-server estará protegida com HTTPS automaticamente. E seus certificados SSL/TLS estarão disponíveis no diretório ‘/etc/letsencrypt/live/code.howtoforge.local’.

Acessando o code-server

Abra seu navegador da web e visite https://code.howtoforge.local. Se sua instalação for bem-sucedida, você será solicitado a autenticação por senha.

Digite sua senha e clique em SUBMETER para confirmar.

Se você tiver a senha correta, verá a seguinte tela do code-server. Selecione seu tema padrão, claro ou escuro.

Agora você verá o seguinte code-server ao vivo em seu navegador da web.

Conclusão

Parabéns! Você completou a instalação do servidor VS code no servidor Ubuntu 24.04. Você instalou e protegeu um servidor de código com autenticação por senha e HTTPS e configurou o Nginx como um proxy reverso para sua instalação do servidor de código.