How to install VS Code on Docker with Docker Compose

Installing and running Visual Studio Code (VS Code) on Docker with Docker Compose is a straightforward process. This method offers the flexibility to use VS Code from any device that can connect to your Docker server. The guide below will walk you through the necessary steps to achieve this setup.

What is VS Code?

Visual Studio Code (VS Code) is a free and open-source text editor developed by Microsoft. It is highly versatile and supports a wide range of programming languages through extensions. Its features, such as debugging, embedded Git control, syntax highlighting, intelligent code completion, and customizable themes, make it popular among developers.

What is Docker?

Docker is an open-source platform that allows developers to automate the deployment of applications inside lightweight containers. These containers include everything needed to run the software, including libraries, system tools, and code. Docker ensures that your application runs consistently on any environment that supports Docker.

What is Docker Compose?

Docker Compose is a tool that simplifies managing multi-container Docker applications. With a single command, you can define and run multiple containers. It uses a YAML file to configure application services, networks, and volumes, making it easier to manage complex environments.

Prerequisites

Before we begin, ensure you have the following:

1. A Linux Server: This could be a physical server, virtual machine, or cloud server.
2. Docker and Docker Compose Installed: Make sure both Docker and Docker Compose are installed on your Linux server.

If Docker and Docker Compose are not installed, follow the official Docker documentation to set them up.

Step 1: Create a Directory for Docker Containers

It’s good practice to organize your Docker containers in a dedicated directory. Start by creating a directory for your Docker setups:

mkdir ~/dockers

Within this directory, create a specific folder for VS Code:

mkdir ~/dockers/code-server

Step 2: Create the Docker Compose File

Next, navigate to the code-server directory:

cd ~/dockers/code-server

Now, create a Docker Compose file named docker-compose.yml:

vi docker-compose.yml

Inside this file, add the following configuration:

version: "2.1"
services:
  code-server:
    image: lscr.io/linuxserver/code-server:latest
    container_name: code-server
    environment:
      - TZ=Europe/Sofia
      - PASSWORD=password
      - SUDO_PASSWORD=password123
    volumes:
      - ./config:/config
    ports:
      - 8007:8443
    restart: unless-stopped
networks:
  default:
    name: monitoring-net
    external: true

Explanation of the Configuration:

• version: Specifies the version of the Docker Compose file format.
• services: Defines the container configurations.
  • code-server: The service name for the VS Code container.
  • image: The Docker image for the code-server (VS Code running in a container).
  • container_name: The name you want to assign to the container.
  • environment: Sets environment variables inside the container.
    • TZ: Time zone configuration (adjust to your local time zone).
    • PASSWORD: Sets the password for accessing VS Code through the web interface.
    • SUDO_PASSWORD: Allows setting a sudo password for elevated permissions within the container.
  • volumes: Mounts the config directory from the host to the container for persistent storage.
  • ports: Maps port 8443 in the container to port 8007 on the host. This allows you to access VS Code through http://SERVER_IP:8007.
  • restart: Configures the container to always restart unless stopped manually.
• networks: Defines a network that the container will use.

Save and exit the file by pressing :wq.

Step 3: Start the Docker Container

With the Docker Compose file ready, you can start the container using the following command:

docker compose up -d

This command will download the necessary Docker image, build the container, and start it in detached mode (-d flag).

Step 4: Verify the Container is Running

To confirm that the container is running correctly, use the docker ps command:

docker ps

This command will list all running containers, including your VS Code container. You should see an entry for code-server with its associated ports and status.

Step 5: Access VS Code in Your Browser

Once the container is up and running, you can access VS Code through a web browser. Open your browser and navigate to:

http://SERVER_IP:8007

Replace SERVER_IP with the IP address of your Docker server. When prompted, enter the password you set in the Docker Compose file to log in.

Step 6: Customize and Use VS Code

After logging in, you can start using VS Code as if it were installed locally. You can customize the environment by installing extensions, configuring settings, and managing your projects. The environment variables and mounted volumes allow you to persist your settings and workspaces across sessions.

Conclusion

Running VS Code on Docker with Docker Compose offers several benefits, including the ability to develop in a consistent and isolated environment. This setup ensures that you can access your development environment from any device with a web browser. Docker Compose makes managing this environment easy, allowing you to define and control your containers with minimal effort.

By following this guide, you have successfully installed and configured VS Code on Docker using Docker Compose. This method is particularly useful for developers who need a portable and consistent development environment. Now, you can start coding with all the flexibility and power that VS Code offers, directly from your Docker container.

Thank you for reading the article! If you found the information useful, you can donate using the buttons below:

Donate ☕️ with PayPalDonate 💳 with Revolut