Building Applications in the AI Era

1. Omówienie

W tym module użyjesz produktów generatywnej AI od Google do tworzenia infrastruktury w Google Cloud przy pomocy Gemini Cloud Assist, wysyłasz zapytania do danych BigQuery za pomocą funkcji SQL w Data Canvas, piszesz kod w notatnikach Jupyter w Colab Enterprise i w Eclipse Theia (Visual Studio Code) przy pomocy Gemini Code Assist, a także integrujesz funkcje wyszukiwania i czatu oparte na AI, które korzystają z źródeł danych Cloud Storage i BigQuery w Vertex AI Agent Builder.

Naszym celem jest stworzenie witryny z przepisami i przepisami kulinarnymi o nazwie AI Recipe Haven. Witryna zostanie utworzona w Pythonie i Streamlit i będzie zawierać 2 główne strony. Cooking Advice będzie hostem chatbota, który utworzymy za pomocą Gemini i Kreatora agentów Vertex AI, który będzie bazować na źródłach powiązanych z grupą książek kucharskich. Bot będzie udzielać porad kulinarnych i odpowiadać na pytania związane z gotowaniem. Wyszukiwarka przepisów będzie wyszukiwarką obsługiwaną przez Gemini, tym razem opartą na bazie danych przepisów BigQuery.

Jeśli napotkasz problemy z jakimkolwiek kodem w tym ćwiczeniu, rozwiązania dla wszystkich plików kodu znajdują się w repozytorium GitHub tego ćwiczenia na gałęzi solution.

Cele

Z tego modułu nauczysz się, jak:

• Aktywowanie i używanie Gemini Cloud Assist
• Tworzenie aplikacji wyszukiwania w Kreatorze agentów Vertex AI na potrzeby chatbota z poradami kulinarnymi
• Ładowanie i oczyszczanie danych w notatniku Colab Enterprise przy pomocy Gemini Code Assist
• Tworzenie aplikacji wyszukiwania w Kreatorze agentów Vertex AI na potrzeby generatora przepisów
• Za pomocą Gemini stwórz ramy podstawowej aplikacji internetowej w Pythonie i Streamlit
• Wdrażanie aplikacji internetowej w Cloud Run
• Połącz stronę Cooking Advice z naszą aplikacją Agent Builder do wyszukiwania przepisów
• (Opcjonalnie) Połącz stronę wyszukiwania przepisów z aplikacją konstruktora agenta do wyszukiwania przepisów
• (Opcjonalnie) Zapoznaj się z ostateczną aplikacją

2. Konfiguracja i wymagania

Zanim klikniesz przycisk Rozpocznij moduł

Zapoznaj się z tymi instrukcjami. Moduły mają limit czasowy i nie można ich zatrzymać. Gdy klikniesz Rozpocznij moduł, na liczniku wyświetli się informacja o tym, na jak długo udostępniamy Ci zasoby Google Cloud.

W tym praktycznym module Qwiklabs możesz spróbować swoich sił w wykonywaniu opisywanych działań w prawdziwym środowisku chmury, a nie w jego symulacji lub wersji demonstracyjnej. Otrzymasz nowe, tymczasowe dane logowania, dzięki którym zalogujesz się i uzyskasz dostęp do Google Cloud na czas trwania modułu.

Wymagania

Do ukończenia modułu potrzebne będą:

• dostęp do standardowej przeglądarki internetowej (zalecamy korzystanie z przeglądarki Chrome),
• czas wymagany do ukończenia modułu.

Uwaga: jeśli masz już osobiste konto lub projekt w Google Cloud, nie używaj go w tym module.

Uwaga: jeśli używasz Pixelbooka, uruchom ten moduł w oknie incognito.

Rozpoczynanie modułu i logowanie się w konsoli Google Cloud

1. Kliknij przycisk Rozpocznij moduł. Jeśli moduł jest odpłatny, otworzy się wyskakujące okienko, w którym możesz wybrać formę płatności. Po lewej stronie znajduje się panel z tymczasowymi danymi logowania, których musisz użyć w trakcie wykonywania zadań opisanych w module.

2. Skopiuj nazwę użytkownika i kliknij Otwórz konsolę Google. Moduł uruchomi zasoby, po czym otworzy nową kartę ze stroną logowania.

Wskazówka: karty możesz otwierać obok siebie w osobnych oknach.

Jeśli wyświetli się strona Wybierz konto, kliknij Użyj innego konta.

3. Na stronie logowania wklej nazwę użytkownika skopiowaną z panelu zawierającego szczegóły połączenia. Następnie skopiuj i wklej hasło.

Ważne: musisz użyć danych logowania z panelu Szczegóły połączenia. Nie używaj swoich danych logowania Qwiklabs. Jeśli masz już konto Google Cloud, nie używaj go w tym module (dzięki temu unikniesz obciążenia konta opłatami). 4. Na kolejnych stronach wykonaj następujące czynności:

1. Zaakceptuj Warunki korzystania z usługi.
2. Nie dodawaj opcji odzyskiwania ani uwierzytelniania dwuskładnikowego (ponieważ konto ma charakter tymczasowy).
3. Nie rejestruj się w bezpłatnych wersjach próbnych.

Poczekaj, aż na karcie otworzy się konsola Google Cloud.

Uwaga: aby wyświetlić menu z listą produktów i usług Google Cloud, w lewym górnym rogu kliknij menu nawigacyjne.

3. Zadanie 0. Sprawdzanie klastra stacji roboczych

W dalszej części tego modułu będziesz korzystać z Google Cloud Workstation do wykonywania zadań programistycznych. Proces uruchamiania tego laboratorium powinien rozpocząć tworzenie klastra stacji roboczej. Zanim przejdziesz dalej, sprawdź, czy klaster jest tworzony.

1. W konsoli Google Cloud użyj pola wyszukiwania, aby przejść do sekcji Cloud Workstations.
2. W menu nawigacyjnym po lewej stronie kliknij Zarządzanie klastrem.
3. Jeśli masz klaster w stanie „Updating” (Aktualizowanie), możesz przejść do zadania 1. Jeśli nie widzisz żadnych klastrów w żadnym stanie, odśwież stronę. Jeśli nadal nie widzisz klastra Aktualizowanie (tworzenie), zakończ moduł za pomocą przycisku w lewym górnym rogu tych instrukcji i uruchom ponownie moduł.

4. Zadanie 1. Aktywowanie i używanie Gemini Cloud Assist

W tym zadaniu aktywujemy i użyjemy Gemini Cloud Assist. Podczas pracy w Google Cloud Console Gemini Cloud Assist może udzielać porad, pomagać w tworzeniu, konfigurowaniu i monitorowaniu infrastruktury Google Cloud, a nawet sugerować polecenia gcloud i pisać skrypty Terraform.

1. Aby aktywować Cloud Assist, kliknij pole wyszukiwania u góry interfejsu Cloud Console i wybierz Zadaj pytanie Gemini (może też być Zadaj pytanie Gemini konsoli Cloud).
2. Przewiń do sekcji Wymagane interfejsy API na stronie i włącz interfejs Gemini for Google Cloud API.
3. Jeśli interfejs czatu nie pojawi się od razu, kliknij Rozpocznij czat. Zacznij od poproszenia Gemini o wyjaśnienie niektórych korzyści płynących z korzystania z pulpitów zdalnych w chmurze. Poświęć kilka minut na zapoznanie się z wygenerowaną odpowiedzią.
4. Następnie zapytaj o zalety Kreatora agentów i o to, jak może on pomóc w generowaniu odpowiedzi.
5. Na koniec przyjrzyjmy się porównaniu. W oknie czatu Gemini w konsoli Google Cloud Console zadaj to pytanie:

What are the major steps to creating a search app grounded in a
GCS data source using Vertex AI Agent builder?

6. Teraz w oknie bez trybu incognito otwórz publiczną witrynę Gemini, zaloguj się w razie potrzeby i zadaj to samo pytanie. Czy odpowiedzi są takie same lub przynajmniej podobne? Jakie dokładnie? Czy któraś z nich jest wyraźnie lepsza? Pamiętaj o tych odpowiedziach, gdy będziemy omawiać kolejne kroki.

Uwaga: jeśli spróbujesz wykonać te czynności, korzystając z tymczasowego konta Qwiklabs, zostaniesz zablokowany. Jeśli Twoje konto służbowe jest też zablokowane, ponieważ Twoja organizacja nie zezwala na korzystanie z aplikacji internetowej Gemini, po prostu pomiń ten krok i przejdź do następnego. Nie wpłynie to na możliwość wykonania tego ćwiczenia.

5. Zadanie 2. Tworzenie aplikacji wyszukiwania w Kreatorze agentów Vertex AI na potrzeby chatbota z poradami kulinarnymi

Strona internetowa, którą tworzymy, będzie zawierać stronę z poradami kulinarnymi z chatbotem, który pomoże użytkownikom znaleźć odpowiedzi na pytania związane z gotowaniem. Będzie ona korzystać z Gemini, bazując na źródle zawierającym 70 książek kucharskich z domeny publicznej. Książki kucharskie będą pełnić rolę źródła informacji, z którego Gemini będzie korzystać, aby odpowiadać na pytania.

1. W polu wyszukiwania konsoli Cloud przejdź do Vertex AI. W panelu kliknij Włącz wszystkie zalecane interfejsy API. Jeśli pojawi się wyskakujące okienko z informacją, że interfejs Vertex AI API musi zostać włączony, włącz go.
2. Użyj wyszukiwarki, aby przejść do Kreatora agentów, a potem kliknij Dalej i aktywuj interfejs API.
3. Jak sugerował Gemini w naszych wcześniejszych poradach, tworzenie aplikacji wyszukiwania w Agent Builder zaczyna się od utworzenia wiarygodnego źródła danych. Gdy użytkownik coś wyszukuje, Gemini rozumie pytanie i wie, jak sformułować inteligentne odpowiedzi, ale zamiast korzystać z własnej wiedzy, szuka informacji w źródłach zewnętrznych.

W menu po lewej stronie kliknij kolejno Magazyny danych i Utwórz magazyn danych. 4. Książki kucharskie z domeny publicznej, których używamy na stronie z poradami kulinarnymi, znajdują się obecnie w zasobniku Cloud Storage w projekcie zewnętrznym. Wybierz typ źródła Cloud Storage. 5. Sprawdź, ale nie zmieniaj domyślnych opcji związanych z typem importowanych informacji. Pozostaw typ importu ustawiony na Folder, a w ścieżce folderu użyj: labs.roitraining.com/labs/old-cookbooks, a następnie kliknij Dalej. 6. Nazwij magazyn danych: old-cookbooks. Kliknij Edytuj i zmień identyfikator na old-cookbooks-id, a następnie utwórz magazyn danych.

Kreator agentów Vertex AI obsługuje kilka typów aplikacji, a magazyn danych pełni funkcję źródła informacji dla każdej z nich. Aplikacje wyszukiwania są przydatne do ogólnego użytku i wyszukiwania. Aplikacje do obsługi czatu służą do generowania przepływów w aplikacji chatbota/voicebota opartego na Dataflow. Aplikacje do rekomendacji pomagają tworzyć lepsze systemy rekomendacji. Aplikacje agenta służą do tworzenia agentów opartych na generatywnej AI. Ostatecznie Agent prawdopodobnie najlepiej spełni nasze potrzeby, ale ponieważ usługa jest obecnie w wersji podglądowej, pozostaniemy przy aplikacji wyszukiwania. 7. W menu po lewej stronie kliknij Aplikacje, a następnie Utwórz aplikację. 8. Wybierz typ aplikacji wyszukiwania. Przyjrzyj się różnym opcjom, ale ich nie zmieniaj. Nazwa aplikacji: cookbook-search. Kliknij Edytuj i ustaw identyfikator aplikacji na cookbook-search-id. Ustaw firmę na Google i kliknij Dalej. 9. Sprawdź magazyn danych old-cookbooks utworzony kilka kroków wcześniej i utwórz aplikację wyszukiwania.

Jeśli przejrzysz kartę Aktywność, prawdopodobnie zobaczysz, że książki kucharskie są nadal importowane i indeksowane. Agent Builder będzie indeksować tysiące stron zawartych w 70 książkach kucharskich, które mu udostępniliśmy. Może to zająć ponad 5 minut. Podczas gdy ono działa, załadujmy i oczyśćmy dane z bazy danych przepisów, aby użyć ich w generatorze przepisów.

6. Zadanie 3. Ładowanie i oczyszczanie danych w notatniku Colab Enterprise przy pomocy Gemini Code Assist

Google Cloud oferuje kilka głównych sposobów pracy z notatkami w Jupiter. Będziemy używać najnowszej usługi Google, czyli Colab Enterprise. Niektórzy z Was mogą znać usługę Colab od Google, która jest często używana przez osoby i organizacje, które chcą eksperymentować z notatkami Jupiter w bezpłatnym środowisku. Colab Enterprise to komercyjna oferta Google Cloud, która jest w pełni zintegrowana z pozostałymi usługami Google w chmurze i w pełni korzysta z funkcji zabezpieczeń i zgodności z regulacjami środowiska GCP.

Jedną z funkcji Colab Enterprise jest integracja z Gemini Code Assist od Google. Asystent kodu może być używany w różnych edytorach kodu. Podczas pisania kodu może on oferować porady, a także wyświetlać w ramach kodu sugestie. Wykorzystamy tego asystenta podczas porządkowania danych o przepisach.

1. Użyj wyszukiwarki, aby przejść do Colab Enterprise i Utwórz notatnik. Jeśli otrzymasz ofertę dotyczącą eksperymentowania z nowymi funkcjami Colab, zignoruj ją. Aby uruchomić środowisko wykonawcze, czyli moc obliczeniową notebooka, w prawym górnym rogu nowego notebooka kliknij Połącz.

2. Użyj menu z 3 kropkami obok nazwy bieżącego notatnika na panelu Pliki Colab Enterprise, aby zmienić jego nazwę na Data Wrangling.

3. Utwórz nowe pole + Tekst i za pomocą strzałki w górę przenieś je, aby stało się pierwszą komórką na stronie.

4. Edytuj pole tekstowe i wpisz:

# Data Wrangling

Import the Pandas library

5. W bloku kodu pod utworzonym przez Ciebie blokiem tekstowym zacznij wpisywać imp. Gemini Code Assist powinien zasugerować resztę importu w szarym kolorze. Aby zaakceptować sugestię, naciśnij Tab.

import pandas as pd

6. Pod polem kodu importu utwórz kolejne pole tekstowe i wpisz:

Create a Pandas DataFrame from: gs://labs.roitraining.com/labs/recipes/recipe_dataset.csv. View the first few records.

7. Utwórz i edytuj kolejny blok kodu. Ponownie zacznij wpisywać df i sprawdź kod wygenerowany przez Gemini Code Assist. Jeśli nad wygenerowanym tekstem zobaczysz listę słów kluczowych Pythona, naciśnij klawisz Escape, aby wyświetlić sugerowany kod w jasnoszarym kolorze. Aby zaakceptować sugestię, naciśnij ponownie klawisz Tab. Jeśli Twoja propozycja nie zawierała wywołania funkcji head(), dodaj je.

df = pd.read_csv('gs://labs.roitraining.com/labs/recipes/recipe_dataset.csv')
df.head()

8. Kliknij pierwszą komórkę kodu, w której zaimportowano Pandas, i za pomocą menu Polecenia lub klawiatury uruchom wybraną komórkę. Na klawiaturze Shift+Enter uruchamia komórkę i przenosi fokus na następną komórkę, tworząc ją w razie potrzeby. Zanim przejdziesz dalej, poczekaj, aż komórka zostanie wykonana.

Uwaga: jeśli komórka nie została wykonana, po lewej stronie zobaczysz [ ]. Podczas wykonywania komórki zobaczysz obracającą się animację. Gdy komórka się wypełni, pojawi się liczba, np. [13]. 9. Wykonaj komórkę, która wczytuje plik CSV do DataFrame. Poczekaj, aż plik zostanie załadowany, i sprawdź pierwsze 5 wierszy danych. To są dane o przepisach, które wczytamy do BigQuery, a potem użyjemy ich do utworzenia generatora przepisów. 10. Utwórz nowy blok kodu i wpisz poniższy komentarz. Po wpisaniu komentarza przejdź do następnego wiersza kodu, aby wyświetlić sugestię df.columns. Zaakceptuj go, a następnie uruchom komórkę.

# List the current DataFrame column names

Właśnie pokazaliśmy, że w notebooku Jupyter możesz uzyskać pomoc od Gemini Code Assist na 2 sposoby: za pomocą komórek tekstowych nad komórkami kodu lub komentarzy w komórce kodu. Komentarze wewnątrz komórek kodu dobrze sprawdzają się w notatnikach Jupyter, ale to podejście działa też w każdym innym środowisku IDE obsługującym narzędzie Gemini Code assist od Google.

11. Posprzątamy trochę kolumny. Zmień nazwę kolumny Unnamed: 0 na id, a kolumny link na uri. Użyj prompta > technik kodowania, aby utworzyć kod, a potem uruchom komórkę, gdy będziesz zadowolony/zadowolona z wyników.

# Rename the column 'Unnamed: 0' to 'id' and 'link' to 'uri'
df.rename(columns={'Unnamed: 0': 'id', 'link': 'uri'}, inplace=True)

12. Usuń kolumny source i NER oraz użyj kolumny head(), aby wyświetlić kilka pierwszych wierszy. Ponownie skorzystaj z Gemini. Uruchom ostatnie 2 wiersze i sprawdź wyniki.

# Remove the source and NER columns
df.drop(columns=['source', 'NER'], inplace=True)
df.head()

13. Zobaczmy, ile rekordów zawiera nasz zbiór danych. Ponownie zacznij od wybrania techniki promptów i sprawdź, czy Gemini może pomóc Ci wygenerować kod.

# Count the records in the DataFrame
df.shape # count() will also work

14. 2,23 mln rekordów to prawdopodobnie więcej przepisów, niż mamy czasu. Proces indeksowania w Agent Builder prawdopodobnie zajęłby zbyt dużo czasu na potrzeby tego ćwiczenia. W ramach kompromisu wypróbujmy 150 tys. przepisów. Użyj prompt > code, aby pobrać próbkę i przechowywać ją w nowej ramce danych o nazwie dfs (s to skrót od small, czyli mały).

# Sample out 150,000 records into a DataFrame named dfs
dfs = df.sample(n=150000)

15. Dane źródłowe przepisów są gotowe do załadowania do BigQuery. Zanim przejdziemy do wczytywania, przejdźmy do BigQuery i przygotuj zbiór danych, który będzie przechowywać naszą tabelę. W konsoli Google Cloud użyj pola wyszukiwania, aby przejść do BigQuery. Możesz kliknąć BigQuery prawym przyciskiem myszy i otworzyć je w nowej karcie przeglądarki.
16. Jeśli nie jest jeszcze widoczny, otwórz panel czatu AI Gemini, klikając logo Gemini w prawym górnym rogu Konsoli Google Cloud. Jeśli pojawi się prośba o ponowne włączenie interfejsu API, kliknij Włącz lub odśwież stronę. Uruchom prompt: What is a dataset used for in BigQuery? Po zapoznaniu się z odpowiedzią zadaj pytanie: How can I create a dataset named recipe_data using the Cloud Console? Porównaj wyniki z kilkoma kolejnymi krokami.

17. W panelu Eksplorator BigQuery kliknij menu z 3 kropkami Wyświetl działania obok identyfikatora projektu. Następnie wybierz Utwórz zbiór danych.

18. Podaj zbiór danych i identyfikator recipe_data. Pozostaw typ lokalizacji jako US i kliknij Utwórz zbiór danych. Jeśli pojawi się komunikat o błędzie, że zbiór danych już istnieje, po prostu przejdź dalej.

Po utworzeniu zbioru danych w BigQuery wracamy do naszego notebooka i wstawiamy dane. 19. Wróć do notatnika Data Wrangling w Colab Enterprise. W nowej komórce z kodem utwórz zmienną o nazwie project_id, która będzie przechowywać identyfikator Twojego obecnego projektu. W lewym górnym rogu tych instrukcji, pod przyciskiem Zakończ moduł, znajdziesz identyfikator bieżącego projektu. Jeśli chcesz, możesz też otworzyć je na stronie głównej konsoli Cloud. Przypisz wartość do zmiennej project_id i uruchom komórkę.

# Create a variable to hold the current project_id
project_id='YOUR_PROJECT_ID'

20. Użyj prompt > code, aby utworzyć blok kodu, który wstawi DataFrame dfs do tabeli o nazwie recipes w utworzonym przez nas właśnie zbiorze danych recipe_data. Uruchom komórkę.

dfs.to_gbq(destination_table='recipe_data.recipes', project_id=project_id, if_exists='replace')

7. Zadanie 4. Tworzenie aplikacji wyszukiwania w Kreatorze agentów Vertex AI na potrzeby generatora przepisów

Świetnie, tabela z danymi o przepisach została już utworzona. Użyjemy jej do utworzenia źródła danych dla naszego generatora przepisów. Podejście, którego użyjemy, będzie podobne do tego, którego używaliśmy w przypadku naszego czatbota do gotowania. Za pomocą Kreatora agentów Vertex AI utworzymy magazyn danych, który posłuży jako źródło informacji dla aplikacji wyszukiwania.

Jeśli chcesz, możesz poprosić Gemini w konsoli Google Cloud o przypomnienie czynności, które należy wykonać, aby utworzyć aplikację wyszukiwania za pomocą Kreatora agentów. Możesz też wykonać czynności opisane poniżej.

1. Użyj wyszukiwania, aby przejść do Kreatora agentów. Otwórz Magazyny danych i Utwórz magazyn danych. Tym razem wybierz typ BigQuery Data Store.
2. W komórce wyboru tabeli kliknij Przeglądaj i wyszukaj recipes. Kliknij przycisk obok tabeli. Jeśli widzisz przepisy z innych projektów qwiklabs-gcp-…, wybierz ten, który należy do Ciebie.

Uwaga: jeśli klikniesz recipes, zamiast kliknąć przycisk radiowy obok niego, otworzy się nowa karta w przeglądarce i przejdziesz na stronę podsumowania tabeli w BigQuery. Wystarczy zamknąć kartę przeglądarki i kliknąć przycisk radiowy w Kreatorze agentów. 3. Sprawdź pozostałe opcje domyślne (nie zmieniaj ich), a potem kliknij Dalej. 4. Na stronie sprawdzania schematu przejrzyj początkowe domyślne konfiguracje, ale niczego nie zmieniaj. Dalej 5. Nazwij magazyn danych recipe-data. Zmień identyfikator magazynu danych na recipe-data-id. Utwórz magazyn danych. 6. W menu nawigacyjnym po lewej stronie kliknij Aplikacje, a potem Utwórz aplikację. Ponownie wybierz aplikację Szukaj. Nazwij aplikację recipe-search i ustaw identyfikator recipe-search-id. Wpisz nazwę firmy (Google) i kliknij Dalej. 8. Tym razem sprawdź źródła danych recipe-data. Utwórz aplikację.

Utworzenie indeksu tabeli bazy danych może trochę potrwać. Zanim to nastąpi, spróbujmy poeksperymentować z nowym obszarem roboczym danych BigQuery i zobaczmy, czy uda nam się znaleźć jakiś ciekawy przepis. 9. Użyj pola wyszukiwania, aby przejść do BigQuery. U góry BigQuery Studio kliknij strzałkę w dół obok karty znajdującej się najdalej w prawo i wybierz Obszar roboczy danych. Ustaw region na us-central1.

10. W polu wyszukiwania na panelu danych wyszukaj recipes i dodaj do panelu swoją tabelę.
11. Na kanwie danych BigQuery zostanie załadowana wizualizacja tabeli przepisów. Możesz tu przeanalizować schemat tabeli, wyświetlić podgląd danych w niej oraz sprawdzić inne szczegóły. Pod reprezentacją tabeli kliknij Zapytanie.
12. Na obszarze roboczym zostanie wyświetlone mniej lub bardziej typowe okno zapytania BigQuery z jednym dodatkiem: nad oknem zapytania znajduje się pole tekstowe, za pomocą którego możesz poprosić Gemini o pomoc. Sprawdźmy, czy w naszym pliku ze zbiorem danych znajdziemy przepisy na ciasta. Uruchom poniższy prompt (naciśnij Enter, aby uruchomić generowanie kodu SQL):

Please select the title and ingredients for all the recipes with a title that contains the word cake.

13. Sprawdź wygenerowany kod SQL. Gdy wszystko będzie gotowe, uruchom zapytanie.
14. Nieźle! Zanim przejdziesz dalej, możesz wypróbować kilka innych promptów i zapytań. Podczas eksperymentowania używaj mniej konkretnych promptów, aby sprawdzić, co działa, a co nie. Na przykład:

Do I have any chili recipes?

(Nie zapomnij uruchomić nowego zapytania) Zwrócił listę przepisów na chili, ale bez składników. Po modyfikacji wyglądało to tak:

Do I have any chili recipes?  Please include their title and ingredients.

(Tak, mówię „proszę” w odpowiednich momentach. Moja mama byłaby z ciebie dumna.)

Zauważyłem/Zauważyłam, że jeden z przepisów na chili zawiera grzyby. Kto w ogóle lubi grzyby w chili? Poprosiłem Gemini o pomoc w wykluczeniu tych przepisów.

Do I have any chili recipes?  Please include their title and ingredients, and ignore any recipes with mushrooms as an ingredient.

8. Zadanie 5. Za pomocą Gemini stwórz podstawową aplikację internetową w Pythonie i Streamlit

Oba indeksy magazynów danych w Vertex AI Agent Builder są już gotowe, a aplikacje wyszukiwarki są gotowe do użycia, więc możemy przejść do tworzenia aplikacji internetowej.

Podczas pracy będziemy korzystać z Gemini Code Assist. Więcej informacji o korzystaniu z Gemini Code Assist w Visual Studio Code znajdziesz w dokumentacji tutaj.

Będziemy pracować w Google Cloud Workstation, czyli w chmurze, w środowisku programistycznym, które w naszym przypadku jest wstępnie załadowane oprogramowaniem Eclipse Theia (Visual Studio Code w wersji open source). Automatyczny skrypt w tym ćwiczeniu utworzył dla nas klaster i konfigurację Cloud Workstation, ale musimy jeszcze utworzyć samą Cloud Workstation. Jeśli chcesz dowiedzieć się więcej o Cloud Workstations i ich używaniu, skontaktuj się z Gemini Cloud Assist.

1. Użyj wyszukiwarki, aby przejść do Cloud Workstations, a następnie kliknij Utwórz stację roboczą. Nazwij stację roboczą dev-env i użyj konfiguracji my-config. Utwórz stację roboczą.
2. Po kilku minutach nowa stacja robocza pojawi się na liście Moje stacje robocze. Uruchom dev-env, a gdy program się uruchomi, uruchom środowisko programistyczne.
3. W nowej karcie przeglądarki otworzy się edytor stacji roboczej, a po chwili powinien pojawić się znajomy interfejs Theia (Visual Studio Code). Po lewej stronie interfejsu rozwiń kartę Kontrola źródła i kliknij Klonuj repozytorium.

4. W polu Adres URL repozytorium wpisz https://github.com/haggman/recipe-app. Skopiuj repozytorium do folderu user, a potem otwórz skopiowane repozytorium do edycji.
5. Zanim zaczniemy przeglądać skopiowany folder i pracować nad naszą aplikacją internetową, musimy zalogować w Google Cloud wtyczkę Cloud Code w edytorze i włączyć Gemini. Zróbmy to teraz. W lewym dolnym rogu edytora kliknij Cloud Code – Zaloguj się. Jeśli nie widzisz linku, odczekaj minutę i sprawdź ponownie.

6. W oknie terminala wyświetli się długi adres URL. Otwórz adres URL w przeglądarce i wykonaj czynności, aby przyznać Cloud Code dostęp do środowiska Google Cloud. Podczas uwierzytelniania upewnij się, że używasz konta temp student-..., a nie osobistego konta Google Cloud. W ostatnim oknie skopiuj kod weryfikacyjny i wklej go z powrotem w oknie terminala na karcie przeglądarki Cloud Workstation.
7. Po chwili link Cloud Code w lewym dolnym rogu edytora zmieni się na Cloud Code – brak projektu. Kliknij nowe połączenie, aby wybrać projekt. Paleta poleceń powinna otworzyć się u góry edytora. Kliknij Wybierz projekt Google Cloud i wybierz projekt qwiklabs-gcp-.... Po chwili link w lewym dolnym rogu edytora zostanie zaktualizowany i będzie zawierać identyfikator projektu. Oznacza to, że Cloud Code został pomyślnie dołączony do Twojego projektu roboczego.
8. Po połączeniu Cloud Code z projektem możesz aktywować Gemini Code Assist. W prawym dolnym rogu interfejsu edytora kliknij przekreślone logo Gemini. Po lewej stronie edytora otworzy się panel czatu Gemini. Kliknij Wybierz projekt Google Cloud. Gdy otworzy się paleta poleceń, wybierz projekt qwiklabs-gcp-.... Jeśli wykonasz te czynności prawidłowo (i Google niczego nie zmieni), powinno się teraz wyświetlić aktywne okno czatu Gemini.

9. Na koniec skonfigurujmy okno terminala w edytorze. Aby otworzyć okno terminala, kliknij menu hamburgera > Wyświetl > Terminal. Wykonaj gcloud init. Ponownie użyj tego linku, aby umożliwić terminalowi Cloud Shell działanie w projektie qwiklabs-gcp-.... Gdy pojawi się taka prośba, wybierz opcję numeryczną z poziomu projektu qwiklabs-gcp-....
10. Świetnie. Konfiguracja terminala, czatu Gemini i Cloud Code jest już gotowa. Otwórz kartę Eksplorator i poświęć kilka minut na zapoznanie się z plikami w bieżącym projekcie.

11. W Eksploratorze otwórz plik requirements.txt do edycji. Przejdź do panelu czatu Gemini i zapytaj:

From the dependencies specified in the requirements.txt file, what type of application are we building?

12. Tworzymy interaktywną aplikację internetową w Pythonie i Streamlit, która współpracuje z Vertex AI i Discovery Engine. Skupmy się teraz na komponentach aplikacji internetowej. Jak podaje Gemini, Streamlit to framework do tworzenia aplikacji internetowych opartych na danych w języku Python. Teraz zadaj pytanie:

Does the current project's folder structure seem appropriate for a Streamlit app?s

Właśnie w tym miejscu Gemini ma problemy. Gemini może uzyskać dostęp do pliku, który jest obecnie otwarty w edytorze, ale nie może zobaczyć całego projektu. Spróbuj zadać takie pytanie:

Given the below, does the current project's file and folder structure seem appropriate for a Streamlit app?

- build.sh
- Home.py
- requirements.txt
- pages
-- Cooking_Advice.py
-- Recipe_Search.py

Chcesz uzyskać lepszą odpowiedź?

13. Aby dowiedzieć się więcej o Streamlit:

What can you tell me about Streamlit?

Dobrze, widzimy, że Gemini oferuje nam dobry przegląd, w tym zalety i wady.

14. Jeśli chcesz poznać wady, możesz zapytać:

What are the major downsides or shortcomings?

Zwróć uwagę, że nie musimy mówić „z Streamlit”, ponieważ Gemini Chat jest rozmową (wieloetapową). Gemini wie, o czym rozmawialiśmy, ponieważ jesteśmy na czacie. Jeśli w dowolnym momencie chcesz wyczyścić historię czatu Gemini, kliknij ikonę kosza u góry okna czatu z kodem Gemini.

9. Zadanie 6. Wdróż aplikację internetową w Cloud Run

Świetnie, mamy już podstawową strukturę aplikacji, ale czy wszystko będzie działać? A jeszcze lepiej: gdzie w Google Cloud powinniśmy go hostować?

1. W oknie czatu Gemini zapytaj:

If I containerize this application, what compute technologies
in Google Cloud would be best for hosting it?

2. Pamiętaj, że jeśli nie pracowałeś(-aś) jeszcze w swoim środowisku IDE, możesz też skorzystać z Google Cloud Assist. Otwórz konsolę Google Cloud, a następnie Gemini Cloud Assist i zapytaj:

If I have a containerized web application, where would be the
best place to run it in Google Cloud?

Czy te 2 porady były takie same? Czy zgadzasz się z jakąś radą? Pamiętaj, że Gemini to asystent oparty na generatywnej AI, który tak jak ludzki asystent nie zawsze będzie się zgadzać ze wszystkim, co mówi. Jednak pomocnik zawsze dostępny podczas pracy w Google Cloud i edytorze kodu może znacznie zwiększyć Twoją wydajność.

3. W przypadku bezstanowej, krótkotrwałej aplikacji internetowej w kontenerze świetnym rozwiązaniem będzie Cloud Run. W oknie czatu Gemini w edytorze kodu wypróbuj prompt:

What steps would be required to run this application in
Cloud Run?

4. Wygląda na to, że najpierw musimy utworzyć plik Dockerfile. W edytorze utwórz plik o nazwie Dockerfile w katalogu głównym folderu projektu. Upewnij się, że nie umieszczasz go przypadkowo w folderze stron. Otwórz plik do edycji.
5. Utwórz Dockerfile, korzystając z panelu bocznego czatu Gemini. Użyj promptu podobnego do tego poniżej. Gdy wyniki zostaną wyświetlone w czacie, użyj ikony kopiowania obok ikony kopiowania tuż nad sugerowanym plikiem Dockerfile, aby wstawić sugerowany kod do pliku Dockerfile.

Create a Dockerfile for the application in the current folder.
The dependencies are defined in requirements.txt and I want you
to use the Python 3 slim bookworm base image.

Gemini nie zawsze zwraca tej samej odpowiedzi na ten sam prompt. Gdy po raz pierwszy poprosiłam Gemini o plik Dockerfile, otrzymałam dokładnie ten plik, którego używam. Właśnie otrzymałem sugestię:

```docker
# Base image
FROM python:3-bookworm-slim

# Set working directory
WORKDIR /app

# Install dependencies
RUN apt-get update && apt-get install -y \
    build-essential \
    libpq-dev \
    gcc \
    python3-dev \
    && rm -rf /var/lib/apt/lists/*

# Install pip and virtualenv
RUN pip install --upgrade pip virtualenv

# Create virtual environment
RUN python3 -m venv venv

# Activate virtual environment
WORKDIR /app/venv/bin
RUN . activate

# Install Streamlit and libraries from requirements.txt
RUN pip install -r requirements.txt

# Copy application files
COPY . /app

# Expose port 8501 for Streamlit
EXPOSE 8501

# Start Streamlit app
CMD ["streamlit", "run", "main.py"]

That's a heck of a Dockerfile. I'd simplify it a bit. We don't need the apt-get section as anything needed for Python is already in our base image. Also, using a virtual environment in a Python container is a waste of space, so I'd remove that. The expose command isn't strictly necessary, but it's fine. Also, it's trying to start main.py which I don't have.

6. Tweak the Dockerfile so it resembles the following:

FROM python:3.11-slim-bookworm

WORKDIR /app

skopiuj plik requirements.txt . RUN pip install –no-cache-dir –upgrade pip &&
pip install –no-cache-dir -r requirements.txt

COPY . .

CMD ["streamlit", "run", "Home.py"]

7. We need a place in Google cloud where we can store our container image. Let's get a little help from Gemini. In the Google Cloud Console Gemini Cloud Assist ask:

Gdzie w Google Cloud najlepiej przechowywać obrazy Dockera?

8. If one of the answers you received is the Google Container Registry, then I guess Gemini hasn't gotten word that GCR is deprecated. Again, just like human assistants, you may get out of date or simply wrong answers (hallucinations). Always make sure to consider your choices carefully, even when Gemini is recommending something.

Let's go with Artifact Registry. Ask Gemini Cloud Assist how to create a docker registry in Artifact Registry named cooking-images.

Jak utworzyć rejestr Dockera w Artifact Registry za pomocą gcloud?

9. Now ask Gemini how you could use Cloud Build to build a new image named `recipe-web-app` from the Dockerfile in the current folder.

Jak za pomocą gcloud utworzyć nową usługę Cloud Run o nazwie recipe-web-app na podstawie obrazu o tej samej nazwie z repozytorium Artifact Registry, które właśnie utworzyliśmy?

10. To save you a little time, I've created a script that will create the Artifact Registry repo (if needed), use Cloud Build to build and push the image to the repo, and finally to deploy the application to Cloud Run. In your code editor use the **Explorer** view to open `build.sh` and explore the file.
11. Gemini can operate via the chat window, but it can also work directly in your code file using comments, like we used in the Data Wrangling notebook, and it also may be invoked using Control+i on Windows or Command+i on Mac. Click somewhere in the build.sh script file, activate Gemini using the appropriate Command+i / Control+i command.

<img src="img/61ac2c9a245a3695.png" alt="61ac2c9a245a3695.png"  width="624.00" />

12. At the prompt enter the below. Examine and **Accept** the change.

Dodaj komentarz do bieżącego pliku.

How cool is that?! How many times have you had to work with someone elses code, only to have to waste time gaining a base understanding of their commentless work before you can even start making your changes. Gemini to the rescue!

13. Let's build and deploy our application. In the terminal window execute the `build.sh` file.

. build.sh

14. If you watch the build process, first it will build the Artifact Registry docker repo. Then, it uses Cloud Build to create the container image from the Dockerfile in the local folder (since we didn't supply a `cloudbuild.yaml`). Lastly, the docker image will be deployed into a new Cloud Run service. At the end of the script you'll get a Cloud Run test URL to use.

Open the returned link in a new tab of your browser. Take a moment and explore the application's structure and pages. Nice, now we need a hook in our generative AI functionality.


## Task 7: Connect the Cooking Advice page to our cookbook-search Agent Builder app



We have the framework for the web application running, but we need to connect the two work pages to our two Vertex AI Agent Builder search apps. Let's start with Cooking Advice.

1. In the Google Cloud console use search to navigate to **Chat** in Vertex AI.
2. In the right hand settings page pane set the model to **gemini-1.5-flash-002**. Slide the output token limit up to the max so the model can return longer answers if needed. Open the **Safety Filter Settings**. Set Hate speech, Sexually explicit content, and Harassment content to **Block some**. Set Dangerous content to **Block few** and **Save**. We're setting Dangerous Content a bit lower because talking about knives and cutting can be misinterpreted by Gemini as violence.
3. Slide on the toggle to enable **Grounding** then click **Customize**. Set the grounding source to **Vertex AI search** and for the datastore path use the following. Change YOUR_PROJECT_ID to the project ID found up near the End Lab button in these instructions, then **Save** the grounding settings

projects/YOUR_PROJECT_ID/locations/global/collections/default_collection/dataStores/old-cookbooks-id

**Note:** If you get an error then you either didn't change the project ID to your actual project ID, or you may have missed the step where you changed the old-cookbooks Agent Builder Data Store ID. Check your Agent Builder > Data Stores > old-cookbooks for its actual Data store ID.

4. Test a couple of chat messages. Perhaps start with the below. Try a few others if you like.

Jak mogę sprawdzić, czy pomidor jest dojrzały?

5. The model works, now let's experiment with the code. Click **Clear Conversation** so our conversations don't become part of the code then click **Get Code**.

<img src="img/dce8ad7ee006cca1.png" alt="dce8ad7ee006cca1.png"  width="624.00" />

6. At the top of the code window, press Open Notebook so we can experiment and perfect the code in Colab Enterprise before integrating it into our app.
7. Take a few minutes to familiarize yourself with the code. Let's make a couple of changes to adapt it to what we want. Before we start, run the first code cell to connect to the compute and install the AI Platform SDK. After the block runs you will be prompted to restart the session. Go ahead and do that.
8. Move to the code we pulled out of Vertex AI Studio. Change the name of the method *multiturn_generate_content* to `start_chat_session`.
9. Scroll to the `model = GenerativeModel(` method call. The existing code defines the `generation_config` and `safety_settings` but doesn't actually use them. Modify the creation of the `GenerativeModel` so it resembles:

model = GenerativeModel( "gemini-1.5-flash-002", tools=tools, generation_config=generation_config, safety_settings=safety_settings, )

10. Lastly, add a final line to the method, just below `chat = model.start_chat()`, so the function returns the `chat` object. The finished function should look like the below.

**Note:** DO NOT COPY this code into your notebook. It is simply here as a sanity check.

def start_chat_session(): vertexai.init(project="qwiklabs-gcp-02-9a7298ceaaec", location="us-central1") tools = [ Tool.from_retrieval( retrieval=grounding.Retrieval( source=grounding.VertexAISearch(datastore="projects/qwiklabs-gcp-02-9a7298ceaaec/locations/global/collections/default_collection/dataStores/old-cookbooks-id"), ) ), ] model = GenerativeModel( "gemini-1.5-flash-002", tools=tools, generation_config=generation_config, safety_settings=safety_settings, ) chat = model.start_chat() return chat

11. Scroll to the bottom of the code cell and change the final line calling the old function so it calls the new function name and stores the returned object in a variable `chat`. Once you are satisfied with your changes, run the cell.

chat = start_chat_session()

12. Create a new code cell and add the comment `# Use chat to invoke Gemini and print out the response`. Move to the next line and type resp and Gemini should auto complete the block for you. Update the prompt to `How can I tell if a tomato is ripe?`. Run the cell

response = chat.send_message("How can I tell if a tomato is ripe?") print(response)

13. That's the response alright, but the part we really want is that nested text field. Modify the codeblock to print just that section, like:

response = chat.send_message("How can I tell if a tomato is ripe?") print(response.candidates[0].content.parts[0].text)

14. Good, now that we have working chat code, let's integrate it into our web application. Copy all the contents of the code cell that creates the `start_chat_session` function (we won't need the test cell). If you click into the cell you can click the triple dot menu in the upper right corner and copy from there

<img src="img/17bf8d947393d4b.png" alt="17bf8d947393d4b.png"  width="326.00" />

15. Switch to your Cloud Workstation editor and open pages\Cooking_Advice.py for editing.
16. Locate the comment:

Poniżej tej wiadomości dodaj kod skopiowany z notatnika

17. Paste your copied code just below the above comment. Nice, now we have the section which drives the chat engine via a grounded call to Gemini. Now let's integrate it into Streamlit.
18. Locate section of commented code directly below the comment:

Oto kod do konfigurowania zmiennych sesji

Odkomentuj ten blok, gdy pojawi się taka instrukcja

19. Uncomment this section of code (Up till the next `Setup done, let's build the page UI` section) and explore it. It creates or retrieves the chat and history session variables.
20. Next, we need to integrate the history and chat functionality into the UI. Scroll in the code until you locate the below comment.

Oto kod do utworzenia interfejsu czatu

Odkomentuj kod poniżej, gdy pojawi się taka instrukcja

21. Uncomment the rest of the code below the comment and take a moment to explore it. If you like, highlight it and get Gemini to explain its functionality.
22. Excellent, now let's build the application and deploy it. When the URL comes back, launch the application and give the Cooking Advisor page a try. Perhaps ask it about ripe tomatoes, or the bot knows a good way to prepare brussels sprouts.

. build.sh

How cool is that! Your own personal AI cooking advisor :-)


## Task 8: (Optional) Connect the Recipe Search page to the recipe-search Agent Builder app



When we connected the Cooking Advice page to its grounded source, we did so using the Gemini API directly. For Recipe Search, let's connect to the Vertex AI Agent Builder search app directly.

1. In your Cloud Workstation editor, open the `pages/Recipe_Search.py` page for editing. Investigate the structure of the page.
2. Towards the top of the file, set your project ID.
3. Examine the `search_sample` function. This code more or less comes directly from the Discovery Engine documentation  [here](https://cloud.google.com/generative-ai-app-builder/docs/preview-search-results#genappbuilder_search-python). You can find a working copy in this notebook  [here](https://github.com/GoogleCloudPlatform/generative-ai/blob/main/search/create_datastore_and_search.ipynb).
4. The only change I made was to return the `response.results` instead of just the results. Without this, the return type is an object designed to page through results, and that's something we don't need for our basic application.
5. Scroll to the very end of the file and uncomment the entire section below `Here are the first 5 recipes I found`.
6. Highlight the whole section you just uncommented and open Gemini Code chat. Ask, `Explain the highlighted code`. If you don't have something selected, Gemini can explain the whole file. If you highlight a section and ask Gemini to explain, or comment, or improve it, Gemini will.

Take a moment and read through the explanation. For what it's worth, using a Colab Enterprise notebook is a great way to explore the Gemini APIs before you integrate them into your application. It's especially helpful at exploring some of the newer APIs which may not be documented as well as they could be.
7. At your editor terminal window, run `build.sh` to deploy the final application. Wait until the new version is deployed before moving to the next step.


## Task 9: (Optional) Explore the final application



Take a few minutes to explore the final application.

1. In the Google Cloud console, use search to navigate to **Cloud Run**, then click into your **recipe-web-app**.
2. Locate the application test URL (towards the top) and open it in a new browser tab.
3. The application home page should appear. Note the basic layout and navigation provided by Streamlit, with the python files from the `pages` folder displayed as navigational choices, and the `Home.py` loaded as the home page. Navigate to the **Cooking Advice** page.
4. After a few moments the chat interface will appear. Again, note the nice core layout provided by Streamlit.
5. Try a few cooking related questions and see how the bot functions. Something like:

Czy masz jakieś rady na temat gotowania brokułów?

A może klasyczna zupa z kurczaka?

Opowiedz mi o bezie.

6. Now let's find a recipe or two. Navigate to the Recipe Search page and try a few searches. Something like:

Chili con carne

Chili, kukurydza, ryż

Ciasto cytrynowe z bezą

deser z truskawkami,

## Congratulations!



You have created an application leveraging Vertex AI Agent Builder applications. Along the way you've explored Gemini Cloud Assist, Gemini Code Assist, and the natural language to SQL features of BigQuery's Data Canvas. Fantastic job!