TOC

Как настроить кодовый сервер Cloud IDE Platform на DigitalOcean Kubernetes

Автор выбралFree and Open Source Fund для получения пожертвования в рамках программыWrite for DOnations.

Вступление

С переходом инструментов для облачных вычислений на разработку и внедрение облачных платформ IDE (Integrated Development Environment) растет. Облачные интегрированные среды разработки позволяют в режиме реального времени совместно работать командам разработчиков в единой среде разработки, которая сводит к минимуму несовместимости и повышает производительность. Облачные IDE, доступные через веб-браузеры, доступны с любого типа современного устройства. Еще одним преимуществом облачной среды IDE является возможность использования мощности кластера, которая может значительно превышать вычислительную мощность одного компьютера разработки.

code-server - этоMicrosoft Visual Studio Code, запущенный на удаленном сервере и доступный прямо из вашего браузера. Visual Studio Code - это современный редактор кода со встроенной поддержкой Git, отладчиком кода, интеллектуальным автозаполнением и настраиваемыми и расширяемыми функциями. Это означает, что вы можете использовать различные устройства под управлением разных операционных систем и всегда иметь под рукой согласованную среду разработки.

В этом руководстве вы настроите облачную IDE-платформу на своем кластере DigitalOcean Kubernetes и представите ее в своем домене с помощью сертификатов Let Encrypt. В итоге у вас будет запущен код Microsoft Visual Studio в кластере Kubernetes, доступный через HTTPS и защищенный паролем.

Предпосылки

  • Кластер DigitalOcean Kubernetes с вашим подключением, настроенным какkubectl по умолчанию. Инструкции по настройкеkubectl показаны под шагомConnect to your Cluster при создании кластера. Чтобы создать кластер Kubernetes в DigitalOcean, см.Kubernetes Quickstart.

  • Менеджер пакетов Helm установлен на вашем локальном компьютере, а Tiller установлен на вашем кластере. Для этого выполните шаги 1 и 2 руководстваHow To Install Software on Kubernetes Clusters with the Helm Package Manager.

  • Nginx Ingress Controller и Cert-Manager установлены в вашем кластере с помощью Helm для предоставления сервера кода с помощью Ingress Resources. Для этого следуйтеHow to Set Up an Nginx Ingress on DigitalOcean Kubernetes Using Helm.

  • Полностью зарегистрированное доменное имя для хоста code-server, указывающее на балансировщик нагрузки, используемый Nginx Ingress. В этом руководстве будет использоватьсяcode-server.your_domain. Вы можете приобрести доменное имя наNamecheap, получить его бесплатно наFreenom или воспользоваться услугами регистратора доменов по вашему выбору. Это доменное имя должно отличаться от того, которое используется в учебном пособии «Как настроить Nginx Ingress на DigitalOcean Kubernetes».

[[step-1 -—- install-and-exing-code-server]] == Шаг 1 - Установка и предоставление кода-сервера

В этом разделе вы установите сервер кода в свой кластер DigitalOcean Kubernetes и выставите его в своем домене с помощью контроллера Nginx Ingress. Вы также установите пароль для входа.

Вы сохраните конфигурацию развертывания на локальном компьютере в файле с именемcode-server.yaml. Создайте его, используя следующую команду: 

nano code-server.yaml

Добавьте следующие строки в файл:

code-server.yaml

apiVersion: v1
kind: Namespace
metadata:
  name: code-server
---
apiVersion: extensions/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: 8443
 selector:
   app: code-server
---
apiVersion: extensions/v1beta1
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
        imagePullPolicy: Always
        name: code-server
        args: ["--allow-http"]
        ports:
        - containerPort: 8443
        env:
        - name: PASSWORD
          value: "your_password"

Эта конфигурация определяет пространство имен, развертывание, службу и вход. Пространство имен называетсяcode-server и отделяет установку сервера кода от остальной части кластера. Развертывание состоит из одной реплики образа Dockercodercom/code-server и переменной среды с именемPASSWORD, которая указывает пароль для доступа.

Службаcode-server внутренне предоставляет модуль (созданный как часть развертывания) на порт80. Входящий трафик, определенный в файле, указывает, что входящий контроллерnginx, и что доменcode-server.your_domain будет обслуживаться службой.

Не забудьте заменитьyour_password желаемым паролем, аcode-server.your_domain желаемым доменом, указанным на балансировщик нагрузки контроллера входящего трафика Nginx.

Затем создайте конфигурацию в Kubernetes, выполнив следующую команду: 

kubectl create -f code-server.yaml

Вы увидите следующий вывод: 

Outputnamespace/code-server created
ingress.extensions/code-server created
service/code-server created
deployment.extensions/code-server created

Вы можете наблюдать, как модуль сервера кода становится доступным, выполнив: 

kubectl get pods -w -n code-server

Вывод будет выглядеть так: 

OutputNAME                          READY   STATUS              RESTARTS   AGE
code-server-f85d9bfc9-j7hq6   0/1     ContainerCreating   0          1m

Как только статус становитсяRunning, код-сервер завершает установку в ваш кластер.

Перейдите к своему домену в вашем браузере. Вы увидите приглашение для входа на сервер кодов.

code-server login prompt

Введите пароль, который вы установили вcode-server.yaml, и нажмитеEnter IDE. Вы войдете в код-сервер и сразу увидите его графический редактор.

code-server GUI

Вы установили сервер кода в свой кластер Kubernetes и сделали его доступным в своем домене. Вы также убедились, что для входа требуется пароль. Теперь вы перейдете к защите с помощью бесплатных сертификатов Let Encrypt с помощью Cert-Manager.

[[step-2 -—- secure-the-code-server-deployment]] == Шаг 2. Обеспечение безопасности развертывания сервера кода

В этом разделе вы обезопасите установку сервера программного кода, применив сертификаты Let Encrypt к вашему входу, который Cert-Manager автоматически создаст. После выполнения этого шага ваша установка сервера кода будет доступна через HTTPS.

Откройтеcode-server.yaml для редактирования: 

nano code-server.yaml

Добавьте выделенные строки в ваш файл, убедившись, что пример домена заменен на ваш собственный:

code-server.yaml

apiVersion: v1
kind: Namespace
metadata:
  name: code-server
---
apiVersion: extensions/v1beta1
kind: Ingress
metadata:
  name: code-server
  namespace: code-server
  annotations:
    kubernetes.io/ingress.class: nginx
    certmanager.k8s.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
...

Во-первых, вы указываете, что выдающим кластером, который этот Ingress будет использовать для предоставления сертификатов, будетletsencrypt-prod, созданный как часть предварительных требований. Затем вы указываете домены, которые будут защищены в разделеtls, а также свое имя дляSecret, в котором они находятся.

Примените изменения к своему кластеру Kubernetes, выполнив следующую команду: 

kubectl apply -f code-server.yaml

Вам нужно будет подождать несколько минут, чтобы Let Encrypt предоставил ваш сертификат. А пока вы можете отслеживать его прогресс, посмотрев на вывод следующей команды: 

kubectl describe certificate codeserver-prod -n code-server

Когда он закончится, конец вывода будет выглядеть примерно так: 

OutputEvents:
  Type    Reason              Age    From          Message
  ----    ------              ----   ----          -------
  Normal  Generated           2m49s  cert-manager  Generated new private key
  Normal  GenerateSelfSigned  2m49s  cert-manager  Generated temporary self signed certificate
  Normal  OrderCreated        2m49s  cert-manager  Created Order resource "codeserver-prod-4279678953"
  Normal  OrderComplete       2m14s  cert-manager  Order "codeserver-prod-4279678953" completed successfully
  Normal  CertIssued          2m14s  cert-manager  Certificate issued successfully

Теперь вы можете обновить свой домен в браузере. Вы увидите замок слева от адресной строки в своем браузере, означающий, что соединение безопасно.

На этом шаге вы настроили Ingress для защиты своего развертывания сервера кода. Теперь вы можете просмотреть интерфейс пользователя сервера кода.

[[step-3 -—- explore-the-code-server-interface]] == Шаг 3 - Изучение интерфейса серверного кода

В этом разделе вы познакомитесь с некоторыми функциями интерфейса код-сервер. Поскольку сервер кода - это Visual Studio Code, работающий в облаке, он имеет тот же интерфейс, что и автономная версия для настольных компьютеров.

С левой стороны среды IDE расположен вертикальный ряд из шести кнопок, открывающих наиболее часто используемые функции на боковой панели, называемой «Панель активности».

code-server GUI - Sidepanel

Эта панель настраивается, поэтому вы можете переместить эти представления в другой порядок или удалить их из панели. По умолчанию первое представление открывает панель проводника, которая обеспечивает древовидную навигацию по структуре проекта. Здесь вы можете управлять своими папками и файлами, создавая, удаляя, перемещая и переименовывая их по мере необходимости. Следующее представление обеспечивает доступ к функциям поиска и замены.

После этого в порядке по умолчанию будет ваше представление о системах управления версиями, напримерGit. Код Visual Studio также поддерживает других поставщиков системы управления версиями, и вы можете найти дальнейшие инструкции для рабочих процессов системы управления версиями с редактором в этомdocumentation.

Git dropdown menu with version control actions

Опция отладчика на панели активности предоставляет все общие действия для отладки на панели. Visual Studio Code поставляется со встроенной поддержкой отладчика времени выполненияNode.js и любого языка, который транслируется вJavascript. Для других языков вы можете установитьextensions для необходимого отладчика. Вы можете сохранить настройки отладки в файлеlaunch.json.

Debugger View with launch.json open

Последний вид на панели активности предоставляет меню для доступа к доступным расширениям наMarketplace.

code-server GUI - Tabs

Центральной частью GUI является ваш редактор, который вы можете разделить вкладками для редактирования кода. Вы можете изменить вид редактирования на сеточную систему или на параллельные файлы.

Editor Grid View

После создания нового файла с помощью менюFile пустой файл откроется в новой вкладке, и после сохранения имя файла будет отображаться на боковой панели проводника. Создать папки можно, щелкнув правой кнопкой мыши на боковой панели проводника и нажавNew Folder. Вы можете развернуть папку, щелкнув ее имя, а также перетащив файлы и папки в верхние части иерархии, чтобы переместить их в новое место.

code-server GUI - New Folder

Вы можете получить доступ к терминалу, нажавCTRL+SHIFT+\ или нажавTerminal в верхнем меню и выбравNew Terminal. Терминал откроется на нижней панели, и его рабочий каталог будет настроен на рабочую область проекта, которая содержит файлы и папки, показанные на боковой панели Проводника.

Вы изучили общий обзор интерфейса код-сервер и рассмотрели некоторые из наиболее часто используемых функций.

Заключение

Теперь у вас есть кодовый сервер, универсальная облачная IDE, установленная в вашем кластере DigitalOcean Kubernetes. Вы можете работать с исходным кодом и документами вместе с ним или сотрудничать с вашей командой. Запуск облачной среды IDE в вашем кластере обеспечивает больше возможностей для тестирования, загрузки и более тщательных или тщательных вычислений. Для получения дополнительной информации см.Visual Studio Code documentation о дополнительных функциях и подробные инструкции по другим компонентам code-server.

Related