Aus AI Studio in Cloud Run bereitstellen

1. Übersicht

Wo fängt die Entwicklung mit KI heute an? Für die meisten von uns beginnt es mit einer einfachen Frage: Kann ich schnell einen Prototyp für eine Lösung des Problems erstellen, über das ich nachgedacht habe? Hier kommt Google AI Studio ins Spiel. Es ist eine Plattform für schnelles Prototyping. In diesem Codelab erstellen Sie mit Vibe Coding eine einfache Webanwendung und stellen sie in Cloud Run bereit.

Vorbereitung

• Grundlegende Kenntnisse von Webanwendungen

Lerninhalte

In diesem Codelab erfahren Sie, wie Sie Folgendes tun:

1. Mit Vibe Coding in Google AI Studio eine einfache Webanwendung erstellen
2. Testen Sie, ob die Anwendung wie erwartet funktioniert.
3. Die Anwendung in Cloud Run bereitstellen

Voraussetzungen

• Ein Webbrowser wie Chrome oder Firefox.

2. Hinweis

1. Wenn Sie noch kein Google-Konto haben, müssen Sie ein Google-Konto erstellen.
   • Verwenden Sie stattdessen ein privates Konto. Bei Arbeitskonten und Konten von Bildungseinrichtungen kann es Einschränkungen geben, die verhindern, dass Sie die für dieses Lab erforderlichen APIs aktivieren.
2. Rufen Sie Google AI Studio auf und lesen Sie die Nutzungsbedingungen.
3. Da Sie die Google Cloud-Starterstufe nutzen, können Sie bis zu zwei Full-Stack-Anwendungen kostenlos bereitstellen.

3. Prototyp

Sehen Sie sich in Google AI Studio kurz den Bereich Einstellungen oben rechts an. Hier können Sie Ihr Modell und das Standard-Framework auswählen und Systemanweisungen angeben:

Wenn Sie mit den Einstellungen zufrieden sind, beschreiben Sie die Anwendung, die Sie erstellen möchten, und klicken Sie auf Erstellen:

Create a formal looking frontend application that has two buttons: "Snowflakes" and "Balloons".  
If the user clicks on the "Snowflakes" button, snowflakes of medium size should start falling on the screen from top to bottom for 5 seconds.  
If the user clicks on the "Balloons" button, balloons of medium size should start floating from the bottom of the screen and float to the top for 5 seconds.

Anhand dieser Beschreibung erstellt AI Studio eine Webanwendung. Die Generierung dauert 2–3 Minuten. Möglicherweise werden Sie während des Vorgangs aufgefordert, Designoptionen auszuwählen:

Wenn Sie Probleme mit der Anwendung haben, können Sie zusätzliche Prompts eingeben, um ihr Verhalten zu optimieren, z. B. Increase the size of the snowflakes to twice their current size.

Das folgende Bild zeigt einen Snapshot der generierten Anwendung:

4. In Cloud Run bereitstellen

Nachdem die Anwendung fertig ist, stellen Sie sie in Cloud Run bereit:

1. Klicken Sie rechts oben auf der Seite auf Veröffentlichen.

2. Daraufhin wird das Dialogfeld App in Google Cloud bereitstellen geöffnet.

 Jedes Google Cloud Starter Tier-Konto erhält zwei Bereitstellungen kostenlos.

3. Klicken Sie auf das Drop-down-Menü Cloud-Projekt auswählen, um Ihr Projekt auszuwählen, oder fahren Sie mit dem Standard-Gemini-Projekt fort.
4. Wählen Sie das Projekt im Drop-down-Menü aus. Wenn Sie Ihr Projekt nicht finden können, klicken Sie auf Projekt importieren und wählen Sie das Projekt dann im Bereich Projekt importieren aus.
5. Wählen Sie bei Aufforderung Privatperson als Organisationstyp aus und geben Sie Ihre Adresse ein:

6. Klicken Sie auf App veröffentlichen und warten Sie, bis die Anwendung in Cloud Run bereitgestellt wurde. Der Name des Cloud Run-Dienstes wird automatisch von AI Studio generiert.

7. Die Bereitstellung dauert einige Minuten. Klicken Sie nach Abschluss des Vorgangs auf die App-URL, um die bereitgestellte Webanwendung zu öffnen.

5. Bereinigen

Wenn Sie vermeiden möchten, dass Ihrem Google Cloud-Konto die in diesem Codelab verwendeten Ressourcen in Rechnung gestellt werden, klicken Sie auf App aus dem Play Store entfernen:

6. Glückwunsch

Glückwunsch! Sie haben erfolgreich eine Webanwendung in Google AI Studio mit Vibe-Code erstellt und in Cloud Run bereitgestellt.

Durch die Integration von AI Studio in Cloud Run lassen sich Anwendungen ganz einfach direkt in Google Cloud bereitstellen. Mit Cloud Run profitieren Sie von allen Vorteilen einer serverlosen Umgebung, ohne sich um die Komplexität der Infrastrukturverwaltung kümmern zu müssen.

Nächste Schritte

Sie haben dieses Lab erfolgreich abgeschlossen. Nachdem Ihr Anwendungsframework bereit ist, können Sie die folgenden offiziellen Anleitungen lesen, um die Funktionen Ihres Projekts zu erweitern:

Empfohlene Dokumentation und Leitfäden

• Strategien für das Prompt-Design: Hier erfahren Sie mehr über die wichtigsten Prinzipien für die Strukturierung von Prompts, die Verwendung von Systemanweisungen, die Implementierung von Few-Shot-Beispielen und die Steuerung des Ausgabeformats.
• Funktionsaufrufe mit der Gemini API: Sie können Ihre Bereitstellung mit externen Tools und APIs verbinden, sodass das Gemini-Modell strukturierte Daten ausgeben und Anwendungslogik in der realen Welt auslösen kann.
• Text-to-Speech-Generierung: Hier erfahren Sie, wie Sie mit der Gemini API gesprochene Audioinhalte generieren, Sprachstile steuern und Stimmen mit der Voice Library in Google AI Studio testen.