code-server is a VSCode that runs on top of a server and can be accessed directly through a browser, VSCode is a modern code editor that supports Git, a code debugger, intelligent code hints, and various customizations and extensions. Next, we’ll go over how to run a VSCode on our Kubernetes cluster.

Installation

First of all, of course, you need an installed Kubernetes cluster, and if you want to access our Cloud IDE via a domain name, you also need to prepare a domain name and an Ingress Controller to be installed in the cluster.

We deploy the code-server in a namespace called code-server and use Deployment to manage the code-server container, here we use the image codercom/code-server and we set the password to access the IDE via the environment variable PASSWORD. The password to access the IDE is set via the environment variable PASSWORD, and the corresponding resource list file is shown below (code-server.yaml)

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42

apiVersion: v1
kind: Namespace
metadata:
  name: code-server
---
apiVersion: v1
kind: Service
metadata:
 name: code-server
 namespace: code-server
spec:
 ports:
 - port: 80
   targetPort: 8080
 selector:
   app: code-server
---
apiVersion: apps/v1
kind: Deployment
metadata:
  labels:
    app: code-server
  name: code-server
  namespace: code-server
spec:
  selector:
    matchLabels:
      app: code-server
  template:
    metadata:
      labels:
        app: code-server
    spec:
      containers:
      - image: codercom/code-server
        imagePullPolicy: IfNotPresent
        name: code-server
        ports:
        - containerPort: 8080
        env:
        - name: PASSWORD
          value: "code321"

It is straightforward to create the list of resources above.

1

$ kubectl apply -f code-server.yaml

Once created, we can see how the application is running by viewing the status of the Pod.

1
2
3

$ kubectl get pods -n code-server
NAME                         READY   STATUS    RESTARTS   AGE
code-server-99dc7566-txk5b   1/1     Running   0          5d

When the Pod is in the Running state, it proves that the application has been deployed successfully. Since we are using Traefik version 2.1 here, we create the IngressRoute resource object and the corresponding resource manifest file is shown below: (ingress-route.yaml)

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46

apiVersion: traefik.containo.us/v1alpha1
kind: Middleware
metadata:
  name: redirect-https
  namespace: code-server
spec:
  redirectScheme:
    scheme: https
---
apiVersion: traefik.containo.us/v1alpha1
kind: IngressRoute
metadata:
  name: code-server
  namespace: code-server
spec:
  entryPoints:
  - web
  routes:
  - kind: Rule
    match: Host(`code.qikqiak.com`)
    middlewares:
    - name: redirect-https
    services:
    - kind: Service
      name: code-server
      port: 80
---
apiVersion: traefik.containo.us/v1alpha1
kind: IngressRoute
metadata:
  name: code-server-https
  namespace: code-server
spec:
  entryPoints:
  - websecure
  routes:
  - kind: Rule
    match: Host(`code.qikqiak.com`)
    services:
    - kind: Service
      name: code-server
      port: 80
  tls:
    certResolver: ali
    domains:
    - main: '*.qikqiak.com'

Above we have defined two IngressRoute objects, one is bound to port 80 and one is bound to port 443, in order to allow us to access via https, we have also created a redirect-https middleware to force a jump to the https service, of course if your https service has its own certificate directly through the Secret can be created and added to the tls area, we are using a wildcard certificate automatically generated by the ACME mechanism provided by Traefik2.1. Again, you can create the above resource object directly.

1
2
3
4
5

$ kubectl apply -f ingress-route.yaml
$ kubectl get ingressroute -n code-server
NAME                AGE
code-server         5d
code-server-https   5d

Once created, resolve (or do a local hosts map) our domain name code.qikqiak.com to the node where Traefik2.1 is located.

Testing

When you access code.qikqiak.com in a browser, the first time you will get a dialog asking for a password, which is the value we configured in the environment variable PASSWORD above: code.qikqiak.com.

image

The application can be accessed by entering the configured password, which is what the familiar VSCode interface looks like, except now it is run in a browser:

image

Then the rest is basically the same as when we use VSCode locally, you can install themes, plugins, debug, etc., so you can explore it yourself:

image