How to Install Visual Studio Code Cloud IDE on Ubuntu 24.04 Server

Visual Studio Code (VS Code) is a popular code editor that offers a Cloud IDE experience for remote development, allowing developers to work on their projects from anywhere. By installing VS Code as a Cloud IDE on an Ubuntu 24.04 server, you can access a full-featured coding environment in your browser. This guide will walk you through how to install and set up Visual Studio Code Cloud IDE on Ubuntu 24.04 Server, perfect for VPS server environments.

Step 1: Update Your System

Before installing Visual Studio Code, ensure your server is up to date. Run the following commands to update your package list and install any available updates:

sudo apt update && sudo apt upgrade -y

Step 2: Install Docker

To run VS Code as a Cloud IDE, we will use code-server, an open-source project that allows Visual Studio Code to run in the cloud. First, you need to install Docker, which will help you manage the code-server container. Run the following command to install Docker:

sudo apt install docker.io -y

Once Docker is installed, start and enable Docker:

sudo systemctl start docker
sudo systemctl enable docker

Step 3: Install VS Code Cloud IDE Using code-server

Next, pull the latest code-server Docker image from the official repository:

sudo docker pull codercom/code-server:latest

Now, create a directory for your project files and start the code-server container. Replace /home/username/projects with the directory where you want to store your projects:

sudo docker run -d -p 8080:8080 \
-v /home/username/projects:/home/coder/project \
codercom/code-server:latest
        

This command will run VS Code on port 8080 and mount the specified directory as your workspace.

Step 4: Configure SSL (Optional)

If you're running Visual Studio Code on a public-facing VPS server, it's important to secure it with SSL. You can use Let's Encrypt and Nginx to set up a secure connection. First, install Nginx and Certbot:

sudo apt install nginx certbot python3-certbot-nginx -y

Next, configure Nginx as a reverse proxy for VS Code:

sudo nano /etc/nginx/sites-available/vscode

Add the following configuration:

server {
    listen 80;
    server_name your_domain;

    location / {
        proxy_pass http://localhost:8080;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
    }
}
        

Save and exit the file, then enable the configuration:

sudo ln -s /etc/nginx/sites-available/vscode /etc/nginx/sites-enabled/
sudo systemctl restart nginx
        

Now, obtain a free SSL certificate from Let's Encrypt:

sudo certbot --nginx -d your_domain

Follow the prompts to complete the SSL setup. Your VS Code Cloud IDE will now be accessible securely via HTTPS.

Step 5: Access VS Code Cloud IDE

Once the container is running and Nginx is configured (if applicable), you can access Visual Studio Code in your browser. Navigate to:

http://your_domain_or_server_ip:8080

If you secured the installation with SSL, use HTTPS:

https://your_domain

On the first login, code-server will ask you to set a password. After setting your password, you can log in and start coding!

Step 6: Configure Persistence for Data

If you're running VS Code on a VPS server, it's important to ensure your project files are persistent across container restarts. By mounting a volume as shown in Step 3 (/home/username/projects:/home/coder/project), your data will persist even if the Docker container is restarted or recreated.

Step 7: Enable Automatic Restart

To ensure that code-server starts automatically when the server reboots, you can add the --restart always flag to your Docker run command:

sudo docker run -d -p 8080:8080 \
-v /home/username/projects:/home/coder/project \
--restart always \
codercom/code-server:latest
        

Running VS Code Cloud IDE on a VPS Server

Running Visual Studio Code Cloud IDE on a VPS server offers flexibility and the ability to code from anywhere, while keeping all your project files hosted remotely. It's perfect for developers working on collaborative projects or needing a robust, centralized development environment.

Looking for a Reliable VPS Solution?

If you're looking for a reliable and scalable VPS server to run Visual Studio Code Cloud IDE, consider using WindowsVPS. With WindowsVPS, you get high-performance VPS hosting with full control over your development environment, making it perfect for hosting remote IDEs like VS Code.