Come installare Visual Studio Code Cloud IDE su Ubuntu 24.04 Server

Il Visual Studio Code Cloud IDE è una versione online del popolare editor Visual Studio Code (VS Code) di Microsoft, progettato per fornire un ambiente di sviluppo flessibile e accessibile nel cloud. Consente agli sviluppatori di programmare direttamente dai loro browser web senza dover installare nulla sui loro computer locali. Questo IDE basato su cloud si integra perfettamente con GitHub e altri servizi cloud, consentendo la collaborazione in tempo reale, un facile accesso ai progetti da qualsiasi dispositivo e la possibilità di lavorare in ambienti distribuiti. Con funzionalità come evidenziazione della sintassi, debug e estensioni, il Visual Studio Code Cloud IDE offre un’esperienza di sviluppo completa, rendendolo una soluzione conveniente per gli sviluppatori che necessitano di un ambiente di codifica potente e portatile accessibile praticamente da qualsiasi luogo.

Questa guida ti mostrerà come installare Visual Code-Server sul server Ubuntu 24.04 con Nginx come reverse proxy.

Prerequisiti

Prima di iniziare, assicurati di avere i seguenti requisiti:

• Un server Ubuntu 24.05.
• Un utente non root con privilegi di amministratore.
• Un nome di dominio puntato a un indirizzo IP del server.

Installazione di code-server con script di installazione

Per installare il code-server, puoi scaricare e eseguire lo script di installazione del code-server. In questo esempio, installerai un code-server come utente non root. Assicurati quindi di aver effettuato l’accesso al tuo utente.

Per prima cosa, esegui il comando qui sotto per assicurarti che il code-server possa essere installato sul tuo sistema.

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

Quando il code-server è installato sul tuo sistema, vedrai il seguente output:

Ora installa il code-server con il comando qui sotto. Inserisci la tua password sudo/amministratore quando richiesto.

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

Dopo che l’installazione è completata, avvia e abilita il code-server con il seguente comando ‘ systemctl ‘.

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

Infine, controlla il servizio code-server con il seguente comando per assicurarti che il servizio sia in esecuzione.

sudo systemctl status code-server@$USER

In questo output, puoi vedere che il code-server è in esecuzione, che funziona sulla porta predefinita 8080.

Configurazione della password del code-server

Dopo aver installato il code-server, configurerai l’autenticazione con password per proteggere l’ambiente del code-server.

Apri il file di configurazione predefinito del code-server ~/.config/code-server/config.yaml con l’editor ‘ nano ‘.

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

Cambia la password predefinita con la tua password sicura.

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

Salva il file ed esci dall’editor.

Ora esegui il comando qui sotto per riavviare il code-server e applicare le tue modifiche.

sudo systemctl restart code-server@$USER

Configurazione di Nginx come reverse proxy

Ora che hai protetto il code-server, installerai Nginx e lo configurerai come reverse proxy. Assicurati quindi di avere il tuo nome di dominio puntato a un indirizzo IP del server.

Installa il server web Nginx con il seguente comando ‘ apt ‘. Inserisci ‘ Y ‘ per confermare l’installazione.

sudo apt install nginx -y

Dopo che l’installazione è completata, crea una nuova configurazione del blocco server ‘ /etc/nginx/sites-available/code-server.conf ‘ con l’editor ‘ nano ‘.

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

Inserisci la seguente configurazione nel file e assicurati di cambiare il nome di dominio ‘ 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 hai finito, salva il file ed esci dall’editor.

Successivamente, esegui il seguente comando per attivare il blocco server ‘ code-server.conf ‘ e verificare la tua configurazione Nginx.

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

Se sei corretto e hai una configurazione Nginx adeguata, vedrai un output ‘ syntax is ok - test is successful’.

Ora esegui il comando qui sotto per riavviare il server web Nginx e applicare le modifiche. Quindi, controlla lo stato di Nginx per assicurarti che il server web sia in esecuzione.

sudo systemctl restart nginx  
sudo systemctl status nginx

Nel seguente output, puoi vedere che il server web Nginx è in esecuzione come reverse proxy per l’applicazione code-server.

Configurazione di UFW (Firewall Semplice)

Per consentire l’accesso al code-server, devi aprire sia le porte HTTP che HTTPS tramite UFW (Firewall Semplice).

Esegui il comando qui sotto per abilitare il profilo ‘ Nginx Full ‘ e consentire il traffico HTTP e HTTPS alla tua installazione di Nginx. Una volta aggiunto, vedrai un output ‘Regola aggiunta’.

sudo ufw allow 'Nginx Full'

Ora esegui il seguente comando per controllare lo stato di UFW. Assicurati che il profilo ‘Nginx Full’ sia abilitato per consentire l’accesso da qualsiasi luogo.

sudo ufw status

Proteggere il code-server con HTTPS

In questa sezione, proteggerai il code-server con HTTPS generando certificati SSL/TLS tramite certbot e letsencrypt.

Installa i pacchetti ‘certbot’ e ‘python3-certbot-nginx’ con il seguente comando ‘apt’.

sudo apt install certbot python3-certbot-nginx

Dopo che l’installazione è completata, esegui il comando ‘certbot’ qui sotto per generare certificati SSL/TLS e proteggere la tua installazione di code-server. Assicurati di cambiare il nome di dominio e l’indirizzo email con le tue informazioni.

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

Quando il processo è completato, la tua installazione di code-server sarà protetta automaticamente con HTTPS. E i tuoi certificati SSL/TLS saranno disponibili nella directory ‘/etc/letsencrypt/live/code.howtoforge.local’.

Accesso al code-server

Apri il tuo browser web e visita https://code.howtoforge.local. Se la tua installazione ha avuto successo, ti verrà richiesta l’autenticazione con password.

Inserisci la tua password e fai clic su INVIA per confermare.

Se hai la password corretta, vedrai il seguente schermo del code-server. Seleziona il tuo tema predefinito, chiaro o scuro.

Ora vedrai il seguente code-server live nel tuo browser web.

Conclusione

Congratulazioni! Hai completato l’installazione del server VS code sul server Ubuntu 24.04. Hai installato e protetto un server code con autenticazione a password e HTTPS e configurato Nginx come reverse proxy per la tua installazione del server code.