Verwenden von GitHub Copilot mit JavaScript

  • 3 Minuten

In vorherigen Lerneinheiten haben wir gezeigt, wie Copilot eingerichtet wird und Ihnen als Entwickler*in beim Einstieg in das Schreiben von Code hilft.

In dieser Lerneinheit sehen wir uns an, wie Copilot Sie bei vorhandenen Projekten und komplizierteren Aufgaben unterstützen kann.

Entwickeln mit GitHub Copilot

Beim Erstellen von Projekten müssen wir immer wieder sicherstellen, dass unser Code auf dem neuesten Stand ist. Darüber hinaus müssen wir möglicherweise auftretende Fehler beheben oder neue Features hinzufügen, um die Funktionalität und Benutzerfreundlichkeit zu verbessern. Lassen Sie uns einige Möglichkeiten erkunden, um Updates mit GitHub Copilot und GitHub Copilot Chat zu erstellen, einer interaktiven Chat-Schnittstelle, um Antworten auf codebezogene Fragen zu stellen und zu erhalten.

Prompt Engineering

GitHub Copilot kann während der Eingabe Code vorschlagen – Sie können aber auch Prompts erstellen, damit nützliche Vorschläge generiert werden. Ein Prompt – also unsere Eingabe – ist eine Sammlung von Anweisungen oder Richtlinien, die beim Generieren von Code helfen. Ein Prompt ist nützlich, um bestimmte Antworten von Copilot zu generieren. Wenn Sie GitHub Copilot Chat verwenden, kann die Eingabeaufforderung ein Kommentar oder eine Eingabe sein, der Copilot steuert, um Code in Ihrem Auftrag zu generieren oder Code zu schreiben, der von Copilot automatisch vervollständigt wird.

Die Qualität der Ausgabe von Copilot hängt davon ab, wie gut der Prompt erstellt wurde. Das Erstellen eines effektiven Prompts ist unerlässlich, um die gewünschten Ergebnisse zu erzielen. Nehmen Sie beispielsweise an, Sie haben folgenden Prompt:

// Create an API endpoint

Da der Prompt mehrdeutig und vage ist, ist das Ergebnis von GitHub Copilot möglicherweise nicht das, was Sie benötigen. Copilot könnte beispielsweise ein Framework verwenden, das Sie nicht kennen, oder einen Endpunkt, der Daten erfordert, die Sie nicht erkennen. Sehen Sie sich dagegen folgenden Prompt an:

// Create an API endpoint using the React framework that accepts a JSON payload in a POST request

Dieser letzte Prompt ist spezifisch und klar und ermöglicht es GitHub Copilot, das Ziel und den Umfang der Aufgabe zu verstehen. Sie können auch Kontext und Beispiele für Copilot mit Kommentaren oder Code bereitstellen, sie können auch die Chatoption GitHub Copilot Chat verwenden. Durch einen guten Prompt können Sie sicherstellen, dass das Modell eine qualitativ hochwertige Ausgabe generiert.

Best Practices für die Verwendung von GitHub Copilot

Copilot erhöht Ihre Produktivität enorm, es sind aber einige Best Practices erforderlich, um eine hohe Qualität sicherzustellen. Hier finden Sie einige dieser Best Practices:

  • Beginnen Sie mit einfachen Prompts, und fügen Sie dann im Lauf der Zeit spezifischere Komponenten hinzu, z. B.:

    create an HTML form with a text field and button

    Erweitern Sie den Prompt dann, um spezifischere Vorschläge zu erhalten:

    Add an event listen to the button to send a POST request to /generate endpoint and display response in a div with id "result"

  • Wechseln Sie zwischen Vorschlägen, indem Sie STRG-TASTE+EINGABETASTE drücken (oder BEFEHLSTASTE+EINGABETASTE auf einem Mac). Sie erhalten verschiedene Vorschläge von Copilot und können die beste Ausgabe auswählen. Optional können Sie bei der Verwendung von GitHub Copilot Chat die Chateingabe verwenden, um Ihre Eingabeaufforderung hinzuzufügen und mit der Ausgabe zu interagieren.

Wenn Sie nicht weiterkommen oder nicht die gewünschten Ergebnisse erhalten, können Sie den Prompt neu formulieren oder Code zur automatischen Vervollständigung durch Copilot schreiben.

Hinweis

GitHub Copilot verwendet geöffnete Dateien in Ihrem Text-Editor als zusätzlichen Kontext. Dies ist hilfreich, da es zusätzlich zum Prompt oder dem von Ihnen geschriebenen Code nützliche Informationen enthält. Wenn Sie GitHub Copilot benötigen, um Vorschläge basierend auf anderen Dateien bereitzustellen, können Sie diese öffnen oder bei der Verwendung von GitHub Copilot Chat @workspace mit Ihrer Eingabeaufforderung verwenden.