1. Visão geral
Neste laboratório, você vai usar os produtos de IA generativa do Google para criar infraestrutura no Google Cloud com a ajuda do Gemini Cloud Assist, consultar dados do BigQuery usando recursos de linguagem natural para SQL do Data Canvas, escrever código em notebooks do Colab Enterprise Jupyter e no Eclipse Theia (Visual Studio Code) com a ajuda do Gemini Code Assist e integrar recursos de pesquisa e chat de IA criados com base em fontes de embasamento do Cloud Storage e do BigQuery no Vertex AI Agent Builder.
Nosso objetivo é criar um site de receitas e culinária chamado AI Recipe Haven. O site será criado em Python e Streamlit e terá duas páginas principais. O Cooking Advice vai hospedar um chatbot que vamos criar usando o Gemini e uma fonte fundamentada do Vertex AI Agent Builder vinculada a um grupo de livros de receitas. Ele vai oferecer dicas de culinária e responder a perguntas relacionadas a esse tema. A Pesquisa de receitas será um mecanismo de pesquisa alimentado pelo Gemini, desta vez com base em um banco de dados de receitas do BigQuery.
Se você tiver dificuldades com algum código neste exercício, as soluções para todos os arquivos de código estarão no repositório do GitHub do exercício na ramificação solution.
Objetivos
Neste laboratório, você aprenderá a fazer o seguinte:
- Ativar e usar o Gemini Cloud Assist
- Criar um app de pesquisa na Vertex AI Agent Builder para o chatbot de dicas de culinária
- Carregar e limpar dados em um notebook do Colab Enterprise com a ajuda do Gemini Code Assist
- Criar um app de pesquisa no Vertex AI Agent Builder para o gerador de receitas
- Estruturar o aplicativo da Web principal em Python e Streamlit com a ajuda do Gemini
- Implantar o aplicativo da Web no Cloud Run
- Conectar a página "Cooking Advice" ao app do Agent Builder "cookbook-search"
- (Opcional) Conecte a página de pesquisa de receitas ao app do Agent Builder de pesquisa de receitas
- (Opcional) Conheça o aplicativo final
2. Configuração e requisitos
Antes de clicar no botão "Começar o laboratório"
Leia estas instruções. Os laboratórios são cronometrados e não podem ser pausados. O timer é iniciado quando você clica em "Começar o laboratório" e mostra por quanto tempo os recursos do Google Cloud vão ficar disponíveis.
Este laboratório prático do Qwiklabs permite que você realize as atividades em um ambiente real de nuvem, não em uma simulação ou demonstração. Você receberá novas credenciais temporárias para fazer login e acessar o Google Cloud durante o laboratório.
O que é necessário
Veja os requisitos para concluir o laboratório:
- Acesso a um navegador de Internet padrão (recomendamos o Chrome).
- tempo para concluir as atividades.
Observação: não use seu projeto ou conta do Google Cloud neste laboratório.
Observação:se você estiver usando um Pixelbook, faça o laboratório em uma janela anônima.
Como iniciar seu laboratório e fazer login no console do Google Cloud
- Clique no botão "Começar laboratório". Se for preciso pagar pelo laboratório, você verá um pop-up para selecionar a forma de pagamento. Um painel aparece à esquerda contendo as credenciais temporárias que você precisa usar no laboratório.

- Copie o nome de usuário e clique em "Abrir Console do Google". O laboratório ativa os recursos e depois abre a página Fazer Login em outra guia.

Dica: abra as guias em janelas separadas, lado a lado.
Se a página "Escolha uma conta" aparecer, clique em "Usar outra conta".

- Na página Fazer login, cole o nome de usuário que você copiou do painel "Detalhes da conexão". Em seguida, copie e cole a senha.
Importante: é preciso usar as credenciais do painel "Connection Details". Não use as credenciais do Qwiklabs. Caso tenha sua própria conta do Google Cloud, não a use para este laboratório (isso evita cobranças). 4. Acesse as próximas páginas:
- Aceite os Termos e Condições.
- Não adicione opções de recuperação nem autenticação de dois fatores (porque essa é uma conta temporária).
- Não se inscreva em testes sem custos.
Depois de alguns instantes, o console do Cloud será aberto nesta guia.
Observação:para acessar a lista dos produtos e serviços do Google Cloud, clique no menu de navegação no canto superior esquerdo.

3. Tarefa 0: Verificar o cluster de estação de trabalho
Em uma parte posterior deste laboratório, você vai usar uma estação de trabalho do Google Cloud para fazer algum trabalho de desenvolvimento. O processo de inicialização deste laboratório deve ter começado a criação do cluster da sua estação de trabalho. Antes de continuar, vamos verificar se o cluster está sendo criado.
- No console do Google Cloud, use a caixa de pesquisa para acessar o Cloud Workstations.
- Use o menu de navegação à esquerda para acessar Gerenciamento de clusters.
- Se você tiver um cluster com o status "Atualizando", está tudo certo e você pode passar para a Tarefa 1. Se nenhum cluster aparecer, atualize a página. Se você ainda não vir um cluster "Atualizando (criando)", clique em Terminar o laboratório usando o botão no canto superior esquerdo destas instruções e reinicie o laboratório.
4. Tarefa 1: Ativar e usar o Gemini Cloud Assist
Nesta tarefa, vamos ativar e usar o Gemini Cloud Assist. Ao trabalhar no console do Google Cloud, o Gemini Cloud Assist pode oferecer conselhos, ajudar você a criar, configurar e monitorar sua infraestrutura em nuvem do Google Cloud e até sugerir comandos gcloud e escrever scripts do Terraform.
- Para ativar o Cloud Assist, clique na caixa de pesquisa na parte de cima da interface do console do Cloud e selecione Perguntar ao Gemini (ou Perguntar ao Gemini para o console do Cloud).
- Role até a seção "API obrigatória" da página e clique em Ativar na API Gemini para Google Cloud.
- Se uma interface de chat não aparecer imediatamente, clique em Iniciar conversa. Comece pedindo ao Gemini para explicar alguns dos benefícios de usar o Cloud Workstations. Reserve alguns minutos para analisar a resposta gerada.
- Em seguida, pergunte sobre os benefícios do Agent Builder e como ele pode ajudar a fundamentar as respostas generativas.
- Por fim, vamos fazer uma comparação. Na conversa no Gemini do console do Google Cloud, faça a seguinte pergunta:
What are the major steps to creating a search app grounded in a
GCS data source using Vertex AI Agent builder?
- Agora, na janela normal, acesse o site público do Gemini aqui, faça login se necessário e faça a mesma pergunta. As respostas são iguais ou pelo menos parecidas? As etapas específicas? Algum deles é visivelmente melhor? De qualquer forma, tenha as respostas em mente enquanto passamos pelas próximas etapas.
Observação:se você tentar fazer a etapa acima usando sua conta temporária do Qwiklabs, ela será bloqueada. Se a conta de trabalho também estiver bloqueada porque sua organização não permite o uso do web app do Gemini, pule a etapa e siga em frente. Isso não vai afetar sua capacidade de concluir o exercício.
5. Tarefa 2: Criar um app de pesquisa na Vertex AI Agent Builder para o chatbot de dicas de culinária
O site que estamos criando terá uma página com dicas de culinária e um chatbot projetado para ajudar os usuários a encontrar respostas para perguntas relacionadas a culinária. Ele vai usar o Gemini com base em uma fonte que contém 70 livros de receitas de domínio público. Os livros de receitas vão atuar como a fonte de informações que o Gemini usa ao responder a perguntas.
- Use a caixa de pesquisa do console do Cloud para navegar até a Vertex AI. No painel, clique em Ativar todas as APIs recomendadas. Se aparecer uma caixa pop-up informando que a API Vertex AI precisa ser ativada, clique em Ativar.
- Use a pesquisa para acessar o Agent Builder e clique em Continuar e ativar a API.
- Como o Gemini sugeriu em nossa busca por conselhos anterior, criar um app de pesquisa no Agent Builder começa com a criação de uma fonte de dados confiável. Quando o usuário pesquisa, o Gemini entende a pergunta e como criar respostas inteligentes, mas ele busca a fonte embasada para as informações usadas na resposta, em vez de usar o conhecimento próprio.
No menu à esquerda, acesse "Repositórios de dados" e "Criar repositório de dados". 4. Os livros de receitas de domínio público que estamos usando para fundamentar nossa página de dicas de culinária estão em um bucket do Cloud Storage em um projeto externo. Selecione o tipo de origem do Cloud Storage. 5. Examine, mas não mude as opções padrão relacionadas ao tipo de informação que estamos importando. Deixe o tipo de importação definido como "Pasta" e, para o caminho do bucket, use: labs.roitraining.com/labs/old-cookbooks e clique em Continuar. 6. Nomeie o repositório de dados: old-cookbooks. Edite e mude o ID para old-cookbooks-id. Em seguida, Crie o repositório de dados.
O Vertex AI Agent Builder é compatível com vários tipos de apps, e o repositório de dados atua como a fonte de verdade para cada um deles. Os apps de pesquisa são bons para uso geral e pesquisa. Os apps de chat são para fluxos generativos em aplicativos de chatbot/voicebot baseados no Dataflow. Os apps de recomendação ajudam a criar mecanismos de recomendação melhores. Os apps de agente são para criar agentes com tecnologia de IA generativa. No futuro, o Agent provavelmente será a melhor opção para o que queremos fazer, mas, como o produto está em prévia, vamos continuar com o tipo de app de pesquisa. 7. Use o menu à esquerda para navegar até Apps e clique em Criar app. 8. Selecione o tipo de app "Pesquisa". Examine, mas não mude as várias opções. Nomeie o app: cookbook-search. Editar e defina o ID do app como cookbook-search-id. Defina a empresa como Google e clique em Continuar. 9. Verifique o repositório de dados old-cookbooks que você criou há algumas etapas e Crie o app de pesquisa.
Se você examinar a guia Atividade, provavelmente vai notar que os livros de receitas ainda estão sendo importados e indexados. O Agent Builder vai levar mais de cinco minutos para indexar as milhares de páginas contidas nos 70 livros de receitas que fornecemos. Enquanto ele funciona, vamos carregar e limpar alguns dados do banco de dados de receitas para nosso gerador.
6. Tarefa 3: Carregar e limpar dados em um notebook do Colab Enterprise com a ajuda do Gemini Code Assist
O Google Cloud oferece algumas maneiras principais de trabalhar com notebooks Jupyter. Vamos usar a mais nova oferta do Google, o Colab Enterprise. Algumas pessoas já conhecem o produto Colab do Google, usado por indivíduos e organizações que querem testar notebooks Jupiter em um ambiente sem custo financeiro. O Colab Enterprise é uma oferta comercial do Google Cloud totalmente integrada ao restante dos produtos de nuvem do Google e que aproveita ao máximo os recursos de segurança e conformidade do ambiente do GCP.
Um dos recursos oferecidos pelo Colab Enterprise é a integração com o Gemini Code Assist do Google. O Code Assist pode ser usado em vários editores de código diferentes e oferecer conselhos, além de sugestões inline perfeitas enquanto você programa. Vamos aproveitar esse assistente generativo enquanto organizamos os dados da receita.
- Use a pesquisa para acessar Colab Enterprise e Criar um notebook. Se você receber uma oferta para testar novos recursos do Colab, dispense-a. Para ativar o tempo de execução, a capacidade de computação por trás do notebook, pressione Conectar no canto superior direito do novo notebook.

- Use o menu de três pontos ao lado do nome do bloco atual no painel "Arquivos do Colab Enterprise" para renomeá-lo
Data Wrangling.

- Crie uma nova caixa + Texto e use a seta para cima para movê-la até que seja a primeira célula da página.

- Edite a caixa de texto e insira:
# Data Wrangling
Import the Pandas library
- No bloco de código abaixo do bloco de texto que você acabou de criar, comece a digitar imp. O Gemini Code Assist vai sugerir o restante da importação em cinza. Pressione Tab para aceitar a sugestão.
import pandas as pd
- Abaixo da caixa de código de importação, crie outra caixa de texto e insira:
Create a Pandas DataFrame from: gs://labs.roitraining.com/labs/recipes/recipe_dataset.csv. View the first few records.
- Crie e edite outro bloco de código. De novo, comece a digitar df e examine o código gerado pelo Gemini Code Assist. Se você vir uma lista suspensa de preenchimento automático de palavras-chave do Python sobre a sugestão gerada, pressione "Escape" para ver o código sugerido em cinza claro. Toque novamente para aceitar a sugestão. Se a sugestão não tiver a chamada de função head(), adicione-a.
df = pd.read_csv('gs://labs.roitraining.com/labs/recipes/recipe_dataset.csv')
df.head()
- Clique na primeira célula de código, onde você importou o Pandas, e use o menu Comandos ou o teclado para executar a célula selecionada. No teclado, shift+enter executa a célula e muda o foco para a próxima, criando uma se necessário. Aguarde a execução da célula antes de continuar.
Observação:você verá [ ] à esquerda quando uma célula não tiver sido executada. Enquanto uma célula está sendo executada, você vê uma animação girando. Quando a célula terminar, um número vai aparecer, como [13]. 9. Execute a célula que carrega o CSV no DataFrame. Aguarde o carregamento do arquivo e examine as cinco primeiras linhas de dados. Esses são os dados de receitas que vamos carregar no BigQuery e que usaremos para fundamentar nosso gerador de receitas. 10. Crie um novo bloco de código e insira o comentário abaixo. Depois de digitar o comentário, vá para a próxima linha de código e você vai receber a sugestão df.columns. Aceite e execute a célula.
# List the current DataFrame column names
Acabamos de demonstrar que você tem duas opções de como receber ajuda do Gemini Code Assist em um notebook Jupyter: células de texto acima das células de código ou comentários dentro da própria célula de código. Os comentários em células de código funcionam bem em notebooks Jupyter, mas essa abordagem também funciona em qualquer outro ambiente de desenvolvimento integrado que ofereça suporte ao Gemini Code Assist do Google.
- Vamos fazer uma pequena revisão dos dados das colunas. Renomeie a coluna
Unnamed: 0paraidelinkparauri. Use a opção de comando > técnicas de código para criar o código e execute a célula quando estiver satisfeito.
# Rename the column 'Unnamed: 0' to 'id' and 'link' to 'uri'
df.rename(columns={'Unnamed: 0': 'id', 'link': 'uri'}, inplace=True)
- Remova as colunas
sourceeNERe usehead()para conferir as primeiras linhas. De novo, peça ajuda ao Gemini. Execute as duas últimas linhas e analise os resultados.
# Remove the source and NER columns
df.drop(columns=['source', 'NER'], inplace=True)
df.head()
- Vamos ver quantos registros há no nosso conjunto de dados. Comece com a técnica de comando que preferir e veja se o Gemini pode ajudar a gerar o código.
# Count the records in the DataFrame
df.shape # count() will also work
- 2,23 milhões de registros são provavelmente mais receitas do que temos tempo para fazer. O processo de indexação no Agent Builder provavelmente levaria muito tempo para o exercício de hoje. Como um compromisso, vamos selecionar 150.000 receitas e trabalhar com elas. Use a abordagem de comando > código para pegar a amostra e armazená-la em um novo DataFrame chamado
dfs(s de pequeno).
# Sample out 150,000 records into a DataFrame named dfs
dfs = df.sample(n=150000)
- Os dados de origem da receita estão prontos para serem carregados no BigQuery. Antes de fazer o carregamento, acesse o BigQuery e prepare um conjunto de dados para armazenar a tabela. No console do Google Cloud, use a caixa de pesquisa para acessar o BigQuery. Clique com o botão direito do mouse em BigQuery e abra em uma nova guia do navegador.
- Se ele ainda não estiver visível, abra o painel de conversa com a IA do Gemini usando o logotipo do Gemini no canto superior direito do console do Cloud. Se for necessário ativar a API de novo, pressione "Ativar" ou atualize a página. Execute o comando:
What is a dataset used for in BigQuery?Depois de analisar a resposta, pergunte:How can I create a dataset named recipe_data using the Cloud Console?Compare os resultados com as etapas a seguir.

- No painel do Explorador do BigQuery, clique no menu de três pontos Ver ações ao lado do ID do projeto. Em seguida, selecione Criar conjunto de dados.

- Forneça o conjunto de dados e o ID de
recipe_data. Deixe o tipo de local como US e clique em Criar conjunto de dados. Se você receber um erro informando que o conjunto de dados já existe, basta continuar.
Com o conjunto de dados criado no BigQuery, vamos voltar ao notebook e fazer a inserção. 19. Volte para o notebook de tratamento de dados no Colab Enterprise. Em uma nova célula de código, crie uma variável chamada project_id e use-a para armazenar o ID do projeto atual. Na parte de cima à esquerda destas instruções, abaixo do botão "Encerrar laboratório", você encontra o ID do projeto atual. Ela também está na página inicial do Console do Cloud, se preferir. Atribua o valor à variável project_id e execute a célula.
# Create a variable to hold the current project_id
project_id='YOUR_PROJECT_ID'
- Use a abordagem "comando > código" para criar um bloco de código que vai inserir o DataFrame
dfsem uma tabela chamadarecipesno conjunto de dadosrecipe_dataque acabamos de criar. Execute a célula.
dfs.to_gbq(destination_table='recipe_data.recipes', project_id=project_id, if_exists='replace')
7. Tarefa 4: Criar um app de pesquisa no Vertex AI Agent Builder para o gerador de receitas
Excelente! Agora que criamos nossa tabela de dados de receitas, vamos usá-la para criar uma fonte de dados fundamentada para nosso gerador de receitas. A abordagem que vamos usar é semelhante à que usamos para nosso chatbot de receitas. Vamos usar o Vertex AI Agent Builder para criar um repositório de dados e usá-lo como a fonte de verdade para um app de pesquisa.
Se quiser, peça ao Gemini no console do Google Cloud para lembrar as etapas de criação de um app de pesquisa do Agent Builder ou siga as etapas listadas abaixo.
- Use a pesquisa para acessar o Agent Builder. Abra Repositórios de dados e Criar repositório de dados. Desta vez, selecione o tipo de repositório de dados do BigQuery.
- Na célula de seleção de tabela, pressione Procurar e pesquise
recipes. Selecione o botão de opção ao lado da tabela. Se você encontrar receitas de outros projetos qwiklabs-gcp-..., selecione a que pertence a você.
Observação:se você clicar em recipes em vez de selecionar o botão de opção ao lado dele, uma nova guia será aberta no navegador, e você vai acessar a página de visão geral da tabela no BigQuery. Basta fechar a guia do navegador e selecionar o botão de opção no Agent Builder. 3. Examine, mas não mude as outras opções padrão. Depois, clique em Continuar. 4. Na página de revisão do esquema, examine as configurações padrão iniciais, mas não mude nada. Continuar 5. Nomeie o repositório de dados como recipe-data. Edite o ID do DataStore e defina como recipe-data-id. Crie o repositório de dados. 6. Navegue até Apps usando o menu de navegação à esquerda e clique em Criar app. 7. Selecione o app Pesquisa mais uma vez. Dê o nome recipe-search ao app e defina o ID como recipe-search-id. Defina o nome da empresa como Google e clique em Continuar. 8. Desta vez, verifique as fontes de dados recipe-data. Crie o app.
Vai levar um tempo para que a tabela do banco de dados seja indexada. Enquanto isso, vamos testar a nova tela de dados do BigQuery e ver se encontramos uma ou duas receitas interessantes. 9. Use a caixa de pesquisa para acessar o BigQuery. Na parte de cima do BigQuery Studio, clique na seta para baixo ao lado da guia mais à direita e selecione Tela de dados. Defina a região como us-central1.

- Na caixa de pesquisa da tela de dados, procure
recipese Adicione à tela sua tabela. - Uma representação visual da sua tabela de receitas será carregada na tela de dados do BigQuery. É possível analisar o esquema da tabela, visualizar os dados e examinar outros detalhes. Abaixo da representação da tabela, clique em Consulta.
- A tela vai carregar uma caixa de diálogo de consulta do BigQuery mais ou menos típica com uma adição: acima da janela de consulta, há uma caixa de texto que você pode usar para pedir ajuda ao Gemini. Vamos ver se encontramos algumas receitas de bolo na nossa amostra. Execute o seguinte comando (digitando o texto e pressionando "Enter"/"Return" para acionar a geração de SQL):
Please select the title and ingredients for all the recipes with a title that contains the word cake.
- Analise o SQL gerado. Quando terminar, clique em Executar.
- Nada mal! Teste alguns outros comandos e consultas antes de continuar. Ao testar, use comandos menos específicos para ver o que funciona e o que não funciona. Por exemplo, este comando:
Do I have any chili recipes?
(Não se esqueça de executar a nova consulta) Retornou uma lista de receitas de chili, mas deixou de fora os ingredientes até que eu a modifiquei para:
Do I have any chili recipes? Please include their title and ingredients.
(Sim, eu digo "por favor" quando dou um comando. Minha mãe ficaria muito orgulhosa.)
Notei que uma receita de chili continha cogumelos, e quem quer isso em chili? Pedi ajuda ao Gemini para excluir essas receitas.
Do I have any chili recipes? Please include their title and ingredients, and ignore any recipes with mushrooms as an ingredient.
8. Tarefa 5: Estruturar o aplicativo da Web principal em Python e Streamlit com a ajuda do Gemini
Com os dois repositórios de dados do Vertex AI Agent Builder indexados e os apps de pesquisa quase prontos para serem lançados, vamos criar nosso aplicativo da Web.
Vamos usar o Gemini Code Assist enquanto trabalhamos. Para mais informações sobre como usar o Gemini Code Assist no Visual Studio Code, consulte a documentação aqui.
Vamos fazer nosso desenvolvimento em uma estação de trabalho do Google Cloud, um ambiente de desenvolvimento baseado na nuvem, no nosso caso, pré-carregado com o Eclipse Theia (Visual Studio Code de código aberto). Um script automatizado neste exercício criou o cluster e a configuração do Cloud Workstations para nós, mas ainda precisamos criar a estação de trabalho em si. Se quiser mais informações sobre o Cloud Workstations e o uso dele, pergunte ao Gemini Cloud Assist :-)
- Use a pesquisa para navegar até Cloud Workstations e clique em Criar estação de trabalho. Nomeie a estação de trabalho
dev-enve use a configuração my-config. Crie a estação de trabalho. - Depois de alguns minutos, a nova estação de trabalho vai aparecer na lista "Minhas estações de trabalho". Inicie o
dev-enve, quando ele estiver em execução, inicie o ambiente de desenvolvimento. - O editor de estação de trabalho será aberto em uma nova guia do navegador e, depois de alguns instantes, você verá uma interface familiar do Theia (Visual Studio Code). No lado esquerdo da interface, expanda a guia Controle de origem e pressione Clonar repositório.

- No URL do repositório, insira
https://github.com/haggman/recipe-app. Clone o repositório na pastausere abra o repositório clonado para edição. - Antes de explorar a pasta clonada e começar a trabalhar no aplicativo da Web, precisamos fazer login no Google Cloud com o plug-in Cloud Code do editor e ativar o Gemini. Vamos fazer isso agora. Na parte de baixo à esquerda do editor, clique em Cloud Code - Fazer login. Se o link não aparecer, aguarde um minuto e verifique novamente.

- A janela do terminal vai mostrar um URL longo. Abra o URL no navegador e siga as etapas para conceder ao Cloud Code acesso ao seu ambiente do Google Cloud. Use a conta temporária do exercício
student-..., não sua conta pessoal do Google Cloud, ao fazer a autenticação. Na caixa de diálogo final, Copie o código de verificação e cole-o de volta na janela do terminal em espera na guia do navegador da estação de trabalho em nuvem. - Depois de alguns instantes, o link do Cloud Code no canto inferior esquerdo do editor vai mudar para Cloud Code - Sem projeto. Clique no novo link para selecionar um projeto. A paleta de comandos vai abrir na parte de cima do editor. Clique em Selecionar um projeto do Google Cloud e escolha o projeto qwiklabs-gcp-.... Depois de alguns instantes, o link no canto inferior esquerdo do editor será atualizado para mostrar o ID do projeto. Isso indica que o Cloud Code foi anexado ao projeto de trabalho.
- Com o Cloud Code conectado ao seu projeto, agora é possível ativar o Gemini Code Assist. No canto inferior direito da interface do editor, clique no logotipo riscado do Gemini. O painel do Gemini Chat vai abrir à esquerda do editor. Clique em Selecionar um projeto do Google Cloud. Quando a paleta de comandos abrir, selecione o projeto qwiklabs-gcp-.... Se você seguiu as etapas corretamente (e o Google não mudou nada), uma conversa no Gemini ativa vai aparecer.

- Por fim, vamos configurar a janela do terminal do editor da mesma forma. Use menu de hambúrguer > Visualizar > Terminal para abrir a janela do terminal. Execute
gcloud init. Mais uma vez, use o link para permitir que o terminal do Cloud Shell funcione com seu projetoqwiklabs-gcp-.... Quando solicitado, selecione a opção numérica do seu projeto doqwiklabs-gcp-.... - Excelente! Com o Terminal, a conversa no Gemini e as configurações do Cloud Code definidos, abra a guia Explorer e reserve alguns minutos para explorar os arquivos no projeto atual.

- No Explorer, abra o arquivo
requirements.txtpara edição. Mude para o painel de chat do Gemini e pergunte:
From the dependencies specified in the requirements.txt file, what type of application are we building?
- Então, estamos criando um aplicativo da Web interativo usando Python e Streamlit que interage com a Vertex AI e o Discovery Engine. Por enquanto, vamos nos concentrar nos componentes do aplicativo da Web. Como o Gemini diz, o Streamlit é um framework para criar aplicativos da Web orientados a dados em Python. Agora peça o seguinte:
Does the current project's folder structure seem appropriate for a Streamlit app?s
É aí que o Gemini costuma ter problemas. O Gemini pode acessar o arquivo aberto no editor, mas não consegue ver todo o projeto. Tente perguntar:
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
Recebeu uma resposta melhor?
- Vamos coletar mais informações sobre o Streamlit:
What can you tell me about Streamlit?
Legal, assim podemos ver que o Gemini está oferecendo uma boa visão geral, incluindo prós e contras.
- Se quiser saber os contras, pergunte:
What are the major downsides or shortcomings?
Observe que não precisamos dizer "do Streamlit" porque a conversa no Gemini é conversacional (vários turnos). O Gemini sabe do que estamos falando porque estamos em uma sessão de chat. Se quiser limpar o histórico de conversa no Gemini, use o ícone de lixeira na parte de cima da janela de chat de código do Gemini.
9. Tarefa 6: implantar o aplicativo da Web no Cloud Run
Excelente, temos nossa estrutura principal de aplicativo, mas tudo vai funcionar? Melhor ainda, onde devemos hospedar no Google Cloud?
- Na conversa no Gemini, pergunte:
If I containerize this application, what compute technologies
in Google Cloud would be best for hosting it?
- Se você não estiver trabalhando no seu ambiente de desenvolvimento integrado, também poderá usar o Google Cloud Assist. Abra o console do Google Cloud, o Gemini Cloud Assist e pergunte:
If I have a containerized web application, where would be the
best place to run it in Google Cloud?
Os dois conjuntos de conselhos eram iguais? Você concorda ou discorda de alguma das dicas? O Gemini é um assistente de IA generativa e, assim como um assistente humano, você nem sempre vai concordar com tudo o que ele diz. No entanto, ter esse assistente sempre ao seu lado enquanto você trabalha no Google Cloud e no editor de código pode aumentar muito sua eficiência.
- Para um aplicativo da Web conteinerizado sem estado e de curta duração, o Cloud Run seria uma ótima opção. Na conversa no Gemini no editor de código, tente o comando:
What steps would be required to run this application in
Cloud Run?
- Parece que a primeira coisa que precisamos fazer é criar um Dockerfile. Usando o editor, crie um arquivo chamado
Dockerfilena raiz da pasta do projeto. Tenha cuidado para não colocar o arquivo na pasta "pages" por engano. Abra o arquivo para edição. - Vamos usar o painel lateral de conversa no Gemini para criar nosso
Dockerfile. Use um comando como o abaixo. Quando os resultados forem exibidos no chat, use o + ao lado do ícone de cópia, logo acima do Dockerfile sugerido, para inserir o código sugerido no 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.
O Gemini nem sempre retorna a mesma resposta ao mesmo comando. Na primeira vez que pedi um Dockerfile ao Gemini, recebi exatamente o arquivo que vou sugerir para você. Acabei de receber a sugestão:
```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
COPY 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:
Qual é o melhor lugar no Google Cloud para armazenar imagens do Docker?
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.
Como usar a gcloud para criar um registro do Docker no Artifact Registry?
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.
Como usar a gcloud para criar um novo serviço do Cloud Run chamado recipe-web-app com uma imagem de mesmo nome do repositório do Artifact Registry que acabamos de criar?
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.
Comente o arquivo atual.
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.
Como saber se um tomate está maduro?
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("Como posso saber se um tomate está maduro?") 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("Como posso saber se um tomate está maduro?") 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:
Adicione o código copiado do notebook abaixo desta mensagem
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:
Confira o código para configurar as variáveis de sessão
Remova a marca de comentário deste bloco quando solicitado
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.
Confira o código para criar a interface de chat
Remova a marca de comentário do código abaixo quando isso for solicitado
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:
Você tem alguma dica para preparar brócolis?
Que tal uma receita clássica de sopa de frango?
Fale sobre o merengue.
6. Now let's find a recipe or two. Navigate to the Recipe Search page and try a few searches. Something like:
Chili com carne
Pimenta, milho, arroz
Torta de merengue de limão
Uma sobremesa com morangos
## 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!