GSP1201

Overview

This lab demonstrates how to create and deploy an AI-powered chat application using Cloud Run on Google Cloud. The chat application is powered by the Gemini Large Language Model's (LLM) APIs.

You leverage the APIs in a web application and deploy it to Cloud Run, using Cloud Build and Artifact Repository to store the container image of the application build. The application can be used as a starting point for web interfaces using the Gemini APIs.

In this lab, you create a web application that runs on Cloud Run which utilizes APIs provided by the Gemini Large Language Model (LLM) and surfaces them through a simple web interface deployed in the lab.

By creating the application, you gain an understanding of how to build a web application which can utilize Large Language Models, like Gemini, to create engaging, conversation based interactions with end users who can asks questions and receive insightful responses through the chat application.

What you'll learn

In this lab, you do the following:

• Build a Docker image to run the application using Cloud Build.
• Deploy a Cloud Run service that executes the application.
• Review python code to understand how the application utilizes the gemini-2.0-flash model via a chat session.

Setup and requirements

Before you click the Start Lab button

Read these instructions. Labs are timed and you cannot pause them. The timer, which starts when you click Start Lab, shows how long Google Cloud resources are made available to you.

This hands-on lab lets you do the lab activities in a real cloud environment, not in a simulation or demo environment. It does so by giving you new, temporary credentials you use to sign in and access Google Cloud for the duration of the lab.

To complete this lab, you need:

• Access to a standard internet browser (Chrome browser recommended).

Note: Use an Incognito (recommended) or private browser window to run this lab. This prevents conflicts between your personal account and the student account, which may cause extra charges incurred to your personal account.

• Time to complete the lab—remember, once you start, you cannot pause a lab.

Note: Use only the student account for this lab. If you use a different Google Cloud account, you may incur charges to that account.

How to start your lab and sign in to the Google Cloud console

1. Click the Start Lab button. If you need to pay for the lab, a dialog opens for you to select your payment method. On the left is the Lab Details pane with the following:

   • The Open Google Cloud console button
   • Time remaining
   • The temporary credentials that you must use for this lab
   • Other information, if needed, to step through this lab

2. Click Open Google Cloud console (or right-click and select Open Link in Incognito Window if you are running the Chrome browser).

   The lab spins up resources, and then opens another tab that shows the Sign in page.

   Tip: Arrange the tabs in separate windows, side-by-side.

   Note: If you see the Choose an account dialog, click Use Another Account.

3. If necessary, copy the Username below and paste it into the Sign in dialog.

   {{{user_0.username | "Username"}}}

   You can also find the Username in the Lab Details pane.

4. Click Next.

5. Copy the Password below and paste it into the Welcome dialog.

   {{{user_0.password | "Password"}}}

   You can also find the Password in the Lab Details pane.

6. Click Next.

   Important: You must use the credentials the lab provides you. Do not use your Google Cloud account credentials. Note: Using your own Google Cloud account for this lab may incur extra charges.

7. Click through the subsequent pages:

   • Accept the terms and conditions.
   • Do not add recovery options or two-factor authentication (because this is a temporary account).
   • Do not sign up for free trials.

After a few moments, the Google Cloud console opens in this tab.

Note: To access Google Cloud products and services, click the Navigation menu or type the service or product name in the Search field.

Activate Cloud Shell

Cloud Shell is a virtual machine that is loaded with development tools. It offers a persistent 5GB home directory and runs on the Google Cloud. Cloud Shell provides command-line access to your Google Cloud resources.

1. Click Activate Cloud Shell at the top of the Google Cloud console.

2. Click through the following windows:

   • Continue through the Cloud Shell information window.
   • Authorize Cloud Shell to use your credentials to make Google Cloud API calls.

When you are connected, you are already authenticated, and the project is set to your Project_ID, . The output contains a line that declares the Project_ID for this session:

Your Cloud Platform project in this session is set to {{{project_0.project_id | "PROJECT_ID"}}}

gcloud is the command-line tool for Google Cloud. It comes pre-installed on Cloud Shell and supports tab-completion.

3. (Optional) You can list the active account name with this command:

gcloud auth list

4. Click Authorize.

Output:

ACTIVE: * ACCOUNT: {{{user_0.username | "ACCOUNT"}}} To set the active account, run: $ gcloud config set account `ACCOUNT`

5. (Optional) You can list the project ID with this command:

gcloud config list project

Output:

[core] project = {{{project_0.project_id | "PROJECT_ID"}}} Note: For full documentation of gcloud, in Google Cloud, refer to the gcloud CLI overview guide.

Task 1. Environment setup

To deploy the Cloud Run application, you download the source from a Cloud Storage bucket.

1. In Cloud Shell, enter the following command.

gsutil cp -R gs://spls/gsp1201/chat-flask-cloudrun .

2. Next, navigate to the project folder.

cd chat-flask-cloudrun

3. Set the region and project environment variables to use in later commands.

export PROJECT_ID={{{ project_0.project_id | "Filled in at lab startup." }}} export REGION={{{ project_0.startup_script.region | "Filled in at lab startup." }}}

Task 2. Build a Docker image

Next, you build a Docker image for the application and push it to Artifact Registry. Once the container image is built and stored, you reference it to deploy the application to Cloud Run.

1. Set environment variables to use in later commands:

export AR_REPO='chat-app-repo' export SERVICE_NAME='chat-flask-app'

2. Run the following command to create the Artifact Repository:

gcloud artifacts repositories create "$AR_REPO" --location="$REGION" --repository-format=Docker

3. Configure Docker authentication and submit the container image build job to Cloud Build:

gcloud builds submit --tag "$REGION-docker.pkg.dev/$PROJECT_ID/$AR_REPO/$SERVICE_NAME"

4. To verify that the image is pushed to the Artifact Registry, go to the Artifact Registry page.
   • In the Google Cloud console title bar, type Artifact Registry into the Search field, and then click Artifact Registry from the search results.
   • Confirm the chat-app-repo is available.

Note: If you run the check below and see that you require authenticating Docker. Try running the following command in Cloud Shell:

gcloud auth configure-docker us-central1-docker.pkg.dev

Click Check my progress to verify the objective. Build a Docker image

Task 3. Deploy the application to Cloud Run

The application has been downloaded and built via Cloud Build. Now you deploy and test it on Cloud Run.

1. In Cloud Shell, run the following command:

gcloud run deploy "$SERVICE_NAME" --port=8080 --image="$REGION-docker.pkg.dev/$PROJECT_ID/$AR_REPO/$SERVICE_NAME:latest" --allow-unauthenticated --region=$REGION --platform=managed --project=$PROJECT_ID --set-env-vars=GCP_PROJECT=$PROJECT_ID,GCP_REGION=$REGION Note: This step takes a few minutes to complete.

2. To launch the application, click the service URL provided in the output of the last command. The output looks similar to the output below:

Deploying container to Cloud Run service [chat-flask-app] in project [qwiklabs-gcp-03-fda25c1691e3] region [us-central1] OK Deploying new service... Done. OK Creating Revision... OK Routing traffic... OK Setting IAM Policy... Done. Service [chat-flask-app] revision [chat-flask-app-00001-x9r] has been deployed and is serving 100 percent of traffic. Service URL: https://chat-flask-app-308034796843.us-central1.run.app

3. Enter the following query into the input text box and click Send:

What is Google Cloud Platform?

You receive a response generated by the gemini-2.0-flash API in the output text box below the prompt input.

Click Check my progress to verify the objective. Deploy the application to Cloud Run

Task 4. Explore the Python code

To understand more about how the application utilizes the Gemini Chat Bison API, you briefly explore the code used by the app.

1. In Cloud Shell, click Open Editor which opens Cloud Shell Editor for you to browse the code with.

2. In the Explore pane, expand the folder chat-flask-cloudrun and select app.py to begin exploring the code.

3. Notice the following Python methods:

• create_session: this method creates a new session with Vertex AI using the chat_model = GenerativeModel("gemini-2.0-flash") model. It is used by the route /gemini which you will observe further to establish a new chat session.

def create_session(): chat_model = GenerativeModel("gemini-2.0-flash") chat = chat_model.start_chat() return chat

• response: this method retrieves a response.

def response(chat, message): result = chat.send_message(message) return result.text

• index and gemini_chat: the index and gemini_chat methods define routes for the application's API. The index method loads the index.html page when a user loads the application and the gemini_chat method submits the user's prompt collected from the index.html page to the API and returns the results in JSON format.

@app.route('/') def index(): ### return render_template('index.html') @app.route('/gemini', methods=['GET', 'POST']) def gemini_chat(): user_input = "" if request.method == 'GET': user_input = request.args.get('user_input') else: user_input = request.form['user_input'] logger.log(f"Starting chat session...") chat_model = create_session() logger.log(f"Chat Session created") content = response(chat_model,user_input) return jsonify(content=content)

The index.html file includes inline JavaScript to read the results from the form submission when a user clicks Send and updates the UI with the response of the Gemini API call.

Congratulations!

You have now completed the lab! In this lab, you learned how to build and deploy a simple web application using Cloud Build and Artifact Registry. The application is deployed to Cloud Run and utilizes Gemini to respond to end user queries to create a chat based application that allows end users to ask questions and receive responses in a web UI.

Next steps

• Check out the Generative AI on Vertex AI documentation.
• Learn more about Generative AI on the Google Cloud Tech YouTube channel.

Google Cloud training and certification

...helps you make the most of Google Cloud technologies. Our classes include technical skills and best practices to help you get up to speed quickly and continue your learning journey. We offer fundamental to advanced level training, with on-demand, live, and virtual options to suit your busy schedule. Certifications help you validate and prove your skill and expertise in Google Cloud technologies.

Manual Last Updated May 14, 2025

Lab Last Tested May 14, 2025

Copyright 2025 Google LLC. All rights reserved. Google and the Google logo are trademarks of Google LLC. All other company and product names may be trademarks of the respective companies with which they are associated.