1. 개요
이 실습에서는 Google의 생성형 AI 제품을 사용하여 Gemini Cloud Assist의 도움을 받아 Google Cloud에 인프라를 구축하고, 자연어를 사용하여 BigQuery 데이터를 Data Canvas의 SQL 기능에 쿼리하고, Gemini Code Assist의 도움을 받아 Colab Enterprise Jupyter 노트북과 Eclipse Theia (Visual Studio Code)에서 코드를 작성하고, Cloud Storage 및 BigQuery 기반 소스에 구축된 AI 검색 및 채팅 기능을 Vertex AI Agent Builder에 통합합니다.
AI Recipe Haven이라는 레시피 및 요리 웹사이트를 만드는 것이 목표입니다. 이 사이트는 Python 및 Streamlit로 빌드되며 두 개의 주요 페이지가 포함됩니다. Cooking Advice는 Gemini와 레시피북 그룹에 연결된 Vertex AI Agent Builder 기반 소스를 사용하여 만들 챗봇을 호스팅하고, 요리 관련 조언을 제공하고 요리 관련 질문에 답변합니다. Recipe Search는 Gemini에서 제공하는 검색엔진으로, 이번에는 BigQuery 레시피 데이터베이스를 기반으로 합니다.
이 연습의 코드 중에서 막히는 부분이 있으면 모든 코드 파일의 솔루션이 연습 GitHub 저장소의 solution 브랜치에 있습니다.
목표
이 실습에서는 다음 작업을 수행하는 방법을 알아봅니다.
- Gemini Cloud Assist 활성화 및 사용
- Vertex AI Agent Builder에서 요리 조언 챗봇을 위한 검색 앱 만들기
- Gemini Code Assist를 사용하여 Colab Enterprise 노트북에 데이터를 로드하고 정리
- Vertex AI Agent Builder에서 레시피 생성기를 위한 검색 앱 만들기
- Gemini의 도움을 받아 핵심 Python 및 Streamlit 웹 애플리케이션의 프레임 설정
- Cloud Run에 웹 애플리케이션 배포
- 레시피북 검색 Agent Builder 앱에 Cooking Advice 페이지 연결
- (선택사항) 레시피 검색 페이지를 레시피 검색 Agent Builder 앱에 연결
- (선택사항) 최종 애플리케이션 살펴보기
2. 기본 요건
- 아직 Google 계정이 없다면 Google 계정을 만들어야 합니다.
- 직장 또는 학교 계정이 아닌 개인 계정을 사용합니다. 직장 및 학교 계정에는 이 실습에 필요한 API를 사용 설정할 수 없도록 하는 제한사항이 있을 수 있습니다.
3. 프로젝트 설정
- Google Cloud 콘솔에 로그인합니다.
- Cloud 콘솔에서 결제를 사용 설정합니다.
- 이 실습을 완료하는 데 드는 Cloud 리소스 비용은 미화 1달러 미만입니다.
- 이 실습의 끝에 있는 단계에 따라 리소스를 삭제하면 추가 비용이 발생하지 않습니다.
- 신규 사용자는 미화 300달러 상당의 무료 체험판을 이용할 수 있습니다.
- 가상 실무형 실습 이벤트에 참석하시나요? 미화 5달러 상당의 크레딧이 제공될 수 있습니다.
- 새 프로젝트를 만들거나 기존 프로젝트를 재사용합니다.
- Cloud Billing의 내 프로젝트에서 결제가 사용 설정되어 있는지 확인합니다.
- 새 프로젝트의
Billing account열에Billing is disabled가 표시되면 다음 단계를 따르세요.Actions열에서 점 3개를 클릭합니다.- 결제 변경을 클릭합니다.
- 사용할 결제 계정을 선택합니다.
- 라이브 이벤트에 참석하는 경우 계정 이름이 Google Cloud Platform 평가판 결제 계정일 수 있습니다.
- 새 프로젝트의
4. Gemini Cloud Assist 활성화 및 사용
이 작업에서는 Gemini Cloud Assist를 활성화하고 사용해 봅니다. Gemini Cloud Assist는 Google Cloud 콘솔에서 작업하는 동안 조언을 제공하고, Google Cloud 인프라를 빌드, 구성, 모니터링하는 데 도움을 주며, gcloud 명령어를 제안하고 Terraform 스크립트를 작성할 수도 있습니다.
- Cloud Assist를 사용 설정하려면 Cloud Console UI 상단의 검색창을 클릭하고 Gemini에게 물어보기 또는 Gemini에게 Cloud 콘솔에 관해 물어보기를 선택합니다.
- 페이지의 필수 API 섹션으로 스크롤하여 Google Cloud를 위한 Gemini API를 사용 설정합니다.
- 채팅 인터페이스가 즉시 표시되지 않으면 채팅 시작을 클릭합니다. 먼저 Gemini에게 Cloud Shell 편집기 사용의 몇 가지 이점을 설명해 달라고 요청합니다. 생성된 대답을 잠시 살펴봅니다.
- 다음으로 Agent Builder의 이점과 생성형 응답을 실현하는 데 어떻게 도움이 되는지 묻습니다.
- 마지막으로 비교를 살펴보겠습니다. Google Cloud 콘솔의 Gemini 채팅 창에서 다음 질문을 합니다.
What are the major steps to creating a search app grounded in a GCS data source using Vertex AI Agent builder?
5. Vertex AI Agent Builder에서 요리 조언 챗봇을 위한 검색 앱 만들기
빌드 중인 웹사이트에는 사용자가 요리 관련 질문에 대한 답변을 찾을 수 있도록 설계된 챗봇이 포함된 요리 조언 페이지가 있습니다. 이 도구는 70개의 공개 도메인 레시피북이 포함된 소스에 기반을 둔 Gemini를 기반으로 합니다. 레시피북은 Gemini가 질문에 답변할 때 사용하는 정보 소스로 작동합니다.
- Cloud 콘솔 검색창을 사용하여 Vertex AI로 이동합니다. 대시보드에서 모든 권장 API 사용 설정을 클릭합니다. 몇 분 정도 소요될 수 있습니다. Vertex AI API 자체를 사용 설정해야 한다는 팝업 상자가 표시되면 이 API도 사용 설정합니다. API가 사용 설정되면 다음 단계로 이동할 수 있습니다.
- 검색을 사용하여 Agent Builder로 이동한 다음 계속 및 API 활성화를 클릭합니다.
- 앞서 조언을 구할 때 Gemini에서 제안했듯이 Agent Builder에서 검색 앱을 만들려면 공신력 있는 데이터 소스를 만들어야 합니다. 사용자가 검색하면 Gemini는 질문과 지능형 대답을 작성하는 방법을 이해하지만, Gemini는 선천적인 지식을 가져오는 대신 그라운딩된 소스에서 해당 대답에 사용되는 정보를 찾습니다.왼쪽 메뉴에서 데이터 스토어 및 데이터 스토어 만들기로 이동합니다.
- 요리 조언 페이지의 기반으로 사용 중인 공개 도메인 레시피북은 현재 외부 프로젝트의 Cloud Storage 버킷에 있습니다. Cloud Storage 소스 유형을 선택합니다.
- 가져오는 정보 유형과 관련된 기본 옵션을 검토하되 변경하지는 않습니다. 가져오기 유형을 폴더로 설정하고 버킷 경로에
labs.roitraining.com/labs/old-cookbooks를 사용한 다음 계속을 클릭합니다. - 데이터 스토어 이름을
old-cookbooks로 지정합니다. 수정을 클릭하고 ID를old-cookbooks-id로 변경한 후 데이터 스토어를 만들기합니다.
Vertex AI Agent Builder는 여러 앱 유형을 지원하며 데이터 스토어는 각각의 정보 소스로 작동합니다. 검색 앱은 일반적인 용도와 검색에 적합합니다. 채팅 앱은 Dataflow 기반 챗봇/보이스봇 애플리케이션의 생성형 흐름을 위한 것입니다. 맞춤 콘텐츠 앱은 더 나은 맞춤 콘텐츠 엔진을 만드는 데 도움이 됩니다. 에이전트 앱은 생성형 AI 기반 에이전트를 만드는 데 사용됩니다. 결국에는 상담사가 Google에서 하고자 하는 작업에 가장 적합할 수 있지만 현재 제품이 미리보기 버전이므로 검색 앱 유형을 계속 사용할 예정입니다.
- 왼쪽 메뉴를 사용하여 앱으로 이동한 다음 새 앱 만들기를 클릭합니다.
- 웹사이트 검색 카드에서 만들기를 클릭합니다. 앱 이름을
cookbook-search로 지정합니다. 수정을 클릭하고 앱 ID를cookbook-search-id로 설정합니다. 회사를Google로 설정하고 계속을 클릭합니다. - 몇 단계 전에 만든 old-cookbooks 데이터 스토어를 선택하고 검색 앱을 만듭니다.
활동 탭을 살펴보면 아직 레시피북이 가져오고 색인을 생성하고 있는 것을 볼 수 있습니다. Agent Builder가 제공된 70개의 레시피북에 포함된 수천 개의 페이지에 색인을 생성하는 데 5분 이상 걸립니다. 작동하는 동안 레시피 생성기의 레시피 데이터베이스 데이터를 로드하고 정리해 보겠습니다.
6. Gemini Code Assist를 사용하여 Colab Enterprise 노트북에 데이터를 로드하고 정리
Google Cloud에서는 Jupyter 노트북을 사용할 수 있는 몇 가지 주요 방법을 제공합니다. Google의 최신 제품인 Colab Enterprise를 사용합니다. 무료 환경에서 Jupyter 노트북을 실험하려는 개인 및 조직에서 흔히 사용하는 Google의 Colab 제품을 알고 계신 분도 있을 것입니다. Colab Enterprise는 Google의 다른 클라우드 제품과 완전히 통합되어 있으며 GCP 환경의 보안 및 규정 준수 기능을 최대한 활용하는 상용 Google Cloud 제품입니다.
Colab Enterprise에서 제공하는 기능 중 하나는 Google의 Gemini Code Assist와의 통합입니다. Code Assist는 다양한 코드 편집기에서 사용할 수 있으며 코딩하는 동안 조언과 원활한 인라인 추천을 제공할 수 있습니다. 레시피 데이터를 처리하는 동안 이 생성형 어시스턴트를 활용합니다.
- 검색을 사용하여 Colab Enterprise로 이동하고 노트북 만들기를 클릭합니다. 새로운 Colab 기능을 실험해 보라는 메시지가 표시되면 닫습니다. 메모장의 컴퓨팅 성능인 런타임을 사용 설정하려면 새 메모장의 오른쪽 상단에 있는 연결을 클릭합니다.
- 파일 > 이름 바꾸기를 클릭하여 노트북 이름을
Data Wrangling로 바꿉니다.
- + 텍스트를 클릭하여 새 텍스트 상자를 만들고 위쪽 화살표를 사용하여 페이지의 첫 번째 셀이 되도록 텍스트 상자를 이동합니다.
- 텍스트 상자를 수정하고 다음을 입력합니다.
# Data Wrangling Import the Pandas library - 방금 만든 텍스트 블록 아래의 코드 블록에서
imp를 입력하기 시작하면 Gemini Code Assist가 나머지 가져오기를 회색으로 제안합니다. 탭 키를 눌러 제안사항을 수락합니다.import pandas as pd - 가져오기 코드 상자 아래에 텍스트 상자를 하나 더 만들고 다음을 입력합니다.
Create a Pandas DataFrame from: gs://labs.roitraining.com/labs/recipes/recipe_dataset.csv. View the first few records. - 다른 코드 블록을 만들고 수정합니다. 다시
df =를 입력하고 Gemini Code Assistant에서 생성된 코드를 살펴봅니다. 생성된 추천 위로 Python 키워드의 자동 완성 드롭리스트가 표시되면 Esc 키를 눌러 밝은 회색 추천 코드를 확인합니다. 탭 키를 다시 눌러 제안사항을 수락합니다. 추천에head()함수 호출이 포함되지 않은 경우 추가합니다.df = pd.read_csv('gs://labs.roitraining.com/labs/recipes/recipe_dataset.csv') df.head() - Pandas를 가져온 첫 번째 코드 셀을 클릭하고 명령어 메뉴 또는 키보드를 사용하여 선택한 셀을 실행합니다. 키보드에서 shift+enter를 누르면 셀이 실행되고 포커스가 다음 셀로 이동하며 필요한 경우 셀이 생성됩니다. 계속하기 전에 셀이 실행될 때까지 기다립니다.참고: 셀이 실행되지 않은 경우 왼쪽에 [ ] 가 표시됩니다. 셀이 실행되는 동안 작동하는 회전 애니메이션이 표시됩니다. 셀이 완료되면 [13]과 같은 숫자가 표시됩니다.
- CSV를 DataFrame에 로드하는 셀을 실행합니다. 파일이 로드될 때까지 기다린 후 데이터의 처음 5개 행을 살펴봅니다. 이 데이터는 BigQuery에 로드할 레시피 데이터이며, 나중에 레시피 생성기를 기반으로 하는 데 사용됩니다.
- 새 코드 블록을 만들고 아래 주석을 입력합니다. 주석을 입력한 후 다음 코드 줄로 이동하면
df.columns제안이 표시됩니다. 수락한 다음 셀을 실행합니다.# List the current DataFrame column names - 열을 정리해 보겠습니다.
Unnamed: 0열 이름을id로,link열 이름을uri로 바꿉니다. 원하는 프롬프트 > 코드 기법을 사용하여 코드를 만든 다음 만족스러우면 셀을 실행합니다.# Rename the column 'Unnamed: 0' to 'id' and 'link' to 'uri' df.rename(columns={'Unnamed: 0': 'id', 'link': 'uri'}, inplace=True) source및NER열을 삭제하고head()를 사용하여 처음 몇 행을 확인합니다. 다시 Gemini를 사용하여 도움을 받으세요. 마지막 두 줄을 실행하고 결과를 살펴봅니다.# Remove the source and NER columns df.drop(columns=['source', 'NER'], inplace=True) df.head()- 데이터 세트에 있는 레코드 수를 확인해 보겠습니다. 다시 한번 프롬프트 기법을 선택하고 Gemini를 사용하여 코드를 생성할 수 있는지 확인합니다.
# Count the records in the DataFrame df.shape # count() will also work - 223만 개의 레코드는 처리할 시간이 충분하지 않을 수 있습니다. 오늘 연습에서는 Agent Builder의 색인 생성 프로세스가 너무 오래 걸릴 수 있습니다. 절충안으로 150,000개의 레시피를 샘플링하여 사용해 보겠습니다. 프롬프트 > 코드 접근 방식을 사용하여 샘플을 가져와
dfs(소문자 s)라는 새 DataFrame에 저장합니다.# Sample out 150,000 records into a DataFrame named dfs dfs = df.sample(n=150000) - 레시피 소스 데이터를 BigQuery에 로드할 준비가 되었습니다. 로드하기 전에 BigQuery로 이동하여 테이블을 보관할 데이터 세트를 준비해 보겠습니다. Google Cloud 콘솔에서 검색창을 사용하여 BigQuery로 이동합니다. BigQuery를 마우스 오른쪽 버튼으로 클릭하고 새 브라우저 탭에서 열 수 있습니다.
- 아직 표시되지 않으면 Cloud 콘솔 오른쪽 상단의 Gemini 로고를 사용하여 Gemini AI Chat 패널을 엽니다. API를 다시 사용 설정하라는 메시지가 표시되면 사용 설정을 누르거나 페이지를 새로고침합니다. 프롬프트를 실행합니다.
What is a dataset used for in BigQuery?응답 질문을 살펴본 후How can I create a dataset named recipe_data using the Cloud Console?결과를 다음 몇 가지 단계와 비교합니다.
- BigQuery 탐색기 창에서 프로젝트 ID 옆에 있는 점 3개 작업 보기 메뉴를 클릭합니다. 그런 다음 데이터 세트 만들기를 선택합니다.
- 데이터 세트 및 ID를
recipe_data로 지정합니다. 위치 유형을 미국으로 두고 데이터 세트 만들기를 클릭합니다. 데이터 세트가 이미 존재한다는 오류가 표시되면 계속 진행합니다.BigQuery에서 데이터 세트를 만들었으므로 노트북으로 다시 전환하여 삽입을 진행해 보겠습니다. - Colab Enterprise에서 데이터 처리 노트북으로 다시 전환합니다. 새 코드 셀에서
project_id라는 변수를 만들고 이를 사용하여 현재 프로젝트 ID를 보관합니다. 이 안내의 왼쪽 상단에 있는 실습 종료 버튼 아래에서 현재 프로젝트 ID를 찾을 수 있습니다. 원하는 경우 Cloud Console 홈페이지에서도 확인할 수 있습니다. 값을project_id변수에 할당하고 셀을 실행합니다.# Create a variable to hold the current project_id project_id='YOUR_PROJECT_ID' - 프롬프트 > 코드 접근 방식을 사용하여 방금 만든 데이터 세트
recipe_data의recipes라는 테이블에 DataFramedfs를 삽입하는 코드 블록을 만듭니다. 셀을 실행합니다.dfs.to_gbq(destination_table='recipe_data.recipes', project_id=project_id, if_exists='replace')
7. Vertex AI Agent Builder에서 레시피 생성기를 위한 검색 앱 만들기
좋습니다. 레시피 데이터 테이블이 생성되었으므로 이를 사용하여 레시피 생성기의 기반 데이터 소스를 빌드해 보겠습니다. 사용할 접근 방식은 요리 챗봇에 사용한 것과 유사합니다. Vertex AI Agent Builder를 사용하여 데이터 스토어를 만든 다음 이를 검색 앱의 정보 소스로 사용합니다.
원하는 경우 Google Cloud 콘솔에서 Gemini에게 상담사 빌더 검색 앱을 만드는 단계를 알려 달라고 요청하거나 아래에 나와 있는 단계를 따르세요.
- 검색을 사용하여 에이전트 빌더로 이동합니다. 데이터 스토어 및 데이터 스토어 만들기를 엽니다. 이번에는 BigQuery 데이터 스토어 유형을 선택합니다.
- 테이블 선택 셀에서 찾아보기를 누르고
recipes를 검색합니다. 테이블 옆에 있는 라디오 버튼을 선택합니다. 다른 qwiklabs-gcp-... 프로젝트의 레시피가 표시되면 나에게 속한 레시피를 선택합니다.참고: 옆에 있는 라디오 버튼을 선택하는 대신recipes를 클릭하면 브라우저에 새 탭이 열리고 BigQuery의 테이블 개요 페이지로 이동합니다. 브라우저 탭을 닫고 Agent Builder에서 라디오 버튼을 선택하기만 하면 됩니다. - 나머지 기본 옵션을 검토하되 변경하지 않은 다음 계속을 클릭합니다.
- 스키마 검토 페이지에서 초기 기본 구성을 검토하지만 아무것도 변경하지 않습니다. 계속
- 데이터 스토어 이름을
recipe-data로 지정합니다. 데이터 스토어 ID를 수정하여recipe-data-id로 설정합니다. 데이터 스토어를 만듭니다. - 왼쪽 탐색 메뉴를 사용하여 앱 및 새 앱 만들기로 이동합니다.
- 웹사이트 검색 카드에서 만들기를 클릭합니다. 앱 이름을
recipe-search로 지정하고 수정을 클릭하여 ID를recipe-search-id로 설정합니다. 회사 이름을Google로 설정하고 계속을 클릭합니다. - 이번에는 recipe-data 데이터 소스를 확인합니다. 앱을 만듭니다.
데이터베이스 테이블에 색인이 생성되는 데 다소 시간이 걸립니다. 그동안 BigQuery의 새로운 데이터 캔버스를 실험해 보고 흥미로운 레시피를 찾아보겠습니다.
- 검색창을 사용하여 BigQuery로 이동합니다. BigQuery Studio 상단에서 가장 오른쪽 탭 옆에 있는 아래쪽 화살표를 클릭하고 데이터 캔버스를 선택합니다. 리전을 us-central1로 설정합니다.
- 데이터 검색을 클릭합니다. 데이터 캔버스 검색창에서
recipes를 검색하고Enter/Return를 눌러 검색한 후 테이블 이름 옆에 있는 캔버스에 추가 버튼을 클릭합니다. - 레시피 테이블의 시각적 표현이 BigQuery 데이터 캔버스에 로드됩니다. 테이블의 스키마를 살펴보고, 테이블의 데이터를 미리 보고, 기타 세부정보를 살펴볼 수 있습니다. 표 표현 아래에서 쿼리를 클릭합니다.
- 캔버스에 대략 일반적인 BigQuery 쿼리 대화상자가 로드되지만 한 가지 추가사항이 있습니다. 쿼리 창 위에 Gemini에 도움을 요청하는 데 사용할 수 있는 텍스트 상자가 있습니다. 샘플에서 케이크 레시피를 찾을 수 있는지 확인해 보겠습니다. 다음 프롬프트를 실행합니다 (텍스트를 입력하고
Enter/Return를 눌러 SQL 생성을 트리거).Please select the title and ingredients for all the recipes with a title that contains the word cake. - 생성된 SQL을 확인합니다. 만족스러우면 쿼리를 실행합니다.
- 괜찮은데? 계속하기 전에 다른 프롬프트와 쿼리를 자유롭게 실험해 보세요. 실험할 때는 구체적이지 않은 프롬프트를 사용해 효과가 있는 프롬프트와 그렇지 않은 프롬프트를 확인해 보세요. 예를 들어 다음 프롬프트가 표시됩니다.
Do I have any chili recipes?Do I have any chili recipes? Please include their title and ingredients.Do I have any chili recipes? Please include their title and ingredients, and ignore any recipes with mushrooms as an ingredient.
8. Cloud Shell 편집기 열기
- Cloud Shell 편집기로 이동합니다.
- 터미널이 화면 하단에 표시되지 않으면 다음과 같이 엽니다.
- 햄버거 메뉴
를 클릭합니다. - 터미널을 클릭합니다.
- 새 터미널을 클릭합니다.
- 햄버거 메뉴
- 터미널에서 다음 명령어를 사용하여 프로젝트를 설정합니다.
- 형식:
gcloud config set project [PROJECT_ID] - 예:
gcloud config set project lab-project-id-example - 프로젝트 ID를 기억할 수 없는 경우 다음 안내를 따르세요.
- 다음을 사용하여 모든 프로젝트 ID를 나열할 수 있습니다.
gcloud projects list | awk '/PROJECT_ID/{print $2}'
- 다음을 사용하여 모든 프로젝트 ID를 나열할 수 있습니다.
- 형식:
- 승인하라는 메시지가 표시되면 승인을 클릭하여 계속 진행합니다.
- 다음 메시지가 표시되어야 합니다.
Updated property [core/project].
WARNING이 표시되고Do you want to continue (Y/N)?메시지가 표시되면 프로젝트 ID를 잘못 입력했을 가능성이 큽니다.N를 누른 다음Enter를 누르고gcloud config set project명령어를 다시 실행해 봅니다.
9. API 사용 설정
터미널에서 API를 사용 설정합니다.
gcloud services enable \
compute.googleapis.com \
sqladmin.googleapis.com \
run.googleapis.com \
artifactregistry.googleapis.com \
cloudbuild.googleapis.com \
networkconnectivity.googleapis.com \
servicenetworking.googleapis.com \
cloudaicompanion.googleapis.com
승인하라는 메시지가 표시되면 승인을 클릭하여 계속 진행합니다.
이 명령어를 완료하는 데 몇 분 정도 걸릴 수 있지만, 결국 다음과 유사한 성공 메시지가 표시됩니다.
Operation "operations/acf.p2-73d90d00-47ee-447a-b600" finished successfully.
10. Gemini의 도움을 받아 핵심 Python 및 Streamlit 웹 애플리케이션의 프레임 설정
Vertex AI Agent Builder 데이터 스토어의 색인이 생성되고 검색 앱이 거의 준비되었으므로 이제 웹 애플리케이션을 빌드해 보겠습니다.
작업하는 동안 Gemini Code Assist를 활용할 예정입니다. Visual Studio Code에서 Gemini Code Assist를 사용하는 방법에 관한 자세한 내용은 여기의 문서를 참고하세요.
- Cloud Shell 편집기 터미널에서 이 명령어를 실행하여 레시피 앱 저장소를 클론합니다.
git clone https://github.com/haggman/recipe-app - 이 명령어를 실행하면 Cloud Shell 편집기에서 애플리케이션 폴더가 열립니다.
cloudshell open-workspace recipe-app/ - 클론된 폴더를 살펴보고 웹 애플리케이션 작업을 시작하기 전에 편집기의 Cloud Code 플러그인을 Google Cloud에 로그인하고 Gemini를 사용 설정해야 합니다. 그럼 시작하겠습니다. 편집기 왼쪽 하단에서 Cloud Code - 로그인을 클릭합니다. 링크가 표시되지 않으면 1분 정도 기다린 후 다시 확인하세요.
- 터미널 창에 긴 URL이 표시됩니다. 브라우저에서 URL을 열고 단계에 따라 Cloud Code에 Google Cloud 환경에 대한 액세스 권한을 부여합니다. 마지막 대화상자에서 인증 코드를 복사하여 Cloud Shell 편집기 브라우저 탭의 대기 중인 터미널 창에 다시 붙여넣습니다.
- 잠시 후 편집기 왼쪽 하단의 Cloud Code 링크가 Cloud Code - No Project(Cloud Code - 프로젝트 없음)로 변경됩니다. 새 링크를 클릭하여 프로젝트를 선택합니다. 편집기 상단에 명령 팔레트가 열립니다. Google Cloud 프로젝트 선택을 클릭하고 프로젝트를 선택합니다. 잠시 후 편집기 왼쪽 하단의 링크가 업데이트되어 프로젝트 ID가 표시됩니다. 이는 Cloud Code가 작업 프로젝트에 연결되었음을 나타냅니다.
- Cloud Code가 프로젝트에 연결되었으므로 이제 Gemini Code Assist를 활성화할 수 있습니다. 편집기 인터페이스의 오른쪽 하단에서 취소선이 그어진 Gemini 로고를 클릭합니다. 편집기 왼쪽에 Gemini Chat 창이 열립니다. Google Cloud 프로젝트 선택을 클릭합니다. 명령어 팔레트가 열리면 프로젝트를 선택합니다. 단계를 올바르게 수행했고 Google에서 아무것도 변경하지 않은 경우 이제 활성 Gemini 채팅 창이 표시됩니다.
- 좋습니다. 터미널, Gemini 채팅, Cloud Code 구성이 모두 설정되었습니다. 탐색기 탭을 열고 잠시 시간을 내어 현재 프로젝트의 파일을 살펴보세요.
- 탐색기에서 수정할
requirements.txt파일을 엽니다. Gemini 채팅 창으로 전환하여 다음과 같이 요청합니다.From the dependencies specified in the requirements.txt file, what type of application are we building? - 이제 Python과 Streamlit을 사용하여 Vertex AI 및 Discovery Engine과 상호작용하는 대화형 웹 애플리케이션을 빌드합니다. 지금은 웹 애플리케이션 구성요소에 중점을 두겠습니다. Gemini에서 설명하는 것처럼 Streamlit은 Python으로 데이터 기반 웹 애플리케이션을 빌드하기 위한 프레임워크입니다. 이제 다음을 요청합니다.
Does the current project's folder structure seem appropriate for a Streamlit app?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 - Streamlit에 대해 자세히 알아보겠습니다.
What can you tell me about Streamlit? - 단점을 알아보려면 다음과 같이 질문할 수 있습니다.
What are the major downsides or shortcomings?
11. Cloud Run에 웹 애플리케이션 배포
좋습니다. 핵심 애플리케이션 구조가 마련되었습니다. 제대로 작동하나요? 더 나아가 Google Cloud에서 어디에 호스팅해야 하나요?
- Gemini 채팅 창에서 다음을 요청합니다.
If I containerize this application, what compute technologies in Google Cloud would be best for hosting it? - 아직 IDE에서 작업하고 있지 않은 경우 Google Cloud Assist를 사용할 수도 있습니다. Google Cloud 콘솔을 연 다음 Gemini Cloud Assist를 열고 다음과 같이 요청합니다.
If I have a containerized web application, where would be the best place to run it in Google Cloud? - 스테이트리스(Stateless)의 단기 컨테이너화된 웹 애플리케이션의 경우 Cloud Run이 적합합니다. 코드 편집기의 Gemini 채팅 창에서 다음 프롬프트를 사용해 보세요.
What steps would be required to run this application in Cloud Run? - 먼저 Dockerfile을 만들어야 할 것 같습니다. 편집기를 사용하여 프로젝트 폴더의 루트에
Dockerfile라는 파일을 만듭니다. 실수로 pages 폴더에 배치하지 않도록 주의하세요. 수정할 파일을 엽니다. - 측면 Gemini 채팅 패널을 사용하여 Dockerfile을 만들어 보겠습니다. 아래와 같은 프롬프트를 사용합니다. 결과가 채팅에 표시되면 추천 Dockerfile 바로 위에 있는 복사 아이콘 옆의 +를 사용하여 추천 코드를 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.# 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"] recipe-app폴더에서Dockerfile이라는 파일을 만들고 다음 콘텐츠를 붙여넣습니다.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"]- Gemini는 채팅 창을 통해 작동할 수 있지만, 데이터 처리 노트북에서 사용한 것처럼 주석을 사용하여 코드 파일에서 직접 작동할 수도 있습니다. Windows의 경우 Control+i, Mac의 경우 Command+i를 사용하여 호출할 수도 있습니다.
Dockerfile의 아무 곳이나 클릭하고 적절한 Command+i / Control+i 명령어를 사용하여 Gemini를 활성화합니다. - 프롬프트에서 아래를 입력합니다. 변경사항을 검토하고 수락합니다.
Please comment the current file. - 이제 Gemini에게 Cloud Run을 사용하여 현재 폴더의 Dockerfile에서
recipe-web-app라는 새 이미지를 빌드하고 배포하는 방법을 물어봅니다.How could I use gcloud to build a new Cloud Run service named recipe-web-app from the current directory? - 애플리케이션을 빌드하고 배포해 보겠습니다. 터미널 창에서
gcloud run deploy명령어를 실행합니다.gcloud run deploy recipe-web-app \ --allow-unauthenticated \ --source=. \ --region=us-central1 \ --port=8501enter/return를 누릅니다.Deploying from source requires an Artifact Registry Docker repository to store built containers. A repository named cloud-run-source-deploy in region us-central1 will be created. Do you want to continue (Y/n)?
- 빌드 프로세스를 보면 먼저 Artifact Registry Docker 저장소가 빌드됩니다. 그런 다음 Cloud Build를 사용하여 로컬 폴더의 Dockerfile에서 컨테이너 이미지를 만듭니다. 마지막으로 Docker 이미지가 새 Cloud Run 서비스에 배포됩니다. 스크립트 끝에 사용할 Cloud Run 테스트 URL이 표시됩니다.
브라우저의 새 탭에서 반환된 링크를 엽니다. 잠시 시간을 내어 애플리케이션의 구조와 페이지를 살펴보세요. 좋습니다. 이제 생성형 AI 기능을 연결해야 합니다.
12. 레시피북 검색 Agent Builder 앱에 Cooking Advice 페이지 연결
웹 애플리케이션의 프레임워크가 실행되고 있지만 두 작업 페이지를 두 개의 Vertex AI Agent Builder 검색 앱에 연결해야 합니다. 먼저 '요리 조언'부터 살펴보겠습니다.
- Cloud Shell 편집기 탭을 열어 둡니다. Google Cloud 콘솔에서 검색을 사용하여 Vertex AI의 채팅으로 이동합니다.
- 오른쪽 설정 페이지 창에서 모델을 gemini-1.5-flash-002로 설정합니다. 필요한 경우 모델이 더 긴 대답을 반환할 수 있도록 출력 토큰 한도를 최대로 슬라이드합니다. 안전 필터 설정을 엽니다. 증오심 표현, 선정적인 콘텐츠, 괴롭힘 콘텐츠를 일부 차단으로 설정합니다. 위험한 콘텐츠를 소수 차단으로 설정하고 저장합니다. 칼과 자르기에 관해 이야기하는 것이 Gemini에서 폭력으로 오해될 수 있으므로 위험한 콘텐츠의 등급을 약간 낮추고 있습니다.
- 전환 버튼을 슬라이드하여 그라운딩을 사용 설정한 다음 맞춤설정을 클릭합니다. 그라운딩 소스를 Vertex AI Search로 설정하고 데이터 스토어 경로에는 다음을 사용합니다. 이 안내의 실습 종료 버튼 근처에 있는 프로젝트 ID로 YOUR_PROJECT_ID를 변경한 다음 접지 설정을 저장합니다.
projects/YOUR_PROJECT_ID/locations/global/collections/default_collection/dataStores/old-cookbooks-id - 몇 가지 채팅 메시지를 테스트합니다. 아래와 같이 시작해 보세요. 원하는 경우 다른 옵션을 몇 개 더 사용해 보세요.
How can I tell if a tomato is ripe? - 모델이 작동합니다. 이제 코드를 실험해 보겠습니다. 대화가 코드에 포함되지 않도록 대화 지우기를 클릭한 다음 코드 받기를 클릭합니다.
- 코드 창 상단에서 노트북 열기를 눌러 Colab Enterprise에서 코드를 실험하고 완성한 후 앱에 통합합니다.
- 잠시 시간을 내어 코드를 숙지하세요. 원하는 대로 조정하기 위해 몇 가지 변경사항을 적용해 보겠습니다. 시작하기 전에 첫 번째 코드 셀을 실행하여 컴퓨팅에 연결하고 AI Platform SDK를 설치합니다. 블록이 실행되면 세션을 다시 시작하라는 메시지가 표시됩니다. 메시지가 표시되면 안내를 따라 SSH 키를 생성합니다.
- Vertex AI Studio에서 가져온 코드로 이동합니다. multiturn_generate_content 메서드 이름을
start_chat_session로 변경합니다. model = GenerativeModel(메서드 호출로 스크롤합니다. 기존 코드는generation_config및safety_settings를 정의하지만 실제로는 사용하지 않습니다. 다음과 같이GenerativeModel생성을 수정합니다.model = GenerativeModel( "gemini-1.5-flash-002", tools=tools, generation_config=generation_config, safety_settings=safety_settings, )- 마지막으로, 함수가
chat객체를 반환하도록chat = model.start_chat()바로 아래에 메서드의 마지막 줄을 추가합니다. 완성된 함수는 아래와 같이 표시됩니다.참고: 이 코드를 노트북에 복사하지 마세요. 단순히 검증을 위해 여기에 있습니다.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 - 코드 셀 하단으로 스크롤하여 이전 함수를 호출하는 마지막 줄을 변경하여 새 함수 이름을 호출하고 반환된 객체를 변수
chat에 저장합니다. 변경사항에 만족하면 셀을 실행합니다.chat = start_chat_session() - 새 코드 셀을 만들고
# Use chat to invoke Gemini and print out the response주석을 추가합니다. 다음 줄로 이동하여resp를 입력하면 Gemini에서 블록을 자동 완성합니다. 프롬프트를How can I tell if a tomato is ripe?로 업데이트합니다. 셀 실행response = chat.send_message("How can I tell if a tomato is ripe?") print(response) - 응답은 맞지만, 실제로 원하는 부분은 중첩된
text필드입니다. 해당 섹션만 출력하도록 코드 블록을 수정합니다. 예를 들면 다음과 같습니다.response = chat.send_message("How can I tell if a tomato is ripe?") print(response.candidates[0].content.parts[0].text) - 좋습니다. 이제 작동하는 채팅 코드가 있으므로 웹 애플리케이션에 통합해 보겠습니다.
start_chat_session함수를 만드는 코드 셀의 모든 내용을 복사합니다 (테스트 셀은 필요하지 않음). 셀을 클릭하면 오른쪽 상단의 점 3개 메뉴를 클릭하고 거기에서 복사할 수 있습니다.
- Cloud Shell 편집기 탭으로 전환하고 수정할
pages\Cooking_Advice.py를 엽니다. - 댓글을 찾습니다.
# # Add the code you copied from your notebook below this message # - 복사한 코드를 코드 추가 주석 바로 아래에 붙여넣습니다. 좋습니다. 이제 Gemini에 대한 접지된 호출을 통해 채팅 엔진을 구동하는 섹션이 있습니다. 이제 Streamlit에 통합해 보겠습니다.
- 주석 바로 아래에 있는 주석 처리된 코드 섹션을 찾습니다.
# # Here's the code to setup your session variables # Uncomment this block when instructed # - 이 코드 섹션 (다음
Setup done, let's build the page UI섹션까지)의 주석을 해제하고 살펴봅니다. 채팅 및 기록 세션 변수를 만들거나 검색합니다. - 다음으로 기록 및 채팅 기능을 UI에 통합해야 합니다. 아래 주석이 표시될 때까지 코드를 스크롤합니다.
# # Here's the code to create the chat interface # Uncomment the below code when instructed # - 주석 아래의 나머지 코드의 주석 처리를 삭제하고 잠시 살펴봅니다. 원하는 경우 강조 표시하고 Gemini에 기능을 설명해 달라고 요청할 수 있습니다.
- 좋습니다. 이제 애플리케이션을 빌드하고 배포해 보겠습니다. URL이 다시 표시되면 애플리케이션을 실행하고 Cooking Advisor 페이지를 사용해 봅니다. 익은 토마토에 관해 물어보거나 브뤼셀 겨자로 맛있는 요리를 만드는 방법을 물어볼 수 있습니다.
gcloud run deploy recipe-web-app \ --allow-unauthenticated \ --source=. \ --region=us-central1 \ --port=8501
정말 멋지네요. 나만의 AI 요리 어드바이저 :-)
13. (선택사항) 레시피 검색 페이지를 레시피 검색 Agent Builder 앱에 연결
Cooking Advice 페이지를 기반 소스에 연결할 때 Gemini API를 직접 사용했습니다. 레시피 검색의 경우 Vertex AI Agent Builder 검색 앱에 직접 연결해 보겠습니다.
- Cloud Shell 편집기에서 수정할
pages/Recipe_Search.py페이지를 엽니다. 페이지 구조를 조사합니다. - 파일 상단에서 프로젝트 ID를 설정합니다.
search_sample함수를 검사합니다. 이 코드는 거의 여기에 있는 디스커버리 엔진 문서에서 직접 가져온 것입니다. 작동하는 사본은 여기의 노트북에서 확인할 수 있습니다.단지 결과 대신response.results를 반환하도록 변경했을 뿐입니다. 이 옵션이 없으면 반환 유형은 결과를 페이지로 나누도록 설계된 객체가 되며 이는 기본 애플리케이션에 필요하지 않습니다.- 파일 끝까지 스크롤하고
Here are the first 5 recipes I found아래의 전체 섹션에서 주석 처리를 삭제합니다. - 방금 주석 처리를 해제한 전체 섹션을 강조 표시하고 Gemini Code 채팅을 엽니다.
Explain the highlighted code님, 문의해 주세요. 선택한 항목이 없으면 Gemini가 전체 파일을 설명할 수 있습니다. 섹션을 강조 표시하고 Gemini에게 설명, 의견, 개선을 요청하면 Gemini가 이를 실행합니다.잠시 시간을 내어 설명을 읽어보세요. Colab Enterprise 노트북을 사용하면 Gemini API를 애플리케이션에 통합하기 전에 살펴볼 수 있습니다. 특히 문서화되지 않았거나 문서화 상태가 좋지 않은 최신 API를 살펴볼 때 유용합니다. - 편집기 터미널 창에서
build.sh를 실행하여 최종 애플리케이션을 배포합니다. 새 버전이 배포될 때까지 기다린 후 다음 단계로 이동합니다.
14. (선택사항) 최종 애플리케이션 살펴보기
잠시 시간을 내어 최종 애플리케이션을 살펴보세요.
- Google Cloud 콘솔에서 검색을 사용하여
Cloud Run로 이동한 다음 recipe-web-app을 클릭합니다. - 애플리케이션 테스트 URL (상단)을 찾아 새 브라우저 탭에서 엽니다.
- 애플리케이션 홈페이지가 표시됩니다. Streamlit에서 제공하는 기본 레이아웃과 탐색을 확인합니다.
pages폴더의 Python 파일이 탐색 옵션으로 표시되고Home.py가 홈페이지로 로드됩니다. 조리 조언 페이지로 이동합니다. - 잠시 후 채팅 인터페이스가 표시됩니다. Streamlit에서 제공하는 멋진 핵심 레이아웃을 다시 한번 살펴보세요.
- 몇 가지 요리 관련 질문을 시도해 보고 봇이 작동하는 방식을 확인해 보세요. 다음과 같은 형식입니다.
Do you have any advice for preparing broccoli? How about a classic chicken soup recipe? Tell me about meringue. - 이제 레시피를 한두 개 찾아보겠습니다. 레시피 검색 페이지로 이동하여 몇 가지 검색어를 검색해 봅니다. 다음과 같은 형식입니다.
Chili con carne Chili, corn, rice Lemon Meringue Pie A dessert containing strawberries
15. 축하합니다.
Vertex AI Agent Builder 애플리케이션을 활용하는 애플리케이션을 만들었습니다. 이 과정에서 Gemini Cloud Assist, Gemini Code Assist, BigQuery 데이터 캔버스의 자연어-SQL 기능을 살펴봤습니다. 앞으로의 활동이 더욱 기대됩니다.
삭제
Cloud SQL에는 무료 등급이 없으며 계속 사용하면 요금이 청구됩니다. Cloud 프로젝트를 삭제하여 추가 비용이 청구되지 않도록 할 수 있습니다.
Cloud Run에서는 서비스를 사용하지 않을 때 비용이 청구되지 않지만 Artifact Registry에 컨테이너 이미지를 저장하는 데 요금이 부과될 수 있습니다. Cloud 프로젝트를 삭제하면 해당 프로젝트 내에서 사용되는 모든 리소스에 대한 청구가 중단됩니다.
원하는 경우 프로젝트를 삭제합니다.
gcloud projects delete $GOOGLE_CLOUD_PROJECT
CloudShell 디스크에서 불필요한 리소스를 삭제할 수도 있습니다. 다음과 같은 작업을 할 수 있습니다.
- Codelab 프로젝트 디렉터리를 삭제합니다.
rm -rf ~/task-app - 경고 다음 작업은 실행취소할 수 없습니다. Cloud Shell에서 모든 항목을 삭제하여 공간을 확보하려면 전체 홈 디렉터리를 삭제하면 됩니다. 보관하려는 모든 항목이 다른 곳에 저장되어 있는지 확인합니다.
sudo rm -rf $HOME