Übung: Erkunden der Visual Studio Code-Benutzeroberfläche

Abgeschlossen

Visual Studio Code bietet Tools für Entwickler, die gerade anfangen, ist aber auch erweiterbar und leistungsfähig genug für professionelle Entwickler.

In dieser Übung öffnen Sie Visual Studio Code, und führen Sie eine kurze Tour durch die Benutzeroberfläche durch.

Öffnen Sie Visual Studio Code, und überprüfen Sie die Willkommensseite.

  1. Verwenden Sie das Windows-Startmenü, um Visual Studio Code zu öffnen.

    Wenn Sie das Windows-Startmenü öffnen, sollte Visual Studio Code als kürzlich hinzugefügte Anwendung aufgeführt werden. Sie können auch nach unten scrollen, um Visual Studio Code zu finden.

    Eine weitere Option besteht darin, Visual Studio Code im Windows-Suchfeld auf der Startleiste am unteren Bildschirmrand einzugeben.

  2. Beachten Sie, dass Visual Studio Code auf einer Willkommensseite geöffnet wird, die einige Links und andere Informationen enthält.

    Beim ersten Öffnen von Visual Studio Code zeigt die Willkommensseite einige hilfreiche exemplarische Vorgehensweisen an, z. B. den Inhalt " Erste Schritte mit VS Code ". Sie können diese Informationen in Ruhe zu einem anderen Zeitpunkt überprüfen.

  3. Um die Willkommensseite zu schließen, wählen Sie die Schaltfläche "Schließen" aus (in der Benutzeroberfläche als "X " angezeigt).

    Jede im Editor geöffnete Seite enthält eine Schaltfläche "Schließen" (X), die sich rechts neben dem Seitentitel befindet. Die Registerkarte " Willkommen" wird im oberen linken Bereich des Visual Studio Code-Fensters unterhalb des Hauptmenüs angezeigt. Wenn Sie mit dem Mauszeiger auf das X zeigen, wird das Wort "Schließen" angezeigt.

Überprüfen der Aktivitätsleiste und der Randleiste

  1. Beachten Sie, dass die Seitenleiste rechts neben der Aktivitätsleiste eingeklappt ist.

    Möglicherweise erinnern Sie sich daran, dass die Aktivitätsleiste die vertikale Liste der Symbole ganz links im Visual Studio Code-Fenster ist. Der Inhalt der Seitenleiste hängt davon ab, was derzeit in der Aktivitätsleiste ausgewählt ist.

  2. Positionieren Sie den Mauszeiger über der Aktivitätsleiste, und zeigen Sie dann mit dem Mauszeiger auf jedes der Symbole, um Beschriftungen anzuzeigen.

    Wenn Sie mit der Maus auf die Symbole zeigen, wird eine Beschriftung angezeigt. Die Schaltflächen der Aktivitätsleiste sollten in der folgenden Abbildung angezeigt werden:

    Screenshot der Visual Studio Code-Aktivitätsleiste mit beschrifteten Symbolen.

    Von oben nach unten sind die Aktivitätsleistensymbole: Explorer, Suche, Quellcodeverwaltung, Ausführen und Debuggen, Erweiterungen, Konten und Verwalten.

  3. Wählen Sie auf der Aktivitätsleiste"Explorer" aus.

    Die Randleiste sollte kontextbezogene Informationen öffnen und anzeigen.

  4. Beachten Sie, dass die Seitliche Leiste jetzt EXPLORER beschriftet ist.

    Die EXPLORER-Ansicht wird verwendet, um auf Projektordner und Codedateien zuzugreifen/zu erkunden.

    Visual Studio Code merkt sich Ihren Arbeitsverlauf und öffnet die neuesten Projektdateien, wenn sie geöffnet wird. Da Sie Visual Studio Code zum ersten Mal geöffnet haben, wird kein Projektordner geöffnet.

  5. Wählen Sie auf der Aktivitätsleiste die Option Erweiterungen aus.

  6. Beachten Sie, dass die Seitliche Leiste jetzt ERWEITERUNGEN beschriftet ist.

  7. Nehmen Sie sich einen Moment Zeit, um die in der ERWEITERUNGsansicht angezeigten Informationen zu untersuchen.

    Visual Studio Code-Erweiterungen ermöglichen Ihnen das Hinzufügen von Codierungssprachen, Debuggern und anderen Tools zur Umgebung zur Unterstützung Ihres Entwicklungsworkflows. Sie installieren eine C#-Erweiterung später in diesem Modul.

  8. Um die Erweiterungen-Seitenleiste auf der Aktivitätsleiste zu schließen, wählen Sie Erweiterungen aus.

Überprüfen der oberen Menüoptionen

  1. Um die Menüoptionen "Datei" anzuzeigen, wählen Sie "Datei" aus.

  2. Beachten Sie die im Menü "Datei" aufgeführten Optionen "Neu", "Öffnen", "Speichern" und "Schließen".

  3. Nehmen Sie sich eine Minute Zeit, um die Menüoptionen " Bearbeiten " und dann die anderen Menüelemente der obersten Ebene zu untersuchen.

  4. Beachten Sie, dass einige der Menüs Optionen für die Interaktion mit Ihrem Code enthalten.

    Beispiel:

    • Das Menü "Bearbeiten" enthält Optionen zum Suchen, Ersetzen und Umschalten von Codekommentaren sowie zum Standardmäßigen Ausschneiden, Kopieren, Einfügen, Rückgängigmachen und Wiederholen.
    • Das Menü "Auswahl" enthält Optionen zum Auswählen und Bearbeiten von Codezeilen.
    • Das Menü "Ausführen" enthält Optionen zum Ausführen und Debuggen der Anwendung.
  5. Wählen Sie im Menü Terminal die Option New Terminal (Neues Terminal) aus.

  6. Nehmen Sie sich einen Moment Zeit, um den Inhalt des Terminalpanels zu untersuchen.

    Sie können zwischen den Registerkarten (PROBLEME, AUSGABE, DEBUGKONSOLE und TERMINAL) wechseln und mit dem Mauszeiger auf die Schaltflächen (oben rechts) zeigen, um die Schaltflächenbeschriftungen anzuzeigen.

  7. Beachten Sie, dass der Terminalbereich eine Eingabeaufforderung enthält.

    Der Terminalbereich kann zum Ausführen von Befehlszeilenschnittstellenbefehlen (COMMAND Line Interface, CLI) verwendet werden. Sie verwenden .NET CLI-Befehle später in diesem Modul.

  8. Wählen Sie in der oberen rechten Ecke des Terminalbereichs X (Bereich schließen) aus.

  9. Wählen Sie im Menü "Ansicht" die Befehlspalette aus.

    Die Befehlspalette kann verwendet werden, um alle Arten nützlicher Befehle zu suchen und auszuführen. Sie haben nicht die Zeit (oder die Notwendigkeit), sie im Detail zu untersuchen, aber es ist gut zu wissen, wo die Befehlspalette zu finden ist.

  10. Geben Sie an der Eingabeaufforderung der Befehlspalette Erweiterungen ein.

    Beachten Sie, dass die Liste der Befehle basierend auf Ihrem Eintrag gefiltert wird.

  11. Um die gefilterte Liste der Befehle zu aktualisieren, ändern Sie Erweiterungen in Hilfe

  12. Wählen Sie in der Liste der Befehlsoptionen " Hilfe: Interaktiver Editor-Playground" aus.

    Das Editor-Playground-Dokument, das im Editor geöffnet wird, enthält eine Liste interaktiver Aktivitäten.

  13. Wählen Sie in der Aufzählung der interaktiven Aktivitäten die Option "Formatierung" aus.

  14. Nehmen Sie sich eine Minute Zeit, um sich über die Formatierungsoptionen zu informieren.

    Während der Aktivitäten verwenden Sie Codeformatierungsbefehle, während Sie mehr über die C#-Programmierung erfahren.

  15. Schließen Sie das Editor-Playground-Dokument.

Dies schließt Ihre Tour durch die Visual Studio Code-Benutzeroberfläche ab. Sobald Sie mit dem Codieren beginnen, weisen die Schulungsmaterialien weiterhin darauf hin, wie Visual Studio Code Ihre Produktivität steigern kann.