How Can You Set Up the code-server on DigitalOcean Kubernetes?
In today’s world, the usage of Integrated Development Environment or IDE platforms is on the rise. Such cloud IDEs let different developer teams work together in a comfortable environment. This smooth collaboration opens up the vista for minimizing development errors and boosts creativity as well as production. Also, modern IDEs, because of their cloud nature, are accessible from anywhere. So, it is super convenient, and you can develop applications on the go. Plus, they enhance the strength of a cluster and the processing power of most single-board computers.
The code-server utilizes the Microsoft VS code. Thus, you can get your hands on it via your browser. The Microsoft Visual Studio Code comes equipped with many useful features like debugging, in-built Git support, customization, etc. So, no matter which device or OS you use, you can always have a homogenous development condition.
Here, you will explain how to set up the code-server cloud IDE platform on DigitalOcean Kubernetes in detail.
Prerequisites
- You must have a DigitalOcean Kubernetes cluster. Your connection should be set as kubectl default.
- Your local machine should have Helm.
- Your cluster must have the Nginx Ingress Controller, and Cert-Manager installed on it.
- You also must have a valid domain name so that you can host the code-server.
Step 1: Installing and exposing code-server
First, you have to take your DigitalOcean Kubernetes cluster and install the code-server to it. Then, you have to use the Nginx Ingress Controller and expose it to your domain. Remember that you don’t need the example Services and the Ingress you created while installing the Nginx Ingress Controller. So, you have to delete them using the commands below:
kubectl delete -f hello-kubernetes-first.yaml
kubectl delete -f hello-kubernetes-second.yaml
kubectl delete -f hello-kubernetes-ingress.yaml
Next, you have to keep the deployment configuration on the computer you’re working on. You need to create a code-server.yaml file to do that:
nano code-server.yaml
After you’ve created the file, add these lines to it:
code-server.yaml
apiVersion: v1
kind: Namespace
metadata:
name: code-server
—
apiVersion: networking.k8s.io/v1beta1
kind: Ingress
metadata:
name: code-server
namespace: code-server
annotations:
kubernetes.io/ingress.class: nginx
spec:
rules:
– host: code-server.your_domain
http:
paths:
– backend:
serviceName: code-server
servicePort: 80
—
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
replicas: 1
template:
metadata:
labels:
app: code-server
spec:
containers:
– image: codercom/code-server:latest
imagePullPolicy: Always
name: code-server
env:
– name: PASSWORD
value: “your_password”
Next, you have to create the configuration in Kubernetes using this command:
kubectl create -f code-server.yaml
Here’s the output you will get:
Output
namespace/code-server created
ingress.networking.k8s.io/code-server created
service/code-server created
deployment.apps/code-server created
To check if your code-server pod is ready by using the following command:
kubectl get pods -w -n code-server
Here’s how the output will appear:
Output
NAME READY STATUS RESTARTS AGE
code-server-6c4745497c-l2n7w 0/1 ContainerCreating 0 12s
You will see the status turn into Running once your code-server has been installed successfully to your cluster.
Now, open your browser and go to your domain. In the password textbox, enter the password you defined before and click on Enter IDE. Doing so will take you directly to the editor GUI of the code-server.
Step 2: Securing the code-server deployment
Now that you’ve installed the code-server to your Kubernetes cluster and exposed it to your domain, let’s proceed further. Here, you have to secure the code-server with the help of Let’s Encrypt certificates. The Cert-Manager will generate these certificates on its own. Once you’re performing this task, you can access your code-server installation via HTTPS.
First, you have to launch the code-server.yaml file:
nano code-server.yaml
After launching the file, add these bold parts to your code-server.yaml file.
code-server.yaml
apiVersion: v1
kind: Namespace
metadata:
name: code-server
—
apiVersion: networking.k8s.io/v1beta1
kind: Ingress
metadata:
name: code-server
namespace: code-server
annotations:
kubernetes.io/ingress.class: nginx
cert-manager.io/cluster-issuer: letsencrypt-prod
spec:
tls:
– hosts:
– code-server.your_domain
secretName: codeserver-prod
rules:
– host: code-server.your_domain
http:
paths:
– backend:
serviceName: code-server
servicePort: 80
…
Here, you’re specifying that the Ingress will use letsencrypt-prod to create certificates. You are also specifying the domains to be protected under tls along with the secretName.
Now, you got to apply these changes using the below command:
kubectl apply -f code-server.yaml
Wait for some time to allow Let’s Encrypt to create your certificate. You can keep an eye on its progression by watching the output of this command:
kubectl describe certificate codeserver-prod -n code-server
After Let’s Encrypt has generated the certificate, the output will look like this:
Output
Events:
Type Reason Age From Message
—- —— —- —- ——-
Normal GeneratedKey 48s cert-manager Generated a new private key
Normal Requested 48s cert-manager Created new CertificateRequest resource “codeserver-prod-2203510748”
Normal Issued 22s cert-manager Certificate issued successfully
Go back to your browser and refresh your domain. You will find a lock icon at the beginning of the URL in your browser’s URL bar. It signifies that the connection to your domain is now secure.
Step 3: Exploring the code-server interface
Once you have a secure connection, it is time for you to check out the features of the code-server interface. Just to let you know, the code-server utilizes the VS code. So, as a result, its UI looks pretty similar to the freestanding PC version.
Now, in the Integrated Development Environment (IDE), you will find the Activity Bar. The Activity Bar contains six buttons. You are free to customize this bar in various ways. The first view allows you to control your file and folders, be it creating, removing, or even changing their names. The second view offers you a search feature. Another view lets you view the version control systems, for instance, Git.
The bar also has a debugger option that you can use for performing any debugging-related task in the panel. In case you didn’t know, the VS code supports Node.js or languages transpirable to JavaScript by default. Apart from these, you have to get the required extensions for any other language. The last one among these views lets you go through all the extensions obtainable from the marketplace.
At the center of your user interface, you can find the editor that you can use for editing codes. There are two view modes for the editor – the list view and the side-by-side view.
You can create a new file from the File menu. And, once it is created, you can view its name in the Explorer panel. Right-click on the Explorer panel and then click on New Folder to create a folder. You can also relocate these files and folders upon your wish.
Clicking on Terminal and then New Terminal will let you use a terminal. Or, you can use the keyboard shortcut: CTRL+SHIFT+\.
Now, you’ve gone through the code-server UI and familiarize yourself with some of its most fundamental features.
Conclusion
After reading this article, you must have learned to set up the code-server cloud IDE platform on DigitalOcean Kubernetes. Now, it is time for you to put your knowledge to the test. Provided that you’ve followed all the steps mentioned here properly, you shouldn’t have any problem setting up the code-server. Good luck!