Entwicklungscontainer in der Bildung: Ein Leitfaden für Dozenten

27. Juli 2020 von Brigit Murtaugh, @BrigitMurtaugh

Wir haben von vielen Pädagogen gehört, dass die ersten Tage oder Wochen des Semesters für die Konfiguration der richtigen Umgebung für die Studenten verloren gehen können. Selbst dann können die Studenten immer noch mit einer qualitativ minderwertigen Entwicklungserfahrung oder einer unzureichenden Bewertung ihrer Aufgaben enden.

"Die Einrichtung für meine Studenten dauert normalerweise fünf Unterrichtsstunden. Es gibt Python-Versionen, mit denen man umgehen muss. Es gibt viel Komplexität. Leider kostet diese Komplexität viel Zeit und Geld, um sie zu lösen." -[Community College US Professor CS 101]

"Ich würde eine Version von VS Code bevorzugen, die speziell für eine Python-Installation eingerichtet ist..." -[Assistenzprofessor, Liberal Arts College]

Entwicklungscontainer mit Visual Studio Code können ein fantastisches Werkzeug in der Bildung sein, um sicherzustellen, dass Studenten eine konsistente Programmierumgebung haben. Sie kümmern sich um die Einrichtung, damit Studenten und Dozenten schnell von der Konfiguration wegkommen und sich stattdessen auf das konzentrieren können, was wirklich wichtig ist: etwas Großartiges lernen und programmieren!

Entwicklungscontainer

Was sind also Entwicklungscontainer? Container sind Softwarepakete, die Code und alle Abhängigkeiten bündeln, die dieser Code zum Ausführen benötigt, einschließlich Laufzeitumgebung, Tools, Bibliotheken und Einstellungen. Container wurden ursprünglich als Möglichkeit geschaffen, Apps in einer konsistenten Umgebung bereitzustellen und zu verwalten und die Hardware effizienter zu nutzen. Später entwickelten sie sich weiter, um eine konsistente Build-Umgebung und in jüngerer Zeit eine Entwicklungsumgebung bereitzustellen. Daher stammt der Name "Dev Container".

Wenn Sie einen Container erstellen, stammen dessen anfängliche Inhalte von dem, was als "Image" bekannt ist. Ein Image kann als Mini-Festplatte betrachtet werden, auf der Dinge wie das Betriebssystem und andere Tools vorinstalliert sind. Sie beschreiben, was in das Image gelangt, mithilfe einer Dockerfile, und sobald Sie das Image ausführen, wird es zu einem Container.

Dev-Container bieten eine separate Programmierumgebung von Ihrem Computer. Wenn Sie beispielsweise eine bestimmte Version einer Abhängigkeit herunterladen, ist diese Version für den Container eindeutig. Beachten Sie im folgenden Diagramm, wie der Container die App und ihre notwendigen Abhängigkeiten enthält, wodurch der Computer (Host-Betriebssystem und Infrastruktur) frei und sauber von jeglichen Abhängigkeiten bleibt.

Als Dozent können Sie für eine Aufgabe ein spezifisches Image erstellen. Jeder Student erhält exakt dieselbe Version von Abhängigkeiten, wie z. B. dieselbe Version von Python oder einen C++-Compiler, unabhängig von seinem Betriebssystem oder anderen bereits auf seinem Computer installierten Dateien.

Entwicklungscontainer in VS Code

Die Visual Studio Code Dev Containers-Erweiterung ermöglicht die Verwendung eines Containers als Ihre Hauptprogrammierumgebung. Im Unterricht kann ein Dozent einen bestehenden Dev Container verwenden oder seinen eigenen erstellen und ihn mit der Klasse teilen. Jeder Student kann den Container in VS Code öffnen und verfügt automatisch über die Tools und Laufzeitumgebungen, die er zum Entwickeln seiner Anwendungen benötigt. Studenten haben beim Programmieren auch Zugriff auf die vollständige Funktionsvielfalt von VS Code, einschließlich IntelliSense und Debugging.

Die Dev Containers-Erweiterung funktioniert ausschließlich mit Linux-basierten Containern. Auch wenn die Studenten unterschiedliche Betriebssysteme auf ihren Computern haben, ist die Programmierumgebung für alle gleich.

Wir haben bereits Dozenten, die Dev Containers erfolgreich in ihren Kursen einsetzen. Sie können sich Using DevContainers to Standardize Student Development Environments: An Experience Report ansehen, um mehr über die Erfahrungen von drei Forschern zu erfahren, die Dev Containers in einem Kurs an der UC San Diego verwendet haben.

Dieser Beitrag dient als Leitfaden für Dozenten, die Entwicklungscontainer in den Unterricht integrieren möchten, um eine reibungslosere und konsistentere Umgebung für ihre Studenten zu schaffen.

Um Dev-Container in Aktion zu erleben und zu sehen, wie Studenten in nur 5 Minuten loslegen können, schauen Sie sich unser einführendes Studenten-Video an.

Leitfaden für Dozenten

Bei traditionellen Einrichtungsmethoden können Studenten auf eine Vielzahl von Problemen stoßen, während sie ihre Umgebung einrichten. Einige Beispiele sind Unterschiede in ihrem einzigartigen Betriebssystem, wo Projektdateien gespeichert sind, oder kleine Unterschiede in den von ihnen installierten Laufzeitumgebungen oder Tools. Dozenten müssen mit all diesen Feinheiten vertraut sein, um Studenten bei der Lösung dieser Probleme helfen zu können.

Ein häufiges Problem ist die Verwaltung unterschiedlicher Versionen eines Tools. Nehmen wir Python als Beispiel: Es gibt Python 2 und Python 3 sowie verschiedene Nebenversionen. Mehrere Python-Versionen und dann mehrere begleitende Tools wie Linters zu haben, kann verwirrend sein und zu Fehlern führen.

Um enorm viel Zeit und Verwirrung zu sparen, können wir Dev-Container verwenden, um eine standardisierte Python-Entwicklungsumgebung für unseren gesamten Kurs zu erstellen. Studenten erhalten alle dieselbe Python-Version, wodurch die Notwendigkeit entfällt, eine neue Version zu installieren oder alte zu deinstallieren, und jeder, der denselben Container und denselben Quellcode ausführt, erhält exakt dieselben Ergebnisse.

Voraussetzungen

• Installieren Sie Visual Studio Code.
• Installieren Sie Docker Desktop.
  • Docker ist der Industriestandard für die Erstellung und Freigabe von Containern. Wir empfehlen Docker Desktop Stable 2.3.0.3, da es die neueste und leistungsfähigste Version von Docker Desktop ist.
  • Es gibt neu eingeführte Docker Desktop-Unterstützung unter Windows Home. Dies erfordert Windows 10, Version 2004 und die Aktivierung des Windows Subsystem for Linux 2 (WSL 2)-Backends. Aktivieren Sie WSL 2, indem Sie der WSL 2-Installationsanleitung folgen.
  • Für Studenten, die das WSL 2-Backend nicht konfigurieren möchten, kann Docker Desktop für Windows alternativ unter Windows 10 Pro, Enterprise oder Education (Build 16299 oder höher) verwendet werden, und die Windows-Features Hyper-V und Container müssen aktiviert sein.

Lassen Sie uns mit dem Starten von VS Code beginnen, was wir tun können, indem wir code in der Eingabeaufforderung oder im Terminal eingeben (oder einfach durch Auswahl von VS Code auf Ihrem Computer).

Stellen Sie nach dem Starten von VS Code sicher, dass Sie die Dev Containers-Erweiterung installiert haben.

Wenn wir eine der Remote-Erweiterungen installieren, wird der grüne Remote-Indikator unten links in der Statusleiste hinzugefügt.

Sie können darauf klicken, um die Befehlspalette zu öffnen und zu überprüfen, ob die Dev Containers-Befehle aufgeführt sind.

Zugriff auf einen Container für Ihren Kurs

Lassen Sie uns einen Beispiel-Dev-Container durchgehen, um Studenten dabei zu helfen, eine konsistente Programmierumgebung zu erhalten. In unserem Klassenzimmer könnten wir ein einziges GitHub-Repository erstellen, um Übungen zu speichern, die denselben Tech-Stack verwenden. Zum Beispiel können alle Python-Aufgaben denselben Container verwenden und im selben Repo gespeichert werden.

Wir haben ein Beispiel-GitHub-Repository vscode-course-sample mit einem Python-Dev-Container und zwei Python-Einführungsaufgaben. Lassen Sie es uns in VS Code öffnen.

Sie können auf den Remote-Indikator unten links klicken oder die Befehlspalette verwenden, um die Dev Containers-Befehle aufzurufen.

Wählen wir Repository in Container-Volume klonen... aus.

Wir müssen die URL des GitHub-Repos eingeben, in dem unser Container gespeichert ist, was in unserem Fall microsoft/vscode-course-sample ist.

Sie können Ein eindeutiges Volume erstellen. Ein Volume ist der Ort, an dem Dateien in unserem Container gespeichert werden.

Nachdem wir unser Container-Repo ausgewählt haben, wird VS Code neu geladen, um das Image zu erstellen und den Container zu starten.

Sobald der Container erstellt und ausgeführt wird, werden unsere Dateien geladen und wir können in unserer Python-Umgebung mit dem Programmieren beginnen!

Klicken Sie im Explorer auf sort.py, um es zu öffnen, und drücken Sie F5 (oder das grüne Ausführen-Symbol oben rechts), um es auszuführen.

Unser Python-Code wurde erfolgreich ausgeführt, ohne dass wir Python jemals auf unserem lokalen Computer einrichten mussten.

Wir haben auch Zugriff auf alle Vorteile von VS Code, wie z. B. das Setzen von Breakpoints, um unser Programm anzuhalten und uns beim Debugging zu helfen. Setzen wir einen Breakpoint, wenn wir unsere Wortliste sortieren.

Wir können unser Programm mit F5 ausführen. Beachten Sie, dass das Programm anhält, sobald es den Breakpoint erreicht.

Erstellen eines Containers für Ihren Kurs

Nachdem wir ein fantastisches Beispiel für einen Container gesehen haben, richten wir nun selbst unseren ersten Container mit der Dev Containers-Erweiterung ein. Beginnen wir mit einer "Hallo Welt"-Python-Anwendung.

Wir wählen Dev Containers: Dev Container-Konfigurationsdateien hinzufügen…, um mit der Einrichtung der für einen Entwicklungscontainer notwendigen Dateien zu beginnen.

Container-Konfigurationsdateien sind das, was zum Erstellen und Anpassen eines Entwicklungscontainers benötigt wird. Die Liste der Container-Definitionen, die erscheint, wird basierend auf dem Inhalt Ihrer Anwendung gefiltert. In unserem Fall ist dies eine Python-Datei. Wählen wir Python 3.

Die Dev Containers-Erweiterung fügt automatisch einen Ordner namens .devcontainer und zwei Konfigurationsdateien darin hinzu: devcontainer.json und eine Dockerfile. Sehen wir uns beide Dateien genauer an.

devcontainer.json

devcontainer.json beschreibt, wie VS Code unseren Container starten soll und was nach der Verbindung zu tun ist. Diese Datei kann sich unter .devcontainer/devcontainer.json befinden oder direkt als devcontainer.json im Stammverzeichnis eines Projekts gespeichert werden.

Hier ist ein einfaches Beispiel für eine devcontainer.json. Sie lädt ein vorkonfiguriertes Node-Image, richtet automatisch Port-Weiterleitung für Port 3000 ein und installiert die ESLint-Erweiterung, wenn der Container erstellt wird.

Hier ist ein Beispiel dafür, wie eine etwas ausgefeiltere devcontainer.json für unser Python-Projekt aussieht. Sie referenziert eine Dockerfile anstelle eines Images direkt über die Eigenschaft dockerfile. Sie installiert auch automatisch die Python-Erweiterung und richtet nach der Erstellung des Containers eine Reihe von Container-spezifischen Einstellungen ein, wie z. B. Linting.

devcontainer.json ist eine großartige Gelegenheit, eine angepasste Programmierumgebung zu erstellen, die den spezifischen Bedürfnissen Ihrer Studenten entspricht. Sie können einige Variablen festlegen, um für jeden Kurs oder jede Aufgabe eine eindeutige Umgebung zu erstellen.

Variablen, mit denen wir empfehlen, in einer devcontainer.json für die Bildung zu beginnen, sind:

Das Einrichten einiger Variablen in dieser Datei spart Ihrer Klasse auf lange Sicht Zeit. Sie können beispielsweise die Variable extensions verwenden, um sicherzustellen, dass alle Ihre Studenten automatisch dieselbe Gruppe von Erweiterungen installiert bekommen. Das Festlegen von Pfaden kann auch eine Herausforderung darstellen oder zu Problemen auf den Computern der Studenten führen, aber durch die Angabe von Pfadinformationen über die Variable settings sparen Sie Ihrer Klasse Zeit und stellen sicher, dass die Pfadvariablen ihrer Computer dabei nicht beschädigt werden.

In der devcontainer.json-Referenz finden Sie Tabellen mit allen verfügbaren Eigenschaften, die Sie in diese Konfigurationsdatei aufnehmen können.

Dockerfile

Docker kann Images automatisch erstellen, indem es die Anweisungen aus Ihrer Dockerfile liest. Diese Datei enthält mindestens ein Basisimage, das mit FROM angegeben wird, und kann auch Befehlszeilenanweisungen enthalten.

So sieht die Dockerfile in unserer Python-App aus.

Öffnen des Containers

Nachdem unsere Container-Konfigurationsdateien hinzugefügt wurden, erhielten wir eine Benachrichtigung, dass unser Ordner jetzt eine devcontainer.json-Datei enthält. Wählen wir In Container erneut öffnen aus.

Eine neue Instanz von VS Code wird gestartet, in der unser Image erstellt und unsere App in unserem Dev-Container gestartet wird.

Sobald unser Container erstellt ist, haben wir alle dieselben Dateien, aber der Indikator unten links zeigt nun "Dev Container: Python 3", was bedeutet, dass wir uns in unserem Container befinden. Wir können unseren Code problemlos ausführen, unabhängig davon, welche Python-Version (falls überhaupt vorhanden) wir auf unserem lokalen Rechner installiert haben!

Erstellen und Teilen von Aufgaben

Nachdem Sie nun einen Dev-Container haben, können Sie ihn in ein Repository hochladen, damit Ihre Studenten ihn für ihre Aufgaben abrufen können. Sie können Aufgabenanweisungen in einer README sowie allen notwendigen Basis- oder Vorlagencodes für die Aufgabe und einen .devcontainer-Ordner einfügen, damit alle eine konsistente Entwicklungserfahrung haben. Alle diese Dateien können als einzelnes Repo hochgeladen werden.

Stellen Sie sicher, dass Sie Git installiert haben. Sie können ein neues Git-Repository initialisieren aus Ihrem Container-Projekt in VS Code. Alternativ können Sie git init aus dem Verzeichnis Ihres Projekts in der Kommandozeile verwenden.

Der nächste Schritt ist die Verbindung Ihres lokalen Repositorys mit einem neuen Repo von GitHub in Ihrem Browser.

Dann verbinden wir unser lokales Git-Repo (das Container-Projekt auf unserem Computer) mit dem Remote-Repo (dem GitHub-Repo, das wir im Browser erstellt haben).

Möglicherweise werden Sie aufgefordert, sich bei GitHub anzumelden. Sobald Sie sich angemeldet haben, können Ihre Dateien zu Ihrem Remote-Git-Repository hinzugefügt werden.

Wenn ich nun GitHub im Browser aktualisiere, kann ich meine Dateien sehen!

Weitere Informationen zum Hochladen Ihres Repositorys auf GitHub finden Sie in diesem Leitfaden zum Hinzufügen eines vorhandenen Projekts zu GitHub.

Zugriff auf Aufgaben

Um zu sehen, wie Studenten auf den Dev-Container von GitHub zugreifen und einfach mit dem Programmieren beginnen können, schauen Sie sich unser kurzes 5-minütiges Video an.

Feedback & weitere Ressourcen

Um die Einrichtung von VS Code mit Containern zu unterstützen, finden Sie detaillierte Artikel in der Remote Development-Dokumentation von VS Code. Wenn Sie Fragen oder Feedback für unser Team haben, können Sie gerne ein Problem im GitHub-Repository für Remote Development von VS Code eröffnen oder uns @code twittern.

Viel Spaß beim Programmieren!

Brigit Murtaugh, VS Code Program Manager @BrigitMurtaugh