Einrichten eines webbasierten Code-Servers unter Linux: Eine Schritt-für-Schritt-Anleitung

Suchen Sie nach einer Möglichkeit, von praktisch überall aus zu programmieren, ohne Ihren Laptop mitschleppen zu müssen? Nutzen Sie Code-Server, eine robuste, selbst gehostete Anwendung, die die volle Leistung von Visual Studio Code direkt in Ihren Webbrowser bringt. Durch die Einrichtung von Code-Server auf Ihrem Home-Lab-Server profitieren Sie von einem nahtlosen Entwicklungserlebnis, das Zugriff und Kontrolle über Ihren Code und Ihre Daten gewährleistet und so die Verwendung von Cloud-IDEs von Drittanbietern überflüssig macht.

Code-Server und die Vorteile des Self-Hostings verstehen

Code-Server betreibt VS Code auf einem Remote-Server und ermöglicht Ihnen den Zugriff über jeden Webbrowser. Die Funktionalität entspricht der Desktop-Version und unterstützt Funktionen wie Autovervollständigung, Debugging, Git-Integration und verschiedene Erweiterungen. Dieses Setup ist besonders vorteilhaft für leistungsschwache Geräte wie Tablets und Chromebooks, da alle Rechenaufgaben auf dem Server ausgeführt werden und so eine konsistente Umgebung gewährleistet ist, auf die von jedem Standort aus zugegriffen werden kann.

Das Selbsthosting dieser Anwendung bietet mehrere wichtige Vorteile: Sie erhalten eine beispiellose Kontrolle über Ihre Entwicklungsumgebung, verbesserten Datenschutz und die Flexibilität, verschiedene Funktionen anzupassen, einschließlich der Verwendung einer persönlichen Domäne, der Aktivierung von HTTPS und der Verwaltung des Benutzerzugriffs bei gleichzeitiger Skalierung der Rechenressourcen nach Bedarf.

Schauen Sie sich zum Einstieg diesen praktischen Spickzettel an!

Code-Server unter Linux installieren

Das Einrichten des Code-Servers ist unkompliziert, wenn Sie Docker für den Installationsprozess verwenden.

Laden Sie zunächst das offizielle Code-Server-Image mit dem folgenden Befehl von Docker Hub herunter:

sudo docker pull codercom/code-server

Dieser Befehl stellt sicher, dass Sie die neueste Version des Codeserver-Images lokal gespeichert haben, bevor Sie mit der Containererstellung fortfahren.

Als nächstes initiieren Sie im Hintergrund einen neuen Code-Server-Container, indem Sie einen Befehl ausführen, der ein eindeutiges Passwort angibt und die dauerhafte Speicherung sicherstellt:

sudo docker run -d --name code-server -p 8443:8080 -v "$HOME/code-server-data:/home/coder/project" -e PASSWORD="my_password" codercom/code-server

Nachdem der Code-Server eingerichtet ist, können Sie ihn über Ihren Webbrowser aufrufen, indem Sie http://localhost:8443 eingeben. Geben Sie das während des Befehls festgelegte Passwort ein docker runund klicken Sie auf „Senden“, um sich beim Code-Server anzumelden.

Erste Schritte mit Code Server

Nach der Anmeldung sehen Sie eine Benutzeroberfläche, die der bekannten Desktop-Version von VS Code sehr ähnlich ist. Hier ist ein kurzer Überblick über die wichtigsten Komponenten:

Datei-Explorer

Mit dem Datei-Explorer navigieren Sie mühelos durch Ihre Projekte. Sie können Ordner durchsuchen, Dateien öffnen, neue erstellen und die Struktur Ihres Projekts mühelos verwalten.

Editor

Der zentrale Bereich ist der Editor, in dem Sie den Großteil Ihrer Arbeit erledigen. Wenn Dateien geöffnet werden, werden sie hier zum Schreiben und Formatieren von Code angezeigt, genau wie in der Desktop-Version von VS Code.

Terminal

Das Terminal befindet sich praktischerweise unten auf dem Code-Server. Sie können es über das Hauptmenü öffnen, indem Sie „Terminal“ und dann „Neues Terminal“ auswählen oder die Tastenkombination Ctrl+ verwenden `. Sie können das Terminal auch schnell mit Ctrl+ Shift+ erreichen C.

Erweiterungen

Erweiterungen machen VS Code so leistungsstark.Über die Registerkarte „Erweiterungen“ (in der Seitenleiste) können Sie VS Code-Erweiterungen suchen, installieren und verwalten. Dazu gehören Linter, Designs und verschiedene Tools zur Sprachunterstützung.

Suchen Sie mithilfe der Suchleiste nach einer beliebigen Erweiterung, um sie schnell zu installieren und zu aktivieren und so die Funktionen Ihrer Entwicklungsumgebung zu erweitern.

Personalisieren Ihrer browserbasierten IDE

Um das Erscheinungsbild Ihrer IDE anzupassen, z. B.durch Ändern des Designs, klicken Sie auf das Zahnradsymbol in der unteren linken Ecke, bewegen Sie den Mauszeiger über „Designs“ und wählen Sie „Farbdesign“ aus dem Dropdown-Menü:

Es wird eine Liste der verfügbaren Designs angezeigt, in der Sie eine Vorschau anzeigen und Ihre gewünschte Auswahl anwenden können.

Darüber hinaus können Sie jedes gewünschte Design ganz einfach über die Registerkarte „Erweiterungen“ installieren und sofort aktivieren.

Darüber hinaus können Sie weitere Einstellungen anpassen, indem Sie auf das Zahnradsymbol klicken und „Einstellungen“ auswählen. Hier können Sie Änderungen am Editorverhalten, an Schriftgrößen, Formaten und vielem mehr vornehmen.

Erstellen und Ausführen Ihres ersten Programms im Code-Server

Um eine neue Datei zu erstellen, verwenden Sie das Explorer- Bedienfeld oder die Tastenkombination Ctrl+ Alt+ N:

Wählen Sie eine Programmiersprache aus, indem Sie auf „Sprache auswählen“Ctrl klicken oder die Tastenkombination + Kund dann verwenden Mund die gewünschte Sprache auswählen, z. B.Python.

Fügen Sie den folgenden Code in den Editor ein, um „Willkommen bei maketecheasier.com“ dreimal auszugeben:

for i in range(3): print("Welcome to maketecheasier.com")

Bevor Sie dieses Programm ausführen, stellen Sie sicher, dass Python auf Ihrem Server installiert ist. Speichern Sie die Datei, indem Sie Ctrl+ drücken S, ihr einen passenden Namen geben und auf OK klicken:

Um das Python-Skript auszuführen, öffnen Sie das Terminal mit Ctrl+ `und führen Sie den folgenden Befehl aus:

python3 mteExample.py

Mit dem erfolgreichen Code-Server auf Ihrem Linux-System profitieren Sie nun von den Vorteilen der browserbasierten Entwicklung. Sie können Ihre Umgebung mit Themes und Erweiterungen personalisieren, Code in verschiedenen Programmiersprachen ausführen und den Zugriff über eine benutzerdefinierte Domäne und HTTPS sichern. Erweitern Sie im nächsten Schritt Ihr Setup, indem Sie Git-Workflows ausprobieren, SSL für die Produktion aktivieren oder zusätzliche webbasierte Tools wie JupyterLab, Docker oder Portainer integrieren, um die Möglichkeiten Ihres Heimlabors zu erweitern.

Quelle & Bilder