One place for hosting & domains

      So richten Sie die Code-Server-Cloud-IDE-Plattform unter Ubuntu 18.04 ein [Schnellstart]


      Einführung

      Code-Server ist Microsoft Visual Studio Code, der auf einem Remote-Server läuft und auf den Sie direkt von Ihrem Browser aus zugreifen können. Dadurch können Sie verschiedene Geräte verwenden, die verschiedene Betriebssysteme ausführen und immer eine einheitliche Entwicklungsumgebung haben.

      In diesem Tutorial richten Sie die Code-Server-Cloud-IDE-Plattform auf Ihrem Ubuntu 18.04-Rechner ein und zeigen sie auf Ihrer Domäne, geschützt durch Let’s Encrypt. Eine ausführlichere Version dieses Tutorials finden Sie unter So richten Sie die Code-Server-Cloud-IDE-Plattform unter Ubuntu 18.04 ein.

      Voraussetzungen

      • Einen Server mit Ubuntu 18.04 mit mindestens 2 GB RAM, Root-Zugriff und einem Sudo-Konto ohne Rootberechtigung. Sie können dies einrichten, indem Sie sich an die Anweisungen unter Ersteinrichtung des Servers für Ubuntu 18.04 halten.

      • Nginx, das auf Ihrem Server installiert ist. Führen Sie dazu die Schritte 1 bis 4 aus So installieren Sie Nginx auf Ubuntu 18.04 aus.

      • Einen vollständig registrierten Domänennamen für den Host Code-Server, der auf Ihren Server verweist. Dieses Tutorial verwendet durchgehend code-server.your-domain. Sie können einen Domänennamen unter Namecheap günstig erwerben oder einen kostenlosen von Freenom herunterladen oder einfach die Domänenregistrierungsstelle Ihrer Wahl verwenden.

      • Die beiden folgenden DNS-Einträge wurden für Ihren Server eingerichtet. Sie finden in dieser Einführung in DigitalOcean DNS Details dazu, wie Sie sie hinzufügen können.

        • Einen Eintrag mit your-domain, der auf die öffentliche IP-Adresse Ihres Servers verweist.
        • Einen Eintrag mit www.your-domain, der auf die öffentliche IP-Adresse Ihres Servers verweist.

      Schritt 1 – Installation des Code-Servers

      Erstellen Sie das Verzeichnis, um alle Daten für den Code-Server zu speichern:

      Navigieren Sie dorthin:

      Besuchen Sie die Seite Github-Veröffentlichungen des Code-Servers und wählen Sie den neuesten Linux-Build aus. Laden Sie ihn wie folgt herunter:

      • wget https://github.com/cdr/code-server/releases/download/2.1692-vsc1.39.2/code-server2.1692-vsc1.39.2-linux-x86_64.tar.gz

      Entpacken Sie das Archiv:

      • tar -xzvf code-server2.1692-vsc1.39.2-linux-x86_64.tar.gz

      Navigieren Sie zum Verzeichnis mit der ausführbaren Datei des Code-Servers:

      • cd code-server2.1692-vsc1.39.2-linux-x86_64

      Um auf die ausführbare Datei des Code-Servers auf Ihrem System zuzugreifen, kopieren Sie diese wie folgt:

      • sudo cp code-server /usr/local/bin

      Erstellen Sie einen Ordner für den Code-Server, um die Benutzerdaten zu speichern:

      • sudo mkdir /var/lib/code-server

      Erstellen Sie einen systemd-Dienst (code-server.service) im Verzeichnis /lib/systemd/system:

      • sudo nano /lib/systemd/system/code-server.service

      Fügen Sie die folgenden Zeilen hinzu:

      /lib/systemd/system/code-server.service

      [Unit]
      Description=code-server
      After=nginx.service
      
      [Service]
      Type=simple
      Environment=PASSWORD=your_password
      ExecStart=/usr/local/bin/code-server --host 127.0.0.1 --user-data-dir /var/lib/code-server --auth password
      Restart=always
      
      [Install]
      WantedBy=multi-user.target
      
      • --host 127.0.0.1 verbindet ihn mit localhost.
      • --user-data-dir /var/lib/code-server legt sein Verzeichnis für die Benutzerdaten fest.
      • --auth Passwort gibt an, dass es die Besucher mit einem Passwort authentifizieren sollte.

      Denken Sie daran, your_password durch Ihr gewünschtes Passwort zu ersetzen.

      Speichern und schließen Sie die Datei.

      Starten Sie den Code-Server-Dienst:

      • sudo systemctl start code-server

      Überprüfen Sie, ob er richtig gestartet wurde:

      • sudo systemctl status code-server

      Sie sehen eine Ausgabe, die der nachfolgenden ähnelt:

      Output

      ● code-server.service - code-server Loaded: loaded (/lib/systemd/system/code-server.service; disabled; vendor preset: enabled) Active: active (running) since Mon 2019-12-09 20:07:28 UTC; 4s ago Main PID: 5216 (code-server) Tasks: 23 (limit: 2362) CGroup: /system.slice/code-server.service ├─5216 /usr/local/bin/code-server --host 127.0.0.1 --user-data-dir /var/lib/code-server --auth password └─5240 /usr/local/bin/code-server --host 127.0.0.1 --user-data-dir /var/lib/code-server --auth password ...

      Aktivieren Sie den Code-Server-Dienst, um automatisch nach dem Neustart eines Servers zu starten:

      • sudo systemctl enable code-server

      Schritt 2 – Code-Server verfügbar machen

      Jetzt konfigurieren Sie Nginx als Reverseproxy für den Code-Server.

      Erstellen Sie code-server.conf, um die Konfiguration zu speichern, damit der Code-Server in Ihrer Domäne verfügbar gemacht wird:

      • sudo nano /etc/nginx/sites-available/code-server.conf

      Fügen Sie die folgenden Zeilen hinzu, um Ihren Server-Block mit den erforderlichen Anweisungen einzurichten:

      /etc/nginx/sites-available/code-server.conf

      server {
          listen 80;
          listen [::]:80;
      
          server_name code-server.your_domain;
      
          location / {
              proxy_pass http://localhost:8080/;
              proxy_set_header Upgrade $http_upgrade;
              proxy_set_header Connection upgrade;
              proxy_set_header Accept-Encoding gzip;
          }
      }
      

      Ersetzen Sie code-server.your_domain durch Ihre gewünschte Domäne. Speichern und schließen Sie dann die Datei.

      Um diese Site-Konfiguration aktiv zu machen, erstellen Sie einen Symlink davon:

      • sudo ln -s /etc/nginx/sites-available/code-server.conf /etc/nginx/sites-enabled/code-server.conf

      Testen Sie die Gültigkeit der Konfiguration:

      Sie sehen die folgende Ausgabe:

      Output

      nginx: the configuration file /etc/nginx/nginx.conf syntax is ok nginx: configuration file /etc/nginx/nginx.conf test is successful

      Starten Sie Nginx neu, damit die Konfiguration wirksam wird.

      • sudo systemctl restart nginx

      Schritt 3 – Sicherung Ihrer Domäne

      Jetzt sichern Sie Ihre Domäne mit einem Let’s Encrypt TLS-Zertifikat.

      Fügen Sie das Certbot-Paket zu Ihrem Server hinzu:

      • sudo add-apt-repository ppa:certbot/certbot

      Installieren Sie Certbot und sein Nginx Plugin:

      • sudo apt install python-certbot-nginx

      Konfigurieren Sie ufw, um den verschlüsselten Verkehr zu akzeptieren:

      Die Ausgabe sieht wie folgt aus:

      Output

      Rule added Rule added (v6)

      Laden Sie den Befehl neu, damit die Konfiguration wirksam wird:

      Die Ausgabe zeigt Folgendes:

      Output

      Firewall reloaded

      Navigieren Sie zu Ihrer Code-Server-Domäne.

      Eingabeaufforderung des Code-Server-Login

      Geben Sie Ihr Code-Server-Passwort ein. Daraufhin ist die Schnittstelle auf Ihrer Domäne verfügbar.

      Code-Server GUI

      Installieren Sie zur Sicherung ein Encrypt TLS-Zertifikat mit Certbot.

      Fordern Sie ein Zertifikat für Ihre Domäne wie folgt an:

      • sudo certbot --nginx -d code-server.your_domain

      Geben Sie eine E-Mail-Adresse für dringende Informationen an, akzeptieren Sie die Geschäftsbedingungen von EFF und entscheiden Sie, ob Sie den gesamten HTTP-Verkehr auf HTTPS umleiten möchten.

      Die Ausgabe sieht ungefähr wie folgt aus:

      Output

      IMPORTANT NOTES: - Congratulations! Your certificate and chain have been saved at: /etc/letsencrypt/live/code-server.your_domain/fullchain.pem Your key file has been saved at: /etc/letsencrypt/live/code-server.your_domain/privkey.pem Your cert will expire on ... To obtain a new or tweaked version of this certificate in the future, simply run certbot again with the "certonly" option. To non-interactively renew *all* of your certificates, run "certbot renew" ...

      Certbot hat TLS-Zertifikate erfolgreich erstellt und auf die Nginx-Konfiguration für Ihre Domäne angewendet.

      Zusammenfassung

      Jetzt haben Sie den Code-Server, eine vielseitige Cloud-IDE, auf Ihrem Ubuntu 18.04-Server installiert, auf Ihrer Domäne verfügbar gemacht und mit Let’s Encrypt gesichert. Weitere Informationen finden Sie in der Visual Studio Code Dokumentation, wo Sie zusätzliche Funktionen und detaillierte Anweisungen zu anderen Komponenten des Code-Servers nachlesen können.



      Source link

      So richten Sie die Code-Server-Cloud-IDE-Plattform unter Ubuntu 18.04 ein


      Der Autor wählte den Free and Open Source Fund, um eine Spende im Rahmen des Programms Write for DOnations zu erhalten.

      Einführung

      Die Erstellung und Einführung von Cloud-IDE-Plattformen (IDE: Integrated Development Environment) nimmt zu, da Entwickler-Tools zunehmend cloudbasiert sind. Cloud-IDEs ermöglichen Entwicklerteams eine Zusammenarbeit in Echtzeit in einer einheitlichen Entwicklungsumgebung, die Inkompatibilitäten minimiert und die Produktivität steigert. Cloud-IDEs sind über Webbrowser zugänglich und auf allen modernen Geräten verfügbar.

      Code-Server ist Microsoft Visual Studio Code, der auf einem Remote Server läuft und auf den Sie direkt von Ihrem Browser aus zugreifen können. Visual Studio Code ist ein moderner Code-Editor mit integrierter Git-Unterstützung, einem Code-Debugger, intelligenter automatischer Vervollständigung sowie anpassbaren und erweiterbaren Funktionen. Dadurch können Sie verschiedene Geräte verwenden, die verschiedene Betriebssysteme ausführen und immer eine einheitliche Entwicklungsumgebung haben.

      In diesem Tutorial richten Sie die Code-Server-Cloud-IDE-Plattform auf Ihrem Ubuntu-18.04-Rechner ein und machen sie auf Ihrer Domäne verfügbar, geschützt durch kostenlose Let’s Encrypt TLS-Zertifikate. Zum Schluss wird Microsoft Visual Studio Code auf Ihrem Ubuntu-18.04-Server ausgeführt, ist auf Ihrer Domäne verfügbar und mit einem Passwort geschützt.

      Voraussetzungen

      • Einen Server mit Ubuntu 18.04 mit mindestens 2 GB RAM, Root-Zugriff und einem Sudo-Konto ohne Rootberechtigung. Sie können dies einrichten, indem Sie diesem Leitfaden zur Ersteinrichtung des Servers folgen.

      • Nginx, das auf Ihrem Server installiert ist. Führen Sie dazu die Schritte 1 bis 4 aus So installieren Sie Nginx auf Ubuntu 18.04 aus.

      • Die beiden folgenden DNS-Einträge wurden für Ihren Server eingerichtet. Sie finden in dieser Einführung in DigitalOcean DNS Details dazu, wie Sie sie hinzufügen können.

        • Einen Eintrag mit your-domain, der auf die öffentliche IP-Adresse Ihres Servers verweist.
        • Einen Eintrag mit www.your-domain, der auf die öffentliche IP-Adresse Ihres Servers verweist.
      • Einen vollständig registrierten Domänennamen für den Host Code-Server, der auf Ihren Server verweist. Dieses Tutorial verwendet durchgehend code-server.your-domain. Sie können einen Domänennamen unter Namecheap günstig erwerben oder einen kostenlosen von Freenom herunterladen oder einfach die Domänenregistrierungsstelle Ihrer Wahl verwenden.

      Schritt 1 – Installation des Code-Servers

      In diesem Abschnitt richten Sie Code-Server auf Ihrem Server ein. Dabei laden Sie die neueste Version herunter und erstellen einen systemd-Dienst, der Code-Server immer im Hintergrund ausführt. Des Weiteren geben Sie eine Neustart-Regel für den Dienst an, damit Code-Server nach möglichen Abstürzen oder Neustarts verfügbar bleibt.

      Sie speichern alle Daten über Code-Server in einem Ordner namens ~/code-server. Erstellen Sie ihn, indem Sie folgenden Befehl ausführen:

      Navigieren Sie dorthin:

      Gehen Sie auf die Seite Github releases von Code-Server und wählen Sie den neuesten Linux-Build (die Datei enthält linux in ihrem Namen). Als dieser Text verfasst wurde, war die neueste Version 2.1692. Laden Sie ihn mit wget herunter, indem Sie folgenden Befehl ausführen:

      • wget https://github.com/cdr/code-server/releases/download/2.1692-vsc1.39.2/code-server2.1692-vsc1.39.2-linux-x86_64.tar.gz

      Entpacken Sie dann das Archiv durch Ausführung von:

      • tar -xzvf code-server2.1692-vsc1.39.2-linux-x86_64.tar.gz

      Sie erhalten einen Ordner mit dem gleichen Namen wie die von Ihnen heruntergeladene Originaldatei, die die ausführbare Datei des Code-Servers enthält. Navigieren Sie dorthin:

      • cd code-server2.1692-vsc1.39.2-linux-x86_64

      Kopieren Sie die ausführbare Datei des Code-Servers in /usr/local/bin, damit Sie systemweit mit dem folgenden Befehl darauf zugreifen können:

      • sudo cp code-server /usr/local/bin

      Erstellen Sie als Nächstes einen Ordner für Code-Server, in dem er Benutzerdaten speichert:

      • sudo mkdir /var/lib/code-server

      Nachdem Sie Code-Server heruntergeladen und systemweit verfügbar gemacht haben, erstellen Sie einen systemd-Dienst für die ständige Ausführung des Code-Servers im Hintergrund.

      Speichern Sie die Dienstkonfiguration in einer Datei namens code-server.service im Verzeichnis /lib/systemd/system, in dem systemd seine Dienste speichert. Erstellen Sie sie mit Ihrem Texteditor:

      • sudo nano /lib/systemd/system/code-server.service

      Fügen Sie die folgenden Zeilen hinzu:

      /lib/systemd/system/code-server.service

      [Unit]
      Description=code-server
      After=nginx.service
      
      [Service]
      Type=simple
      Environment=PASSWORD=your_password
      ExecStart=/usr/local/bin/code-server --host 127.0.0.1 --user-data-dir /var/lib/code-server --auth password
      Restart=always
      
      [Install]
      WantedBy=multi-user.target
      

      Hier geben Sie zunächst die Beschreibung des Dienstes an. Dann bestätigen Sie, dass der Dienst nginx vor diesem gestartet werden muss. Nach dem Abschnitt [Unit] definieren Sie die Art des Dienstes (simple bedeutet, dass der Prozess einfach ausgeführt werden soll) und geben den Befehl an, der ausgeführt wird.

      Außerdem geben Sie an, dass die globale ausführbare Datei des Code-Servers mit einigen Argumenten gestartet werden soll, die für Code-Server spezifisch sind. --host 127.0.0.1 bindet ihn an localhost, damit er nur von ihrem Server aus direkt zugänglich ist. --user-data-dir /var/lib/code-server legt Ihr Benutzerdaten-Verzeichnis fest und --auth password spezifiziert, dass es Besucher mit einem Passwort authentifizieren soll, das in der Umgebungsvariable PASSWORD in der Zeile darüber angegeben ist.

      Vergessen Sie nicht, your_password durch Ihr gewünschtes Passwort zu ersetzen. Speichern und schließen Sie danach die Datei.

      Die nächste Zeile teilt systemd mit, dass Code-Server bei allen Störungen (z. B. bei Absturz oder wenn der Vorgang beendet wird) neu starten soll. Der Abschnitt [Install] weist systemd an, diesen Dienst zu starten, wenn Sie sich auf Ihrem Server anmelden können.

      Starten Sie den Code-Server-Dienst durch Ausführung des folgenden Befehls:

      • sudo systemctl start code-server

      Überprüfen Sie, ob er korrekt gestartet wurde, indem Sie seinen Status beachten:

      • sudo systemctl status code-server

      Sie sehen eine Ausgabe, die der nachfolgenden ähnelt:

      Output

      ● code-server.service - code-server Loaded: loaded (/lib/systemd/system/code-server.service; disabled; vendor preset: enabled) Active: active (running) since Mon 2019-12-09 20:07:28 UTC; 4s ago Main PID: 5216 (code-server) Tasks: 23 (limit: 2362) CGroup: /system.slice/code-server.service ├─5216 /usr/local/bin/code-server --host 127.0.0.1 --user-data-dir /var/lib/code-server --auth password └─5240 /usr/local/bin/code-server --host 127.0.0.1 --user-data-dir /var/lib/code-server --auth password Dec 09 20:07:28 code-server-ubuntu-1804 systemd[1]: Started code-server. Dec 09 20:07:29 code-server-ubuntu-1804 code-server[5216]: info Server listening on http://127.0.0.1:8080 Dec 09 20:07:29 code-server-ubuntu-1804 code-server[5216]: info - Using custom password for authentication Dec 09 20:07:29 code-server-ubuntu-1804 code-server[5216]: info - Not serving HTTPS

      Damit Code-Server nach einem Server-Neustart automatisch startet, aktivieren Sie seinen Dienst durch Ausführung des folgenden Befehls:

      • sudo systemctl enable code-server

      In diesem Schritt haben Sie Code-Server heruntergeladen und global verfügbar gemacht. Dann haben Sie einen systemd-Dienst für ihn erstellt und aktiviert, damit Code-Server bei jedem Server-Boot startet. Als Nächstes machen Sie diesen auf Ihrer Domäne verfügbar, indem Sie Nginx konfigurieren, um als Reverseproxy zwischen Besucher und Code-Server zu dienen.

      Schritt 2 – Code-Server auf Ihrer Domäne verfügbar machen

      In diesem Abschnitt konfigurieren Sie Nginx als Reverseproxy für den Code-Server.

      Wie Sie im Schritt Nginx-Voraussetzung erfahren haben, werden seine Site-Konfigurationsdateien unter /etc/nginx/sites-available gespeichert und müssen später symbolisch mit /etc/nginx/sites-enabled verknüpft werden, um aktiv zu sein.

      Speichern Sie die Konfiguration, um Code-Server auf Ihrer Domäne verfügbar zu machen, in einer Datei namens code-server.conf unter /etc/nginx/sites-available. Beginnen Sie mit dem Erstellen mithilfe Ihres Editors:

      • sudo nano /etc/nginx/sites-available/code-server.conf

      Fügen Sie die folgenden Zeilen hinzu:

      /etc/nginx/sites-available/code-server.conf

      server {
          listen 80;
          listen [::]:80;
      
          server_name code-server.your-domain;
      
          location / {
              proxy_pass http://localhost:8080/;
              proxy_set_header Upgrade $http_upgrade;
              proxy_set_header Connection upgrade;
              proxy_set_header Accept-Encoding gzip;
          }
      }
      

      Ersetzen Sie code-server.your-domain​​​ durch Ihre gewünschte Domäne. Speichern und schließen Sie dann die Datei.

      In dieser Datei definieren Sie, dass Nginx auf den HTTP-Port 80 lauschen soll. Dann geben Sie einen server_name an, der Nginx mitteilt, für welche Domäne Anfragen akzeptiert und diese spezielle Konfiguration angewendet werden sollen. Für den Root-Ort (/) geben Sie im nächsten Block an, dass Anfragen an den Code-Server auf localhost:8080 ausgeführt werden sollen. Die nächsten drei Zeilen (ab proxy_set_header) weisen Nginx an, einige HTTP-Anforderungsheader zu übertragen, die für das korrekte Funktionieren von WebSockets benötigt werden, die Code-Server extensiv verwendet.

      Damit die Konfiguration dieser Site aktiv wird, müssen Sie eine symbolische Verknüpfung davon im Ordner /etc/nginx/sites-enabled​​​ erstellen, indem Sie Folgendes ausführen:

      • sudo ln -s /etc/nginx/sites-available/code-server.conf /etc/nginx/sites-enabled/code-server.conf

      Um die Gültigkeit der Konfiguration zu testen, führen Sie folgenden Befehl aus:

      Sie sehen die folgende Ausgabe:

      Output

      nginx: the configuration file /etc/nginx/nginx.conf syntax is ok nginx: configuration file /etc/nginx/nginx.conf test is successful

      Damit die Konfiguration wirksam werden kann, müssen Sie Nginx neu starten:

      • sudo systemctl restart nginx

      Ihre Code-Server-Installation ist nun auf Ihrer Domäne verfügbar. Im nächsten Schritt sichern Sie sie durch Anwendung eines kostenlosen Let’s Encrypt TLS-Zertifikates.

      Schritt 3 – Sicherung Ihrer Domäne

      In diesem Abschnitt sichern Sie Ihre Domäne mit einem Let’s Encrypt TLS-Zertifikat, das Sie mit Certbot bereitstellen.

      Um die neueste Version von Certbot zu installieren, müssen Sie Ihrem Server das entsprechende Paketrepository durch Ausführung des folgenden Befehls hinzufügen:

      • sudo add-apt-repository ppa:certbot/certbot

      Drücken Sie zum Akzeptieren die EINGABETASTE.

      Installieren Sie danach Certbot und das zugehörige Nginx-Plugin:

      • sudo apt install python-certbot-nginx

      Als Teil der Voraussetzungen haben Sie ufw (Uncomplicated Firewall) aktiviert und so konfiguriert, dass ein unverschlüsselter HTTP-Verkehr erlaubt ist. Damit Sie auf die gesicherte Site zugreifen können, müssen Sie sie so konfigurieren, dass sie verschlüsselten Verkehr akzeptiert. Dazu führen Sie folgenden Befehl aus:

      Die Ausgabe sieht wie folgt aus:

      Output

      Rule added Rule added (v6)

      Ähnlich wie bei Nginx müssen Sie den Befehl neu laden, damit die Konfiguration wirksam werden kann:

      Die Ausgabe zeigt Folgendes:

      Output

      Firewall reloaded

      Navigieren Sie anschließend in Ihrem Browser zu der Domäne, die Sie für Code-Server verwendet haben. Sie erhalten die Anmeldeaufforderung des Code-Servers.

      Eingabeaufforderung des Code-Server-Login

      Code-Server fragt Sie nach Ihrem Passwort. Geben Sie dasjenige ein, das Sie im vorigen Schritt festgelegt haben, und drücken Sie Enter IDE. Jetzt rufen Sie Code-Server auf und sehen sofort seine Editor-GUI.

      Code-Server GUI

      Nachdem Sie nun überprüft haben, ob Code-Server korrekt auf Ihrer Domäne verfügbar ist, installieren Sie Let’s Encrypt TLS-Zertifikate, um es mit Certbot zu sichern.

      Um Zertifikate für Ihre Domäne anzufordern, führen Sie folgenden Befehl aus:

      • sudo certbot --nginx -d code-server.your-domain

      In diesem Befehl führen Sie certbot aus, um Zertifikate für Ihre Domäne anzufordern – Sie übergeben den Domänennamen mit dem Parameter -d. Das Flag --nginx weist sie an, eine eine automatische Änderung der Nginx-Site-Konfiguration zur Unterstützung von HTTPS vorzunehmen. Vergessen Sie nicht, code-server.your-domain durch Ihren Domänennamen zu ersetzen.

      Wenn Sie Certbot zum ersten Mal ausführen, werden Sie aufgefordert, eine E-Mail-Adresse für dringende Bekanntmachungen anzugeben und die AGBs von EFF zu akzeptieren. Certbot fordert daraufhin Zertifikate für Ihre Domäne von Let’s Encrypt an. Dann werden Sie gefragt, ob Sie den gesamten HTTP-Verkehr an HTTPS weiterleiten möchten:

      Output

      Please choose whether or not to redirect HTTP traffic to HTTPS, removing HTTP access. - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 1: No redirect - Make no further changes to the webserver configuration. 2: Redirect - Make all requests redirect to secure HTTPS access. Choose this for new sites, or if you're confident your site works on HTTPS. You can undo this change by editing your web server's configuration. - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Select the appropriate number [1-2] then [enter] (press 'c' to cancel):

      Es wird empfohlen, die zweite Option auszuwählen, um die Sicherheit zu maximieren. Nachdem Sie Ihre Auswahl eingegeben haben, drücken Sie die EINGABETASTE.

      Die Ausgabe sieht ungefähr wie folgt aus:

      Output

      IMPORTANT NOTES: - Congratulations! Your certificate and chain have been saved at: /etc/letsencrypt/live/code-server.your-domain/fullchain.pem Your key file has been saved at: /etc/letsencrypt/live/code-server.your-domain/privkey.pem Your cert will expire on ... To obtain a new or tweaked version of this certificate in the future, simply run certbot again with the "certonly" option. To non-interactively renew *all* of your certificates, run "certbot renew" - Your account credentials have been saved in your Certbot configuration directory at /etc/letsencrypt. You should make a secure backup of this folder now. This configuration directory will also contain certificates and private keys obtained by Certbot so making regular backups of this folder is ideal. - If you like Certbot, please consider supporting our work by: Donating to ISRG / Let's Encrypt: https://letsencrypt.org/donate Donating to EFF: https://eff.org/donate-le

      Das bedeutet, dass Certbot TLS-Zertifikate erfolgreich generiert und auf die Nginx-Konfiguration für Ihre Domäne angewendet hat. Sie können Ihre Code-Server-Domäne nun in Ihrem Browser neu laden und werden links von der Websiteadresse ein Schloss sehen: Das bedeutet, dass Ihre Verbindung korrekt gesichert ist.

      Nachdem Code-Server nun auf Ihrer Domäne über einen gesicherten Nginx-Reverseproxy zugänglich ist, können Sie die Benutzeroberfläche von Code-Server überprüfen.

      Schritt 4 – Verwendung der Code-Server-Benutzeroberfläche

      In diesem Abschnitt werden Sie einige der Funktionen der Code-Server-Benutzeroberfläche verwenden. Da Code-Server Visual Studio Code ist, der in der Cloud ausgeführt wird, hat er dieselbe Benutzeroberfläche wie die eigenständige Desktop-Edition.

      Auf der linken Seite der IDE befindet sich eine vertikale Reihe von sechs Schaltflächen, welche die am häufigsten verwendeten Funktionen in einem Seitenbereich namens Aktivitätsleiste öffnen.

      Code-Server-GUI – Seitenbereich

      Diese Leiste ist anpassbar: Sie können diese Ansichten in eine andere Reihenfolge bringen oder von der Leiste entfernen. Standardmäßig öffnet die erste Schaltfläche das allgemeine Menü in einem Dropdown, während die zweite Ansicht das Feld Explorer öffnet, das eine baumartige Navigation der Struktur des Projekts bereitstellt. Hier können Sie Ihre Ordner und Dateien verwalten und sie je nach Bedarf erstellen, löschen, verschieben und umbenennen. Die nächste Ansicht bietet Zugriff auf die Funktion Suchen und Ersetzen.

      Im Anschluss daran wird in der standardmäßigen Reihenfolge Ihre Ansicht der Quellcodeverwaltungssysteme wie Git angezeigt. Visual-Studio-Code unterstützt auch andere Quellcodeverwaltungsanbieter. Weitere Anweisungen für Arbeitsabläufe bei Quellcodeverwaltung mit dem Editor finden Sie in dieser Dokumentation.

      Git-Bereich mit Kontextmenü geöffnet

      Die Debugger-Option auf der Aktivitätsleiste bietet alle gängigen Aktionen zum Debuggen in der Kontrollleiste. Visual Studio Code bietet integrierte Unterstützung für den Laufzeit-Debugger Node.js und jede Sprache, die zu Javascript transpiliert. Für weitere Sprachen können Sie Erweiterungen für den erforderlichen Debugger installieren. Debugging-Konfigurationen können Sie in der Datei launch.json speichern.

      Debugger-Ansicht mit launch.json geöffnet

      Die letzte Ansicht in der Aktivitätsleiste bietet ein Menü zum Zugriff auf verfügbare Erweiterungen auf dem Marketplace.

      Code-Server-GUI – Registerkarten

      Der zentrale Teil der GUI ist Ihr Editor, den Sie für Ihre Codebearbeitung durch Registerkarten trennen können. Ihre Bearbeitungsansicht können ein Rastersystem oder nebeneinander angeordnete Dateien sein.

      Editor-Rasteransicht

      Nach der Erstellung einer neuen Datei über das Menü File öffnet sich eine leere Datei in einer neuen Registerkarte. Sobald sie gespeichert ist, wird der Name der Datei im Seitenfeld Explorer sichtbar. Sie können Ordner durch einen Rechtsklick auf die Seitenleiste Explorer und durch Klicken auf New Folder erstellen. Sie können einen Ordner erweitern, indem Sie auf seinen Namen klicken, sowie Dateien und Ordner in obere Teile der Hierarchie ziehen und ablegen, um sie an einen neuen Ort zu verschieben.

      Code-Server-GUI – New Folder

      Sie können Zugriff auf ein Terminal erhalten, indem Sie STRG+UMSCHALT+` eingeben oder im oberen Dropdownmenü auf Terminal klicken und New Terminal auswählen. Das Terminal öffnet sich in einem unteren Feld und sein Arbeitsverzeichnis wird auf den Arbeitsbereich des Projekts festgelegt, der die im Seitenbereich Explorer gezeigten Dateien und Ordner erhält.

      Sie haben nun einen Überblick über die Code-Server-Benutzeroberfläche und einige der am häufigsten verwendeten Funktionen.

      Zusammenfassung

      Jetzt haben Sie den Code-Server, eine vielseitige Cloud-IDE, auf Ihrem Ubuntu 18.04-Server installiert, auf Ihrer Domäne verfügbar gemacht und mit Let’s Encrypt gesichert. Jetzt können Sie einzeln oder als Team an Projekten arbeiten. Die Ausführung einer Cloud-IDE gibt Ressourcen auf Ihrem lokalen Computer frei und ermöglicht es Ihnen, die Ressourcen bei Bedarf zu skalieren. Weitere Informationen finden Sie in der Visual Studio Code Dokumentation, wo Sie zusätzliche Funktionen und detaillierte Anweisungen zu anderen Komponenten des Code-Servers nachlesen können.

      Wenn Sie Code-Server auf Ihrem DigitalOcean Kubernetes-Cluster ausführen möchten, sehen Sie sich unser Tutorial So richten Sie die Code-Server-Cloud-IDE-Plattform auf DigitalOcean Kubernetes ein an.



      Source link

      So richten Sie die Eclipse-Theia-Cloud-IDE-Plattform unter CentOS 7 ein


      Der Autor wählte den Free and Open Source Fund, um eine Spende im Rahmen des Programms Write for DOnations zu erhalten.

      Einführung

      Die Einführung von Cloud-IDE-Plattformen (IDE: Integrated Development Environment) nimmt zu, da Entwickler-Tools zunehmend cloudbasiert sind. Cloud-IDEs sind per Webbrowser über beliebige moderne Geräte zugänglich und bieten zahlreiche Vorteile für echtzeitbasierte Zusammenarbeit. Eine Cloud-IDE bietet Ihnen und Ihrem Team eine einheitliche Entwicklungs- und Testumgebung und minimiert gleichzeitig Plattform-Inkompatibilitäten. Cloud-IDEs sind über Webbrowser zugänglich und auf allen modernen Geräten verfügbar.

      Eclipse Theia ist eine erweiterbare Cloud-IDE, die auf einem Remote-Server läuft und von einem Webbrowser aus zugänglich ist. Aussehen und Verhalten sind ähnlich wie bei Microsoft Visual Studio Code​​​, wodurch es viele Programmiersprachen unterstützt, ein flexibles Layout und ein integriertes Terminal hat. Was Eclipse Theia von anderer Cloud-IDE-Software unterscheidet, ist die Erweiterbarkeit; sie kann mit benutzerdefinierten Erweiterungen modifiziert werden, damit Sie eine Cloud-IDE für Ihre Bedürfnisse erstellen können.

      In diesem Tutorial stellen Sie Eclipse Theia für Ihren CentOS-7-Server mit Docker Compose, einem Tool zur Container-Orchestrierung, bereit. Sie machen es auf Ihrer Domäne mit nginx-proxy verfügbar, einem automatisierten System für Docker, das den Prozess der Konfiguration von Nginx vereinfacht, damit es als Reverseproxy für einen Container fungieren kann. Zusätzlich sichern Sie es mit einem kostenlosen Let’s Encrypt TLS-Zertifikat, das Sie mithilfe des spezialisierten Add-on bereitstellen. Zum Schluss wird Eclipse Theia auf Ihrem CentOS-7-Server ausgeführt, über HTTPS verfügbar sein und der Benutzer wird sich anmelden müssen.

      Voraussetzungen

      Schritt 1 – Einsatz von nginx-proxy mit Let’s Encrypt

      In diesem Abschnitt stellen Sie nginx-proxy und sein Add-on Let’s Encrypt mit Docker Compose bereit. Das aktiviert die automatische Bereitstellung und Erneuerung von TLS-Zertifikaten, damit Eclipse Theia auf Ihrer Domäne über HTTPS zugänglich sein wird.

      Zum Zwecke dieses Tutorials speichern Sie alle Dateien unter ~/eclipse-theia. Erstellen Sie das Verzeichnis, indem Sie den folgenden Befehl ausführen:

      Navigieren Sie dorthin:

      Speichern Sie die Docker-Compose-Konfiguration für nginx-proxy in einer Datei namens nginx-proxy-compose.yaml. Erstellen Sie sie mit Ihrem Texteditor:

      • vi nginx-proxy-compose.yaml

      Fügen Sie die folgenden Zeilen hinzu:

      ~/eclipse-theia/nginx-proxy-compose.yaml

      version: '2'
      
      services:
        nginx-proxy:
          restart: always
          image: jwilder/nginx-proxy
          ports:
            - "80:80"
            - "443:443"
          volumes:
            - "/etc/nginx/htpasswd:/etc/nginx/htpasswd"
            - "/etc/nginx/vhost.d"
            - "/usr/share/nginx/html"
            - "/var/run/docker.sock:/tmp/docker.sock:ro"
            - "/etc/nginx/certs"
      
        letsencrypt-nginx-proxy-companion:
          restart: always
          image: jrcs/letsencrypt-nginx-proxy-companion
          volumes:
            - "/var/run/docker.sock:/var/run/docker.sock:ro"
          volumes_from:
            - "nginx-proxy"
      

      Hier definieren Sie zwei Dienste, die Docker Compose ausführen wird, nginx-proxy und seinen Let’s Encrypt-Begleiter. Für den Proxy geben Sie jwilder/nginx-proxy als Image ein, ordnen Sie HTTP- und HTTPS-Ports zu und definieren Sie Volumes, die während der Laufzeit zugänglich sind.

      Volumes sind Verzeichnisse auf Ihrem Server, auf die der definierte Dienst vollen Zugriff haben wird, was Sie später zum Einrichten der Benutzerauthentifizierung verwenden werden. Dazu verwenden Sie das erste Volume aus der Liste, das das lokale Verzeichnis /etc/nginx/htpasswd dem gleichen im Container zuordnet. In diesem Ordner erwartet nginx-proxy eine Datei mit dem gleichen Namen wie die Zieldomäne, die Anmeldeangaben für die Benutzerauthentifizierung im Format htpasswd enthält (​​​username:hashed_password​​​).

      Für das Add-on benennen Sie das Docker-Image und ermöglichen Zugriff auf das Docker-Socket, indem Sie ein Volume definieren. Dann geben Sie an, dass das Add-on Zugriff auf die Volumes erben soll, die für nginx-proxy definiert sind. Bei beiden Diensten ist restart auf always eingestellt, wodurch Docker angewiesen wird, die Container im Falle eines Absturzes oder System-Neustarts neu zu starten.

      Speichern und schließen Sie die Datei.

      Stellen Sie die Konfiguration bereit, indem Sie Folgendes ausführen:

      • docker-compose -f nginx-proxy-compose.yaml up -d

      Hier übergeben Sie den Dateinamen nginx-proxy-compose.yaml an den Parameter -f des Befehls docker-compose, der die Datei angibt, die ausgeführt wird. Dann übergeben Sie das Verb up, das die Anweisung zur Ausführung der Container gibt. Das Flag -d ermöglicht den getrennten Modus. Das bedeutet, dass Docker Compose die Container im Hintergrund ausführt.

      Die endgültige Ausgabe sieht ungefähr so aus:

      Output

      Creating network "eclipse-theia_default" with the default driver Pulling nginx-proxy (jwilder/nginx-proxy:)... latest: Pulling from jwilder/nginx-proxy 8d691f585fa8: Pull complete 5b07f4e08ad0: Pull complete ... Digest: sha256:dfc0666b9747a6fc851f5fb9b03e65e957b34c95d9635b4b5d1d6b01104bde28 Status: Downloaded newer image for jwilder/nginx-proxy:latest Pulling letsencrypt-nginx-proxy-companion (jrcs/letsencrypt-nginx-proxy-companion:)... latest: Pulling from jrcs/letsencrypt-nginx-proxy-companion 89d9c30c1d48: Pull complete 668840c175f8: Pull complete ... Digest: sha256:a8d369d84079a923fdec8ce2f85827917a15022b0dae9be73e6a0db03be95b5a Status: Downloaded newer image for jrcs/letsencrypt-nginx-proxy-companion:latest Creating eclipse-theia_nginx-proxy_1 ... done Creating eclipse-theia_letsencrypt-nginx-proxy-companion_1 ... done

      Sie haben nginx-proxy und seinen Let’s-Encrypt-Begleiter mit Docker Compose bereitgestellt. Jetzt richten Sie Eclipse Theia auf Ihrer Domäne ein und sichern es.

      Schritt 2 – Einsatz des dockerisierten Eclipse Theia

      In diesem Abschnitt erstellen Sie eine Datei mit allen erlaubten Anmelde-Kombinationen, die ein Benutzer eingeben muss. Dann stellen Sie Eclipse Theia für Ihren Server mit Docker Compose bereit und machen es auf Ihrer gesicherten Domäne mit nginx-proxy verfügbar.

      Wie im vorigen Schritt erklärt, geht nginx-proxy davon aus, dass Anmelde-Kombinationen sich in einer Datei befinden, die nach der verfügbar gemachten Domäne benannt wurde, das Format htpasswd hat und unter dem Verzeichnis /etc/nginx/htpasswd im Container gespeichert ist. Das lokale Verzeichnis, das dem virtuellen zugeordnet ist, muss nicht das gleiche sein, das in der Konfiguration nginx-proxy angegeben wurde.

      Um Anmelde-Kombinationen zu erstellen, müssen Sie zunächst htpasswd installieren, indem Sie folgenden Befehl ausführen:

      • sudo yum install httpd-tools

      Das Paket httpd-tools​​​ enthält das Dienstprogramm htpasswd.

      Erstellen Sie das Verzeichnis /etc/nginx/htpasswd:

      • sudo mkdir -p /etc/nginx/htpasswd

      Erstellen Sie eine Datei, welche die Anmeldungen für Ihre Domäne speichert:

      • sudo touch /etc/nginx/htpasswd/theia.your-domain

      Vergessen Sie nicht, theia.your-domain durch Ihre Eclipse-Theia-Domäne zu ersetzen.

      Führen Sie den folgenden Befehl aus, um eine Kombination aus Benutzernamen und Passwort hinzuzufügen:

      • sudo htpasswd /etc/nginx/htpasswd/theia.your-domain username

      Ersetzen Sie username durch den Benutzernamen, den Sie hinzufügen möchten. Sie werden zweimal nach einem Passwort gefragt. Nachdem Sie es angegeben haben, fügt htpasswd den Benutzernamen und ein Passwort-Paar mit Hash am Ende der Datei hinzu. Sie können diesen Befehl für so viele Anmeldungen wiederholen, wie Sie hinzufügen möchten.

      Jetzt erstellen Sie eine Konfiguration, um Eclipse Theia bereitzustellen. Speichern Sie diese in einer Datei namens eclipse-theia-compose.yaml. Erstellen Sie sie mit Ihrem Texteditor:

      • vi eclipse-theia-compose.yaml

      Fügen Sie die folgenden Zeilen hinzu:

      ~/eclipse-theia/eclipse-theia-compose.yaml

      version: '2.2'
      
      services:
        eclipse-theia:
          restart: always
          image: theiaide/theia:next
          init: true
          environment:
            - VIRTUAL_HOST=theia.your-domain
            - LETSENCRYPT_HOST=theia.your-domain
      

      In dieser Konfiguration definieren Sie einen einzelnen Dienst namens eclipse-theia, bei dem restart auf always eingestellt ist und theiaide/theia:next als das Container-Image. Außerdem stellen Sie init auf true ein, um Docker anzuweisen, init als Haupt-Prozessmanager zu verwenden, wenn Eclipse Theia im Container ausgeführt wird.

      Dann bestimmen Sie zwei Umgebungsvariablen im Umgebungsabschnitt: VIRTUAL_HOST und LETSENCRYPT_HOST. Erstere wird an nginx-proxy übergeben und teilt ihm mit, auf welcher Domäne der Container verfügbar sein soll. Letztere wird von ihrem Let’s-Encrypt-Add-on benutzt und gibt an, für welche Domäne TLS-Zertifikate angefordert werden sollen. Wenn Sie nicht eine Wildcard als Wert für VIRTUAL_HOST angeben, müssen sie gleich sein.

      Vergessen Sie nicht, theia.your-domain durch Ihre gewünschte Domäne zu ersetzen. Speichern und schließen Sie danach die Datei.

      Stellen Sie jetzt Eclipse Theia bereit, indem Sie Folgendes ausführen:

      • docker-compose -f eclipse-theia-compose.yaml up -d

      Der endgültige Ausgabe sieht ungefähr so aus:

      Output

      ... Pulling eclipse-theia (theiaide/theia:next)... next: Pulling from theiaide/theia 63bc94deeb28: Pull complete 100db3e2539d: Pull complete ... Digest: sha256:c36dff04e250f1ac52d13f6d6e15ab3e9b8cad9ad68aba0208312e0788ecb109 Status: Downloaded newer image for theiaide/theia:next Creating eclipse-theia_eclipse-theia_1 ... done

      Navigieren Sie anschließend in Ihrem Browser zu der Domäne, die Sie für Eclipse Theia verwenden. Ihr Browser zeigt Ihnen eine Eingabeaufforderung, mit der Sie zur Anmeldung aufgefordert werden. Nachdem Sie die richtigen Anmeldeangaben bereitgestellt haben, steigen Sie in Eclipse Theia ein und sehen sofort seine Editor-GUI. In Ihrer Adressleiste sehen Sie ein Schloss, das anzeigt, dass die Verbindung sicher ist. Wenn Sie es nicht sofort sehen, warten Sie einige Minuten darauf, dass die TLS-Zertifikate bereitgestellt werden. Laden Sie dann die Seite neu.

      Eclipse Theia GUI

      Nachdem Sie nun sicher auf Ihre Cloud-IDE zugreifen können, beginnen Sie im nächsten Schritt mit der Verwendung des Editors.

      Schritt 3 – Verwendung der Eclipse-Theia-Benutzeroberfläche

      In diesem Abschnitt werden Sie einige Funktionen von Eclipse Theia erkunden.

      Auf der linken Seite der IDE befindet sich eine vertikale Reihe von vier Schaltflächen, welche die am häufigsten verwendeten Funktionen in einem Seitenbereich öffnen.

      Eclipse-Theia-GUI – Seitenbereich

      Diese Leiste ist anpassbar: Sie können diese Ansichten in eine andere Reihenfolge bringen oder von der Leiste entfernen. Standardmäßig öffnet die erste Ansicht das Explorer-Feld, das eine baumartige Navigation der Struktur des Projekts bereitstellt. Hier können Sie Ihre Ordner und Dateien verwalten und sie je nach Bedarf erstellen, löschen, verschieben und umbenennen.

      Nach der Erstellung einer neuen Datei über das Menü File öffnet sich eine leere Datei in einer neuen Registerkarte. Sobald sie gespeichert sind, können Sie den Namen der Datei im Seitenfeld Explorer anzeigen. Durch einen Rechtsklick auf die Explorer-Seitenleiste und Klicken auf New Folder erstellen Sie Ordner. Sie können einen Ordner erweitern, indem Sie auf seinen Namen klicken, sowie Dateien und Ordner in obere Teile der Hierarchie ziehen und ablegen, um sie an einen neuen Ort zu verschieben.

      Eclipse-Theia-GUI – New Folder

      Die beiden nächsten Optionen bieten Zugriff auf die Funktion Suchen und Ersetzen. Die darauffolgende bietet eine Ansicht von Quellcodeverwaltungssystemen, die Sie möglicherweise verwenden, wie z. B. Git.

      Die letzte Ansicht ist die Debugger-Option, die alle gängigen Aktionen zum Debuggen in dem Feld bereitstellt. Debugging-Konfigurationen können Sie in der Datei launch.json speichern.

      Debugger-Ansicht mit launch.json geöffnet

      Der zentrale Teil der GUI ist Ihr Editor, den Sie für Ihre Codebearbeitung durch Registerkarten trennen können. Ihre Bearbeitungsansicht können ein Rastersystem oder nebeneinander angeordnete Dateien sein. Eclipse Theia unterstützt, wie alle modernen IDEs, Syntaxhervorhebung für Ihren Code.

      Editor-Rasteransicht

      Sie können sich Zugriff auf ein Terminal verschaffen, indem Sie Strg+Umschalt+` eingeben oder im oberen Menü auf Terminal klicken und New Terminal auswählen. Das Terminal öffnet sich in einem unteren Feld und sein Arbeitsverzeichnis wird auf den Arbeitsbereich des Projekts festgelegt, der die im Seitenbereich Explorer gezeigten Dateien und Ordner erhält.

      Terminal geöffnet

      Sie haben sich nun einen Überblick über die Eclipse-Theia-Benutzeroberfläche und einige der am häufigsten verwendeten Funktionen verschafft.

      Zusammenfassung

      Eclipse Theia, eine vielseitige Cloud-IDE, ist nun auf Ihrem CentOS-7-Server mit Docker Compose und nginx-proxy installiert. Sie haben es mit einem kostenlosen Let’s Encrypt TLS-Zertifikat gesichert und eine Instanz eingerichtet, um Anmeldedaten des Benutzers anzufordern. Sie können damit an Ihrem Quellcode und Dokumenten einzeln arbeiten oder im Team zusammenarbeiten. Sie können auch versuchen, Ihre eigene Version von Eclipse Theia zu erstellen, wenn Sie zusätzliche Funktionen benötigen. Weitere Informationen dazu finden Sie unter Theia Docs.



      Source link