Online: GitHub Codespace

Diese Anleitung basiert auf der Anleitung zum Setup von Visual Code bei CS50. Dort finden Sie ausführlichere Erläuterungen.

>> Zur Video-Anleitung für GitHub Codespaces

1. GitHub-Account erstellen

Falls Sie noch keinen GitHub-Account haben, erstellen Sie einen hier.

2. Für GitHub Education anmelden (optional)

GitHub Education ist für Studierende erhältlich und bietet zusätzliche Ressourcen. Es ist für die Nutzung der CS50-Codespace-Umgebung nicht zwingend erforderlich, aber hilfreich.

  1. Gehen Sie zu GitHub Education.
  2. Klicken Sie auf “Sign up for Student Developer Pack” und melden Sie sich mit Ihrem GitHub-Account an. Man wird auf eine Seite mit dem Titel “Access free GitHub Education benefits” weitergeleitet.
  3. Verifizierung des Studierendenstatus: Wählen Sie unter der Sektion “Application” die Otto-Friedrich-Universität aus und fügen Sie als Nachweis der Universitätszugehörigkeit Ihre persönliche Universitäts-Emailadresse (@stud.uni-bamberg.de) hinzu. Diese muss anschließend im Postfach bestätigt werden.

3. Im CS50-Codespace anmelden

  1. Besuchen Sie den CS50-Codespace.
  2. Codespace im Browser nutzen: Klicken Sie auf “Log In”. Nach dem Login und der Zustimmung zu den Nutzungsbedingungen öffnet sich die Online-Version von VS Code. Sie können nun loslegen.
  3. Alternativ: Codespace im VS Code auf dem Desktop nutzen: Der Codespace kann nicht nur online, sondern auch in der Desktop-Version von VS Code genutzt werden. Diese muss zuvor installiert werden. Nachdem sich der Codespace geöffnet hat, wählen Sie im Menü “☰” > “Open in VS Code Desktop”. VS Code wird geöffnet und Sie werden aufgefordert, die Extension “GitHub Codespaces” zu installieren. Nach einer erneuten Anmeldung öffnet sich der Codespace in VS Code.

4. Erste Schritte in VS Code

  1. Terminal:

    • Im unteren Bereich, im Terminal, können Sie ENTER drücken, um ggf. die bereits vorhandene Ausgabe zu entfernen.
    • Alternativ: Ein neues Terminal kann im Menü über “Terminal” > “New Terminal” oder mit der Tastenkombination Strg+Shift+Ö gestartet werden. Die Tastenkombination Strg+Ö kann verwendet werden, um das gerade geöffnete Terminal zu verkleinern und wieder zu öffnen.
    • geben Sie im Terminal ein: code hello.c

  2. Schreiben Sie den Code:

    • Die Datei wird erstellt und geööfnet. Geben Sie folgenden Code ein.
    #include <cs50.h>
#include <stdio.h>

int main(void)
{
    printf("Hello World!\n");
    return 0;
}

  3. Kompilieren des Programms:

    • Geben Sie im Terminal folgenden Befehl ein, um das Programm zu kompilieren: make hello
    • Dieser Befehl erzeugt eine ausführbare Datei mit dem Namen hello.
    • Tipp: Im Terminal kann der Dateiname durch Drücken der Tab-Taste automatisch vervollständigt werden.

  4. Das Programm ausführen:

    • Um das Programm zu starten, geben Sie folgenden Befehl im Terminal ein: ./hello
    • Nun sollte die Ausgabe “Hello, World!” im Terminal erscheinen.

5. Codespace beenden und starten

GitHub bietet bei Codespaces eine kostenlose Nutzungsdauer von bis zu 60 Stunden pro Monat bzw. mit aktiviertem Student Developer Pack bis zu 90 Stunden (Stand: Oktober 2024). Um diese Zeit effizient zu nutzen, sollte der Codespace nach der Nutzung ordnungsgemäß geschlossen werden:

Bei Nutzung des Codespaces im Browser

  • Verbindung schließen: Um die Nutzungszeit zu stoppen, schließen Sie einfach den Browser-Tab, in dem der Codespace geöffnet ist.
  • Verbindung aufbauen: Um den Codespace erneut zu nutzen, melden Sie sich erneut auf www.cs50.dev an. Wenn mehrere Codespaces geöffnet sind, können diese unter https://cs50.dev/codespaces verwaltet werden.

Bei Nutzung des Codespaces in VS Code

  • Verbindung schließen: Die Verbindung zum Codespace kann im Menü unter “File” > “Close Remote Connection” geschlossen werden.
  • Verbindung aufbauen: Um sich erneut zu verbinden, öffnet man das Remote Explorer-Panel im linken Seitenmenü. Dort können Sie unter “GitHub Codespaces” den gewünschten Codespace auswählen und sich mit einem Klick auf “Connect to Codespace …” erneut verbinden. Die Codespace-Umgebung wird daraufhin wieder geöffnet.

Mit dieser Anleitung sollten Sie die CS50-Codespaceumgebung erfolgreich einrichten können. Bei Fragen oder Problemen sind wir Ihnen im Tutorium gerne behilflich. Viel Spaß!

Online: GitHub Codespace – Video