- Dev-Container zur Entwicklung in HTML, CSS, Javascript, OpenAPI, Golang und PostGreSQL - Sources zur Bearbeitung von Labor-Aufgaben - Sources aus Vorlesungs-Demos
Go to file
Teena Steger 14452ed835 01: Demos aus Vorlesung 2025-09-26 11:26:04 +02:00
.devcontainer Entwicklungsumgebung für WEB-Vorlesung 2025-09-12 12:57:28 +00:00
web/01 01: Demos aus Vorlesung 2025-09-26 11:26:04 +02:00
.gitignore Entwicklungsumgebung für WEB-Vorlesung 2025-09-12 12:57:28 +00:00
README.md README.md aktualisiert: Git-Installation und lokaler Repository-Ordner 2025-09-25 15:46:58 +02:00

README.md

Entwicklungsumgebung mit VS Code, Docker und Dev Containers

Diese Anleitung beschreibt die Schritte zur Installation von Visual Studio Code, Docker und der Dev-Container-Erweiterung.


1. Visual Studio Code installieren

Download: https://code.visualstudio.com/

Schritte:

  1. Webseite öffnen.
  2. Betriebssystem auswählen.
  3. Installationsdatei herunterladen.
  4. Installation ausführen.
  5. VS Code starten.

2. Docker installieren

Download: https://www.docker.com/products/docker-desktop

Schritte:

  1. Webseite öffnen.
  2. Betriebssystem auswählen.
  3. Docker Desktop herunterladen.
  4. Installation ausführen.
  5. Docker starten.
  6. Überprüfen in Terminal oder Kommandozeile mit:
    docker --version
    

3. Dev-Container-Erweiterung installieren

Schritte:

  1. VS Code öffnen.
  2. Erweiterungsansicht (Extensions) öffnen (Strg+Shift+X).
  3. Nach "Dev Containers" suchen.
  4. Erweiterung von Microsoft installieren.

4. Dev-Container starten

Entwicklungsumgebung in Dev-Container öffnen:

  1. Nur falls Git noch nicht vorhanden: Git herunterladen und installieren über https://git-scm.com/
  2. Repository aus Gitty lokal klonen, z.B. über Terminal, Git-Client oder Gitty-Weboberfläche ("In VS Code clonen")
git clone https://gitty.informatik.hs-mannheim.de/WEB-IB-WS2526/lab-development-ib.git

Beachte: Clonen Sie das Repository in ein Verzeichnis Ihrer Wahl und merken Sie sich dieses für die folgenden Schritte. Späteres Verschieben ist nicht ratsam.

  1. VS Code starten.
  2. Den geklonten Projektordner über „Datei → Ordner öffnen…“ auswählen.
  3. Befehlspalette öffnen (Strg+Shift+P).
  4. Folgenden Befehl eingeben:
Dev Containers: Open Folder in Container...
  1. Die Container-Umgebung wird automatisch erkannt und gestartet.
  2. Das Projekt öffnet sich im Container und ist einsatzbereit.

5. Funktionstest

  1. Wechseln Sie in den Ordner `web/01/demos/``
  2. Öffnen Sie HalloWelt.html im Editor
  3. Testen Sie die Browser-Preview:
    1. Klicken Sie auf das Icon rechts oben:
    Open Preview
    
    → es sollte eine Vorschau der geöffneten HTML-Datei erscheinen.
  4. Testen Sie die Go-Installation:
    1. Öffnen Sie einen Terminal
    2. Geben Sie folgenden Befehl ein:
    go version
    
    → es sollte go version go1.24.5 linux/arm64 erscheinen

Hinweise