GSP1330

Übersicht

Gemini ist ein KI-basierter Assistent, der Entwicklungsteams dabei unterstützt, Anwendungen schneller und effizienter zu erstellen, bereitzustellen und zu betreiben.

In diesem Lab erfahren Sie, wie Gemini for Developers Sie beim Debuggen Ihres Codes unterstützen und Unittests generieren kann, z. B. beim Testen von Grenzbedingungen in Ihrem Code.

Die Labs in diesem Kurs behandeln einen typischen Softwareentwicklungs-Lebenszyklus (Software Development Life Cycle, SDLC) aus der Sicht von Personen, die Anwendungen entwickeln. Andere Aspekte des SDLC (Anforderungen, Sicherheit, Monitoring usw.) werden in anderen Kursen behandelt.

Lernziele

In diesem Lab wird beschrieben, wie Sie Gemini for Developers für Folgendes nutzen können:

• Mit Gemini for Developers Laufzeitfehler erkennen und beheben
• Unittests für Funktionen generieren

Lerninhalte

Cymbal Superstore ist eine erfolgreiche Online-Shopping-Plattform, die sich kontinuierlich verbessern möchte, um auf dem Markt wettbewerbsfähig zu bleiben. Im Rahmen der laufenden Entwicklungsarbeiten wird eine neue Funktion namens „New Products“ eingeführt, mit der Nutzerinnen und Nutzer leicht die aktuellen Neuigkeiten im Ladenbestand entdecken können.

Der neue Endpunkt newproducts wurde in der Staging-Umgebung bereitgestellt, entspricht aber nicht ganz den Vorstellungen der Person, der das Unternehmen gehört. Sie müssen einige Änderungen vornehmen und den neuen Code debuggen. Um den Schwerpunkt des Labs darauf zu legen, wie Gemini for Developers Sie unterstützen kann, wird der neue Code der ursprünglichen Codebasis hinzugefügt. Außerdem sollen Sie einige Unittests der Backend-Dienste entwickeln.

Einrichtung und Anforderungen

Vor dem Klick auf „Start Lab“ (Lab starten)

Lesen Sie diese Anleitung. Labs sind zeitlich begrenzt und können nicht pausiert werden. Der Timer beginnt zu laufen, wenn Sie auf Lab starten klicken, und zeigt Ihnen, wie lange Google Cloud-Ressourcen für das Lab verfügbar sind.

In diesem praxisorientierten Lab können Sie die Lab-Aktivitäten in einer echten Cloud-Umgebung durchführen – nicht in einer Simulations- oder Demo-Umgebung. Dazu erhalten Sie neue, temporäre Anmeldedaten, mit denen Sie für die Dauer des Labs auf Google Cloud zugreifen können.

Für dieses Lab benötigen Sie Folgendes:

• Einen Standardbrowser (empfohlen wird Chrome)

Hinweis: Nutzen Sie den privaten oder Inkognitomodus (empfohlen), um dieses Lab durchzuführen. So wird verhindert, dass es zu Konflikten zwischen Ihrem persönlichen Konto und dem Teilnehmerkonto kommt und zusätzliche Gebühren für Ihr persönliches Konto erhoben werden.

• Zeit für die Durchführung des Labs – denken Sie daran, dass Sie ein begonnenes Lab nicht unterbrechen können.

Hinweis: Verwenden Sie für dieses Lab nur das Teilnehmerkonto. Wenn Sie ein anderes Google Cloud-Konto verwenden, fallen dafür möglicherweise Kosten an.

Lab starten und bei der Google Cloud Console anmelden

1. Klicken Sie auf Lab starten. Wenn Sie für das Lab bezahlen müssen, wird ein Dialogfeld geöffnet, in dem Sie Ihre Zahlungsmethode auswählen können. Auf der linken Seite befindet sich der Bereich „Details zum Lab“ mit diesen Informationen:

   • Schaltfläche „Google Cloud Console öffnen“
   • Restzeit
   • Temporäre Anmeldedaten für das Lab
   • Ggf. weitere Informationen für dieses Lab

2. Klicken Sie auf Google Cloud Console öffnen (oder klicken Sie mit der rechten Maustaste und wählen Sie Link in Inkognitofenster öffnen aus, wenn Sie Chrome verwenden).

   Im Lab werden Ressourcen aktiviert. Anschließend wird ein weiterer Tab mit der Seite „Anmelden“ geöffnet.

   Tipp: Ordnen Sie die Tabs nebeneinander in separaten Fenstern an.

   Hinweis: Wird das Dialogfeld Konto auswählen angezeigt, klicken Sie auf Anderes Konto verwenden.

3. Kopieren Sie bei Bedarf den folgenden Nutzernamen und fügen Sie ihn in das Dialogfeld Anmelden ein.

   {{{user_0.username | "Username"}}}

   Sie finden den Nutzernamen auch im Bereich „Details zum Lab“.

4. Klicken Sie auf Weiter.

5. Kopieren Sie das folgende Passwort und fügen Sie es in das Dialogfeld Willkommen ein.

   {{{user_0.password | "Password"}}}

   Sie finden das Passwort auch im Bereich „Details zum Lab“.

6. Klicken Sie auf Weiter.

   Wichtig: Sie müssen die für das Lab bereitgestellten Anmeldedaten verwenden. Nutzen Sie nicht die Anmeldedaten Ihres Google Cloud-Kontos. Hinweis: Wenn Sie Ihr eigenes Google Cloud-Konto für dieses Lab nutzen, können zusätzliche Kosten anfallen.

7. Klicken Sie sich durch die nachfolgenden Seiten:

   • Akzeptieren Sie die Nutzungsbedingungen.
   • Fügen Sie keine Wiederherstellungsoptionen oder Zwei-Faktor-Authentifizierung hinzu (da dies nur ein temporäres Konto ist).
   • Melden Sie sich nicht für kostenlose Testversionen an.

Nach wenigen Augenblicken wird die Google Cloud Console in diesem Tab geöffnet.

Hinweis: Wenn Sie auf Google Cloud-Produkte und ‑Dienste zugreifen möchten, klicken Sie auf das Navigationsmenü oder geben Sie den Namen des Produkts oder Dienstes in das Feld Suchen ein.

Cloud Shell aktivieren

Cloud Shell ist eine virtuelle Maschine, auf der Entwicklertools installiert sind. Sie bietet ein Basisverzeichnis mit 5 GB nichtflüchtigem Speicher und läuft auf Google Cloud. Mit Cloud Shell erhalten Sie Befehlszeilenzugriff auf Ihre Google Cloud-Ressourcen.

1. Klicken Sie oben in der Google Cloud Console auf Cloud Shell aktivieren .

2. Klicken Sie sich durch die folgenden Fenster:

   • Fahren Sie mit dem Informationsfenster zu Cloud Shell fort.
   • Autorisieren Sie Cloud Shell, Ihre Anmeldedaten für Google Cloud API-Aufrufe zu verwenden.

Wenn eine Verbindung besteht, sind Sie bereits authentifiziert und das Projekt ist auf Project_ID, eingestellt. Die Ausgabe enthält eine Zeile, in der die Project_ID für diese Sitzung angegeben ist:

Ihr Cloud-Projekt in dieser Sitzung ist festgelegt als {{{project_0.project_id | "PROJECT_ID"}}}

gcloud ist das Befehlszeilentool für Google Cloud. Das Tool ist in Cloud Shell vorinstalliert und unterstützt die Tab-Vervollständigung.

3. (Optional) Sie können den aktiven Kontonamen mit diesem Befehl auflisten:

gcloud auth list

4. Klicken Sie auf Autorisieren.

Ausgabe:

ACTIVE: * ACCOUNT: {{{user_0.username | "ACCOUNT"}}} Um das aktive Konto festzulegen, führen Sie diesen Befehl aus: $ gcloud config set account `ACCOUNT`

5. (Optional) Sie können die Projekt-ID mit diesem Befehl auflisten:

gcloud config list project

Ausgabe:

[core] project = {{{project_0.project_id | "PROJECT_ID"}}} Hinweis: Die vollständige Dokumentation für gcloud finden Sie in Google Cloud in der Übersicht zur gcloud CLI.

Aufgabe 1: Code untersuchen, generieren und testen

Umgebungsvariablen festlegen

1. Führen Sie in der Cloud Shell den folgenden Befehl aus, um die erforderlichen Umgebungsvariablen festzulegen:

export PROJECT_ID=$(gcloud config get-value project) export REGION={{{project_0.default_region|Lab Region}}} export ZONE={{{project_0.startup_script.lab_zone|Lab Zone}}}

2. Kopieren Sie die erforderlichen Dateien aus dem Cloud Storage-Bucket in die Cloud Shell.

gsutil -m cp -r gs://duet-appdev/cymbal-superstore .

Code untersuchen

Gemini kann nicht nur Codeabschnitte erklären, mit denen Sie nicht vertraut sind, sondern auch Kommentare erstellen, die Sie Ihrem Code hinzufügen können, um das Verständnis bei zukünftigen Wartungszyklen zu verbessern.

3. Klicken Sie oben rechts im Cloud Shell-Fenster auf Editor öffnen, um den Editor zu öffnen.

Dadurch wird der Visual Studio-Code-Editor geöffnet. Sie können den Editor in einem neuen Fenster öffnen. Klicken Sie dazu auf die entsprechende Option in der Menüleiste der Cloud Shell.

4. Klicken Sie auf Datei > Ordner öffnen….

5. Wählen Sie das Verzeichnis cymbal-superstore aus und klicken Sie auf OK.

Der ausgewählte Ordner sollte jetzt im Abschnitt Explorer des Visual Studio-Code-Editors zu sehen sein.

6. Öffnen Sie die Datei index.ts im Ordner backend.

7. Klicken Sie rechts oben in der Datei auf den Pfeil neben Gemini .

8. Klicken Sie auf Gemini Code Assist-Projekt auswählen, um das Projekt auszuwählen, das Sie für Gemini verwenden möchten. Wählen Sie in der Liste die -Projekt-ID aus.

9. Wenn unten im Editor eine Eingabeaufforderung angezeigt wird, dass Gemini Code Assist für das ausgewählte Projekt nicht aktiviert ist, klicken Sie in der Eingabeaufforderung auf den Button API aktivieren, um die API zu aktivieren.

Code generieren

10. Scrollen Sie in der Datei index.ts bis zur Zeile 102. Dort sehen Sie den folgenden Text: /newproducts endpoint code goes here. Ersetzen Sie diese Zeile durch den unten gezeigten Kommentar.

{{{project_0.startup_script.prompt_1 | "Comment 1"}}} {{{project_0.startup_script.prompt_2 | "Comment 2"}}}

11. Wählen Sie den neu hinzugefügten Kommentar aus und klicken Sie auf das gelbe Glühbirnensymbol, das daraufhin angezeigt wird. Klicken Sie in der Liste auf die folgende Option: Gemini: Generate code.

12. Gemini zeigt einige Codevorschläge an. Sehen Sie sich den vorgeschlagenen Code an und übernehmen Sie ihn, indem Sie auf Akzeptieren klicken oder die Tabulatortaste drücken. Der Code sollte in etwa so aussehen:

Hinweis:

1. Gemini kannte die Bedeutung von „are in stock“ (sind auf Lager). Das ist eine gängige Formulierung mit einer allgemein bekannten Bedeutung, also hat Gemini sie hier verwendet. Wenn Ihre Anforderung weniger gängig ist, ist möglicherweise ein Beispiel erforderlich.
2. Durch die Verwendung einer Dateneigenschaft mit dem Namen „quantity“ (Menge) konnte Gemini diese mit dem Konzept „in stock“ (auf Lager) verknüpfen. Wenn Sie Ihre Variablen, Eigenschaften und Methoden mit Abkürzungen oder anderen nicht standardmäßigen Begriffen benennen, ist Ihr Code nicht nur schwerer zu warten, sondern Gemini kann auch weniger spezifische Vorschläge machen.
3. Obwohl nicht explizit angegeben, schlug Gemini Code mit der Datenbank-Laufzeitprüfung vor, um ihn an andere Endpunkte in der Datei anzugleichen.

Code testen

13. Wechseln Sie über den Button Terminal öffnen in der Symbolleiste des Cloud Shell-Fensters zum Cloud Shell-Terminal zurück. Führen Sie im Cloud Shell-Terminal den folgenden Befehl aus:

cd ~/cymbal-superstore/backend npm run start

Ihre Ausgabe sieht dann etwa so aus:

14. Öffnen Sie ein weiteres Terminal in der Cloud Shell, indem Sie in der Symbolleiste des Cloud Shell-Fensters auf + klicken, und rufen Sie den Endpunkt auf localhost auf.

curl localhost:8000/newproducts

Sehen Sie sich die Ausgabe im ersten Terminal an. Sie wurde abgebrochen und es ist ein Fehler aufgetreten.

Ihre Ausgabe sieht dann etwa so aus:

Klicken Sie auf Fortschritt prüfen. Code generieren und testen

Aufgabe 2: Mit Gemini Chat untersuchen

1. Öffnen Sie die Datei index.ts im Editor.

2. Öffnen Sie Gemini Chat wie im Screenshot gezeigt und geben Sie die angezeigte Fehlermeldung in den Prompt ein.

{{{project_0.startup_script.prompt_2_1 | "Error message to be entered in the prompt"}}}

Ihre Ausgabe sieht dann etwa so aus:

Hinweis: Bei jeder Ausführung von Gemini wird ein anderes Ergebnis erzeugt. Die Ergebnisse, die Sie sehen, können daher von Ihrer Antwort abweichen.

3. Untersuchen Sie den Code, um das Problem zu beheben. Der folgende Befehl ist Ihrer Meinung nach die Ursache des Fehlers:

const query = firestore const products = await firestore .collection("inventory") .where("timestamp", ">", new Date(Date.now() - 604800000)) .where("quantity", ">", 0); .where("timestamp", ">=", sevenDaysAgo) .where("quantity", ">", 0) .get();

Gemini bietet Ihnen die Möglichkeit, die Filter so zu ändern, dass sie Gleichheitsfilter werden, oder einen der Ungleichheitsfilter zu löschen.

Entfernen Sie zuerst den Mengenfilter aus dem Firestore-Aufruf, um den Fehler zu beheben.

4. Um den Ungleichheitsfilter für die Menge zu entfernen, löschen Sie das folgende Code-Snippet aus der Datei index.ts:

.where("quantity", ">", 0);

Dieser Code kann entfernt werden, damit die Funktion fehlerfrei funktioniert. Produkte mit einer Menge von 0 können nicht aus der API-Antwort herausgefiltert werden, was bedeutet, dass sie die Geschäftsanforderung nicht erfüllen und fehlschlagen. Wir müssen darauf achten, keine Artikel einzufügen, die nicht auf Lager sind. Dafür gibt es mehrere geeignete Ansätze. Manche funktionieren besser als andere. Deshalb bitten wir Gemini um Unterstützung.

5. Stellen Sie die folgende Frage im Gemini Chat und achten Sie darauf, dass die Datei index.ts geöffnet ist:

{{{project_0.startup_script.prompt_2_2 | "Question to the Gemini Chat"}}}

Ihre Ausgabe sieht dann etwa so aus:

Selbst nach dem Zurücksetzen des Chats kann es vorkommen, dass Gemini immer wieder vorschlägt, zwei where-Klauseln hinzuzufügen. Hier ist eine Möglichkeit, eine andere Antwort zu erhalten:

{{{project_0.startup_script.prompt_2_3 | "Different question approach to the Gemini Chat"}}}

Gemini schlägt oft eine Alternative vor, die Sie ausprobieren können. Möglicherweise müssen Sie den Chat zurücksetzen und den Prompt mehrmals ändern, um eine Option ohne Firestore zu erhalten.

Hinweis: Manchmal ist Gemini stur und bietet nur zufällige (und illegale) Firestore-Optionen an. In diesem Fall muss der Lernende mit dem vorgeschlagenen Text fortfahren.

Ihre Ausgabe sieht dann etwa so aus:

6. Ändern Sie den vorhandenen Code, indem Sie das Code-Snippet in die Datei index.ts einfügen.

if (p.quantity > 0) { productsArray.push(p); }

Nach der Änderung sollte der Code so aussehen:

Testen des Codes mit den oben genannten Änderungen

7. Öffnen Sie das Cloud Shell-Terminal und fügen Sie den folgenden Befehl ein:

cd ~/cymbal-superstore/backend npm run start

8. Öffnen Sie einen zweiten Terminaltab und rufen Sie den Endpunkt localhost auf.

curl localhost:8000/newproducts

Ihre Ausgabe sieht dann etwa so aus:

9. Probieren wir es mit einem Inline-Kommentar und entfernen wir die oben hinzugefügte Bedingung. Der endgültige Code sieht in etwa so aus:

10. Fügen Sie vor der Zeile productsArray.push(p) den folgenden Kommentar ein. Drücken Sie Strg + Eingabetaste, um Code zu generieren. Akzeptieren Sie den Code, wenn if (p.quantity > 0) zurückgegeben wird.

{{{project_0.startup_script.prompt_2_4 | "Comment message"}}}

Kommentieren Sie den Filter aus. Er sollte dann so aussehen:

Klicken Sie auf Fortschritt prüfen. Mit Gemini Chat untersuchen

Hinweis: Da es viele Möglichkeiten gibt, diesen Fehler zu beheben, kann Gemini zahlreiche Vorschläge machen. In diesem Fall müssen Sie die Optionen bewerten. Dies kann auch zu einer Syntaxkorrektur führen, wie oben gezeigt.

Aufgabe 3: Tests ausführen

1. Rufen Sie das Cloud Shell-Terminal auf und führen Sie den folgenden Befehl aus:

cd cymbal-superstore/backend npm run test

Ihre Ausgabe sieht dann etwa so aus:

2. Öffnen Sie die Datei index.test.ts im Ordner „backend“. Diese Datei enthält einige einfache Tests, die mit dem Tool supertest und dem Jest-Testframework entwickelt wurden. Sehen Sie sich die vorhandenen Tests an und lassen Sie sich von Gemini alles erklären, was unklar ist.

Aufgabe 4: Tests mithilfe von Gemini entwickeln

In dieser Aufgabe schreiben Sie einen Test für die API für neue Produkte im Backend mithilfe von Gemini.

Test entwickeln

1. Öffnen Sie die Datei index.test.ts im Ordner „backend“. Fügen Sie unten in der Datei die folgenden Kommentare hinzu:

{{{project_0.startup_script.prompt_3_1 | "Comment message 1 in index.test.ts"}}} {{{project_0.startup_script.prompt_3_2 | "Comment message 2 in index.test.ts"}}}

2. Wählen Sie den neu hinzugefügten Kommentar aus und klicken Sie auf das gelbe Glühbirnensymbol, das daraufhin angezeigt wird. Klicken Sie in der Liste auf die folgende Option: Gemini: Generate code. Drücken Sie die Tabulatortaste, um den Vorschlag zu akzeptieren.

Dies ist ein Beispiel für den generierten Code. Sie können auch den unten angegebenen Code einfügen.

describe('GET /newproducts', () => { it('should return a 200 status code', async () => { const response = await request(app) .get('/newproducts'); {{{project_0.startup_script.prompt_3_3 | "Generated code line from Gemini"}}}; }); it('should return a list of new products with length 8', async () => { const response = await request(app) .get('/newproducts'); expect(response.body.length).toBe(8); }); });

Testen

3. Führen Sie die folgenden Befehle im Cloud Shell-Terminal aus:

cd ~/cymbal-superstore/backend npm run test

Ihre Ausgabe sieht dann etwa so aus:

4. Scrollen Sie in der Terminalausgabe durch die Ergebnisse, um herauszufinden, welcher Test fehlgeschlagen ist.

Hinweis: Sie sollten diese Antwort sehen, die angibt, dass der Test fehlgeschlagen ist. Der Wert 10 war die Anzahl der neuen Produkte einschließlich der Produkte mit der Menge 0. Die neuen Geschäftsanforderungen besagen, dass Artikel, die nicht auf Lager sind, herausgefiltert werden sollen. Der Test zeigt jedoch, dass etwas nicht stimmt.

Klicken Sie auf Fortschritt prüfen. Tests für die API für neue Produkte schreiben

Fehler beheben

5. Öffnen Sie die Datei index.ts im Ordner „backend“ und entfernen Sie den Kommentar für den Filter, der in der letzten Aufgabe hinzugefügt wurde. Der aktualisierte Code sollte so aussehen:

//do not insert products that are out of stock if (p.quantity > 0) productsArray.push(p);

6. Führen Sie den Test im Cloud Shell-Terminal noch einmal aus.

cd ~/cymbal-superstore/backend npm run test

Ihre Ausgabe sieht dann etwa so aus:

Aufgabe 5: Grenzbedingungstest

Grenzbedingungstests können schwierig sein. Diese Schwierigkeit rührt daher, dass unerwartete Situationen wie leere Listen oder negative Salden berücksichtigt werden müssen, die zwar nicht auftreten sollten, aber während der Ausführung auftreten können. Sehen wir uns an, ob Gemini hier helfen kann.

1. Schließen Sie alle geöffneten Dateien, um eine möglichst generische Antwort zu erhalten. Setzen Sie den Gemini-Chat zurück, indem Sie über dem Chat auf das Symbol Neuer Chat (+) klicken, und geben Sie den folgenden Prompt ein:

{{{project_0.startup_script.prompt_4_1 | "Prompt for boundary conditions"}}}

Ihre Ausgabe sieht dann etwa so aus:

Yes, I can definitely help you create tests for boundary conditions! Boundary value analysis is a crucial part of software testing. It involves testing at the "edges" or "boundaries" of input domains. These are often the places where errors lurk. To help you best, I'd need a little more information. For example: - What programming language are you using? - Could you provide the code (or a snippet of it) that you'd like to test? - What are the inputs and their expected valid ranges?

2. Öffnen Sie die Datei index.ts im Ordner backend, um Gemini einige Hintergrundinformationen zu geben. Fragen Sie Gemini nach Grenztests für den Endpunkt /newproducts. Öffnen Sie den Gemini-Chat und geben Sie folgenden Prompt ein:

{{{project_0.startup_script.prompt_4_2 | "Prompt for boundary tests for the /newproducts endpoint"}}}

Ihre Ausgabe sieht dann etwa so aus:

Hinweis: Einige dieser Vorschläge wurden offensichtlich auf der Grundlage des Codes selbst generiert (in den letzten 7 Tagen hinzugefügt und auf Lager) und allgemeinere Grenzbedingungen, die Gemini gefunden hat, sind typisch für diese Art von Code. Dies ist sehr hilfreich, um einen soliden Satz von Grenzbedingungen zu erstellen.

3. Um daraus die eigentlichen Tests zu erstellen. Öffnen Sie die Datei index.test.ts. Kopieren Sie den folgenden Kommentar und fügen Sie ihn am Ende der Datei ein:

{{{project_0.startup_script.prompt_4_3 | "Comment message in index.test.ts file"}}}

Ihre Ausgabe sieht dann etwa so aus:

4. Fügen Sie den folgenden Code in der Datei index.test.ts nach dem obigen Kommentar ein:

describe('GET /newproducts', () => { it('should not return products that are out of stock', async () => { const response = await request(app) .get('/newproducts'); response.body.forEach((product: any) => { expect(product.quantity).toBeGreaterThan(0); }); }); });

5. Führen Sie den Test im Cloud Shell-Terminal noch einmal aus. Die Ausgabe sollte so aussehen:

Ihre Ausgabe sieht dann etwa so aus:

Klicken Sie auf Fortschritt prüfen. Grenzbedingungstest

Das wars! Sie haben das Lab erfolgreich abgeschlossen.

In diesem Lab haben Sie gelernt, wie Sie Gemini for Developers verwenden, um das Debuggen von Code zu verbessern und das Generieren von Unittests zu optimieren, insbesondere beim Bewerten von Grenzbedingungen im Code.

Anleitung zuletzt am 17. Oktober 2025 aktualisiert

Lab zuletzt am 17. Oktober 2025 getestet

© 2025 Google LLC. Alle Rechte vorbehalten. Google und das Google-Logo sind Marken von Google LLC. Alle anderen Unternehmens- und Produktnamen können Marken der jeweils mit ihnen verbundenen Unternehmen sein.