1. Introdução
No mundo digital acelerado de hoje, o tempo é um bem precioso. O YouTube é um grande repositório de informações, mas vídeos longos podem exigir um investimento de tempo significativo. É aí que os resumidores do YouTube se tornam inestimáveis. Essas ferramentas condensam vídeos longos em resumos concisos, permitindo que os usuários compreendam rapidamente o conteúdo principal sem assistir o vídeo inteiro. Isso é particularmente útil para estudantes, profissionais e qualquer pessoa que queira extrair informações importantes de conteúdo de vídeo on-line de maneira eficiente. Essencialmente, os resumidores do YouTube permitem que os usuários maximizem o aprendizado e a ingestão de informações, minimizando o tempo gasto.
Ao final deste laboratório, você terá um aplicativo da Web funcional que pode gerar resumos de vídeos do YouTube. Você também vai entender melhor como usar a API Gemini, o SDK de IA Generativa do Google e integrá-los para criar um aplicativo da Web.
O aplicativo da Web vai ficar assim:
Basta fornecer um link para o vídeo do YouTube, e o Gemini fará o resto.
2. Antes de começar
Este codelab pressupõe que você já tenha um projeto na nuvem do Google Cloud com o faturamento ativado. Se você ainda não tiver, siga as instruções abaixo para começar.
- No console do Google Cloud, na página de seletor de projetos, selecione ou crie um projeto do Google Cloud.
- Verifique se o faturamento está ativado para o projeto na nuvem do Google Cloud. Saiba como verificar se o faturamento está ativado em um projeto.
- Você vai usar o Cloud Shell, um ambiente de linha de comando em execução no Google Cloud. Para acessá-lo, clique em Ativar o Cloud Shell na parte de cima do console do Google Cloud.
- Depois de se conectar ao Cloud Shell, verifique se você já está autenticado e se o projeto está definido como o ID do seu projeto usando o comando a seguir:
gcloud auth list
- Execute o comando a seguir no Cloud Shell para confirmar se o comando gcloud sabe sobre seu projeto.
gcloud config list project
- Se o projeto não estiver definido, use este comando:
gcloud config set project <YOUR_PROJECT_ID>
Como alternativa, também é possível conferir o ID PROJECT_ID no console.
Clique nele para conferir todo o projeto e o ID do projeto no lado direito.
- Verifique se as APIs a seguir estão ativadas. Use o comando a seguir para defini-las:
- API Vertex AI
- API Cloud Run Admin
- API Cloud Build
- API Resource Manager
gcloud services enable aiplatform.googleapis.com \
run.googleapis.com \
cloudbuild.googleapis.com \
cloudresourcemanager.googleapis.com
A alternativa ao uso do comando gcloud é acessar o console usando este link. Consulte a documentação para ver o uso e os comandos gcloud.
Pré-requisitos
- Capacidade de ler e escrever códigos Python e HTML
- Conforto ao trabalhar com a API Gemini e o SDK de IA Generativa do Google
- Entendimento do desenvolvimento full-stack básico
O que você vai aprender
- Como criar uma API de back-end com tecnologia do Gemini usando a biblioteca de API Flask
- Como criar um app de IA generativa que vincule o front-end e o back-end
- Como implantar o aplicativo de IA generativa desenvolvido no Cloud Run
O que é necessário
- Um computador em funcionamento com uma rede Wi-Fi confiável
- Uma mente curiosa
3. Criar um app Python Flask no Cloud Run
Vamos criar o app Python Flask no Cloud Run usando primeiro o modelo gerado automaticamente no Cloud Shell.
Navegue até o terminal do Cloud Shell e clique no botão "Abrir editor". 
Verifique se o projeto do Cloud Code está definido no canto inferior esquerdo (barra de status) do editor do Cloud Shell, conforme destacado na imagem abaixo, e se está definido como o projeto ativo do Google Cloud em que o faturamento está ativado. Autorize se solicitado.
OBSERVAÇÕES: pode levar um tempo após a inicialização do editor do Cloud Shell e carregar todos os plug-ins necessários para que
Cloud Code - Sign In
o botão apareça. Tenha paciência
Clique no projeto ativo na barra de status e aguarde a abertura do pop-up do Cloud Code. No pop-up, selecione "Novo aplicativo". 
Na lista de aplicativos, escolha Aplicativo Cloud Run:
Na página 2/2, selecione o modelo Python Flask:
Forneça o nome do projeto como quiser (por exemplo, "amazing-gemini-app") e clique em OK:
Isso vai abrir o modelo do novo projeto que você acabou de configurar.
É assim que é simples criar um app Python Flask no Cloud Run com o Google Cloud Shell.
4. Criar o front-end
Como afirmado anteriormente, o aplicativo da Web final vai ficar assim:
Ele contém um campo de entrada para receber um link do YouTube do usuário, uma opção para escolher uma família de modelos diferente, uma área de texto para fornecer um comando adicional, se necessário, e um botão para enviar o formulário.
Se você gosta do desafio, crie seu próprio formulário ou edite as propriedades CSS. Você também pode copiar o código abaixo e substituir o conteúdo do arquivo index.html na pasta templates por ele.
<!DOCTYPE html>
<html>
<head>
<title>YouTube Summarizer</title>
<style>
body {
font-family: sans-serif;
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
background-color: #f4f4f4;
}
.container {
background-color: white;
padding: 30px;
border-radius: 8px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
text-align: center;
}
h2 {
text-align: center;
margin-bottom: 20px;
}
input[type="text"], textarea, select {
width: 100%;
padding: 10px;
margin-bottom: 15px;
border: 1px solid #ccc;
border-radius: 4px;
box-sizing: border-box;
}
button {
background-color: #4CAF50;
color: white;
padding: 12px 20px;
border: none;
border-radius: 4px;
cursor: pointer;
}
</style>
</head>
<body>
<div class="container">
<h2>YouTube Summarizer</h2>
<form action="/summarize" target="_blank" method="post">
<input type="text" name="youtube_link" placeholder="Enter YouTube Link">
<select name="model">
<option value="gemini-2.0-flash-001">Gemini 2.0 Flash</option>
</select>
<textarea name="additional_prompt" placeholder="Write your additional prompt here. For example: 'explain to me like I am five years old'"></textarea>
<button type="submit">Summarize</button>
</form>
</div>
</body>
</html>
Para testar se você fez essa etapa corretamente, clique com o botão direito do mouse em app.py e escolha Executar arquivo Python no terminal.
Se tudo correr bem, você poderá acessar o aplicativo da Web clicando no botão Web Preview no canto superior direito do editor do Cloud e selecionando Preview on port 8080.
5. Criar o back-end
Depois que o front-end for configurado, você precisará criar um serviço de back-end que use o modelo do Gemini para resumir o vídeo do YouTube fornecido pelo usuário. Observe que você vai substituir o app.py para concluir essa tarefa.
Antes de mudar o código, você precisará criar um ambiente virtual e instalar as bibliotecas necessárias para executar os componentes do Gemini.
Primeiro, adicione a biblioteca do SDK de IA Generativa do Google ao arquivo requirements.txt. Ele vai ficar assim:
Flask==2.3.3
requests==2.31.0
debugpy # Required for debugging.
google-genai==1.2.0
Em segundo lugar, crie um ambiente virtual e instale os pacotes de requirements.txt para que você possa executar o código de back-end com sucesso.
- Clique nas barras no canto superior esquerdo e escolha Terminal > Novo terminal ( como alternativa, você pode usar
Ctrl + Shift + Cpara abrir um novo terminal).
2. Crie um ambiente virtual digitando no terminal e aguarde a instalação ser concluída.
python -m venv venv source venv/bin/activate pip install -r requirements.txt
Novamente, sinta-se à vontade para se desafiar e criar um endpoint do Gemini usando a API Flask. O código em app.py precisa ser semelhante ao fornecido abaixo.
import os
from flask import Flask, render_template, request
from google import genai
from google.genai import types
app = Flask(__name__)
PROJECT_ID = "REPLACE_WITH_YOUR_PROJECT_ID"
client = genai.Client(
vertexai=True,
project=PROJECT_ID,
location="us-central1",
)
# Define the home page route.
@app.route('/', methods=['GET'])
def index():
'''
Renders the home page.
Returns:The rendered template.
'''
return render_template('index.html')
def generate(youtube_link, model, additional_prompt):
# Prepare youtube video using the provided link
youtube_video = types.Part.from_uri(
file_uri=youtube_link,
mime_type="video/*",
)
# If addtional prompt is not provided, just append a space
if not additional_prompt:
additional_prompt = " "
# Prepare content to send to the model
contents = [
youtube_video,
types.Part.from_text(text="""Provide a summary of the video."""),
additional_prompt,
]
# Define content configuration
generate_content_config = types.GenerateContentConfig(
temperature = 1,
top_p = 0.95,
max_output_tokens = 8192,
response_modalities = ["TEXT"],
)
return client.models.generate_content(
model = model,
contents = contents,
config = generate_content_config,
).text
@app.route('/summarize', methods=['GET', 'POST'])
def summarize():
'''
Summarize the user provided YouTube video.
Returns: Summary.
'''
# If the request is a POST request, process the form data.
if request.method == 'POST':
youtube_link = request.form['youtube_link']
model = request.form['model']
additional_prompt = request.form['additional_prompt']
# Generate the summary.
try:
summary = generate(youtube_link, model, additional_prompt)
return summary
except ValueError as e:
raise e
# If the request is a GET request, redirect to the home page.
else:
return redirect('/')
if __name__ == '__main__':
server_port = os.environ.get('PORT', '8080')
app.run(debug=False, port=server_port, host='0.0.0.0')
Em essência, o código faz o seguinte:
Importa as bibliotecas necessárias:
- Flask: para criar o aplicativo da Web.
- os: para acesso a variáveis de ambiente.
- google.genai: para interagir com a IA do Gemini do Google.
- google.genai.types: para definir estruturas de dados para o Gemini.
Inicialização do cliente do Gemini:
- Ele configura uma conexão com a Vertex AI do Google, permitindo que o app use o modelo de IA do Gemini. Substitua "REPLACE_WITH_YOUR_PROJECT_ID" pelo ID do seu projeto.
Como definir a função de geração:
- Essa função usa um link de vídeo do YouTube, um ID de modelo do Gemini e um comando adicional como entrada. Em seguida, ele envia o vídeo e o comando para o Gemini e retorna o texto de resumo gerado.
Como definir a rota da página inicial (/)
- Essa função renderiza o modelo index.html, que exibe um formulário para o usuário inserir um link do YouTube.
Como definir a rota de resumo (/summarize)
- Essa função processa envios de formulários. Ele recupera o link do YouTube, o modelo e o comando do formulário, chama a função de geração para receber o resumo e, em seguida, exibe o resumo no modelo result.html.
Como executar o aplicativo
- Ele recupera a porta do servidor das variáveis de ambiente e inicia o servidor da Web do Flask.
Você pode testar o código executando o app.py no terminal. O mesmo método de teste do front-end. Clique com o botão direito do mouse em app.py e escolha Executar arquivo Python no terminal.
Continue e teste seu aplicativo. Ele precisa funcionar conforme o esperado.
6. Implantar o aplicativo da Web
Agora que você tem o aplicativo de IA generativa funcional, vamos implantá-lo no Cloud Run para que você possa compartilhá-lo com seus amigos e colegas para testar.
Navegue até o terminal do Cloud Shell e verifique se o projeto atual está configurado para o projeto ativo. Caso contrário, use o comando gcloud configure para definir o ID do projeto:
gcloud config set project [PROJECT_ID]
Não se esqueça de substituir [PROJECT_ID] pelo ID do seu projeto. Verifique se o diretório de trabalho atual no terminal é **amazing-gemini-app**. Em seguida, insira os comandos a seguir em ordem, um por um:
gcloud run deploy --source .
Você vai receber uma solicitação para inserir um nome para o serviço, digamos "youtube-summarizer". Escolha o número correspondente para a região "us-central1". Diga "y" quando perguntar se você quer permitir invocações não autenticadas. Estamos permitindo o acesso não autenticado aqui porque este é um aplicativo de demonstração. A recomendação é usar a autenticação adequada para seus aplicativos empresariais e de produção.
Quando a implantação for concluída, você vai receber um link semelhante ao abaixo:
https://amazing-gemini-app-*******.a.run.app/
Continue e use seu aplicativo na janela anônima ou no dispositivo móvel. Ele já deve estar ativo.
7. Desafio
Agora é sua hora de brilhar. Você tem o que é preciso para mudar o código e fazer upload de vídeos diretamente do seu computador?
8. Liberar espaço
Para evitar cobranças na sua conta do Google Cloud pelos recursos usados neste codelab, siga estas etapas:
- No console do Google Cloud, acesse a página Gerenciar recursos.
- Na lista de projetos, selecione o projeto que você quer excluir e clique em Excluir.
- Na caixa de diálogo, digite o ID do projeto e clique em Desligar para excluir o projeto.
- Como alternativa, acesse o Cloud Run no console do Google Cloud, selecione o serviço que você acabou de implantar e exclua.