Overview

An App Engine app is a single application resource with one or more services. Each service can be configured to use different runtimes and to operate with different performance settings. Within each service, you can deploy versions of that service, and each then runs within one or more instances, depending on how much traffic you configured it to handle. For more information, see the An Overview of App Engine article.

App Engine uses either a Standard or Flexible environment. A standard environment runs instances in a sandbox, limiting available CPU options and disc access.

In contrast, a flexible environment runs your application in Docker containers on Google Compute Engine virtual machines (VMs), which have fewer restrictions. For example, you can use the programming language or library of your choice, write to disk, and even run multiple processes. You also have the choice of Compute Engine machine types for your instances. For more information about App Engine environments, see The App Engine Standard Environment and App Engine Flexible Environment.

In this lab, you deploy the Quiz application into an App Engine flexible environment, leveraging App Engine features, including versions and traffic splitting.

Objectives

In this lab, you learn how to perform the following tasks:

• Create an app.yaml file to describe the App Engine flexible environment requirements for an application.

• Deploy the quiz application into an App Engine flexible environment.

• Employ versions and traffic splitting to perform A/B testing of an application feature.

Setup and requirements

For each lab, you get a new Google Cloud project and set of resources for a fixed time at no cost.

1. Sign in to Qwiklabs using an incognito window.

2. Note the lab's access time (for example, 1:15:00), and make sure you can finish within that time.
   There is no pause feature. You can restart if needed, but you have to start at the beginning.

3. When ready, click Start lab.

4. Note your lab credentials (Username and Password). You will use them to sign in to the Google Cloud Console.

5. Click Open Google Console.

6. Click Use another account and copy/paste credentials for this lab into the prompts.
   If you use other credentials, you'll receive errors or incur charges.

7. Accept the terms and skip the recovery resource page.

Activate Google Cloud Shell

Google 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.

Google Cloud Shell provides command-line access to your Google Cloud resources.

1. In Cloud console, on the top right toolbar, click the Open Cloud Shell button.

   

2. Click Continue.

It takes a few moments to provision and connect to the environment. When you are connected, you are already authenticated, and the project is set to your PROJECT_ID. For example:

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

• You can list the active account name with this command:

gcloud auth list

Output:

Credentialed accounts: - @.com (active)

Example output:

Credentialed accounts: - google1623327_student@qwiklabs.net

• You can list the project ID with this command:

gcloud config list project

Output:

[core] project =

Example output:

[core] project = qwiklabs-gcp-44776a13dea667a6 Note: Full documentation of gcloud is available in the gcloud CLI overview guide .

Task 1. Prepare the case study application

In this section, you access Cloud Shell, clone the git repository containing the Quiz application, configure environment variables, and run the application.

Clone source code in Cloud Shell

1. Clone the repository for the class:

git clone https://github.com/GoogleCloudPlatform/training-data-analyst

2. Create a soft link as a shortcut to your working directory:

ln -s ~/training-data-analyst/courses/developingapps/v1.3/python/appengine ~/appengine

Configure the Quiz application

1. Change to the directory that contains the sample files for this lab:

cd ~/appengine/start

2. Run the executable file by by running the following command:

. prepare_environment.sh Note: Ignore the warning and re-run the command if you are getting OperationError. Proceed with the lab ahead as some resources already exist.

This script file:

• Creates an App Engine application.

• Creates a Cloud Storage bucket.

• Exports environment variables GCLOUD_PROJECT and GCLOUD_BUCKET.

• Creates a virtualenv isolated Python environment for Python 3 and activates it.

• Updates pip and runs pip install -r requirements.txt.

• Creates entities in Datastore.

• Creates IAM role and service accounts.

• Creates a Pub/Sub topic.

• Creates a Spanner Instance, Database, and Table.

• Creates a Cloud Function.

• Prints out the Project ID.

Review the code

In this lab you'll view and edit files. You can use the shell editors that are installed on Cloud Shell, such as nano or vim, or use gcloud, the integrated code editor.

In this section, you use the Cloud Shell text editor to review the Quiz application code.

Launch the Cloud Shell Editor

• From Cloud Shell, click Open Editor.

The integrated code editor launches in a separate tab of your browser, along with Cloud Shell.

Examine the code

• Navigate to /appengine/start.

The folder structure for the Quiz application reflects how the application will be deployed in App Engine. For example, the web application is in the frontend folder, so you'll see the configuration files for App Engine; app.yaml file is present in the frontend folder.

Task 2. Prepare application code for App Engine Flexible Environment deployment

Create the app.yaml file for the frontend

In this section, you modify the configuration files for deployment of the Quiz application frontend into an App Engine flexible environment.

1. In the Cloud Shell code editor, open frontend/app.yaml.

2. Add two key: value pairs, and set scaling to manual:

   runtime: python env: flex manual_scaling: instances: 1

• The first setting, runtime, indicates that you want to use the python runtime.

• The second setting, env, indicates that you want to use the flexible environment.

• The number of instances is set to 1. A production service should typically be allowed to scale to more instances.

3. Add a third configuration entry, entrypoint to the app.yaml file:

   entrypoint: "gunicorn -b 0.0.0.0:8080 quiz:app"

This value is the command-line that executes the Flask application, using the gunicorn HTTP server.

4. Add runtime_config:

runtime_config: python_version: 3

5. Add a final configuration entry, env_variables to the app.yaml file. Include a key GCLOUD_BUCKET and the value from the -media bucket in your project. Be sure to replace [GCLOUD_PROJECT] with the GCP Project ID found in the left panel of the lab:

env_variables: GCLOUD_BUCKET: "[GCLOUD_PROJECT]-media"

6. Save the file:

app.yaml

runtime: python env: flex manual_scaling: instances: 1 entrypoint: gunicorn -b 0.0.0.0:8080 quiz:app runtime_config: python_version: 3 env_variables: GCLOUD_BUCKET: "[GCLOUD_PROJECT]-media"

Deploy the frontend to App Engine flexible environment

1. In Cloud Shell, setting the request timeout for the cloud build:

gcloud config set app/cloud_build_timeout 1800

2. Deploy the quiz application to App Engine flexible environment:

   gcloud app deploy ./frontend/app.yaml

3. Enter Y to confirm.

   App Engine automatically packages, containerizes, and deploys the code.

   It will take up to 20 minutes to complete the deployment.

4. In the Cloud Platform Console, click Navigation menu > App Engine.

5. Click the link to your application in the top-right corner of the App Engine Dashboard.

   The link will be in the form https://<PROJECT_ID>.appspot.com.

   You should see your application.

   Click Check my progress to verify the objective.

Deploy the frontend to App Engine flexible environment.

Task 3. Update an App Engine Flexible Environment application

In this section you modify the application code and then redeploy the application.

Update the Quiz application

1. In the Cloud Shell code editor, open frontend/quiz/webapp/templates/home.html.

2. Add several exclamation points to the top-level heading:

{% extends 'master.html' %} {% block head %} <title>Quiz - Python</title> {% endblock %} {% block content %} <h1>Welcome to the Quite Interesting Quiz!!!!!!</h1> <div class="jumbotron"> <p>Welcome to the Quite Interesting Quiz where you can create a question, take a test or review feedback</p> </div> <h3 class="col-md-4"> <a href="/questions/add">Create Question</a></h3> <h3 class="col-md-4"> <a href="/client/">Take Test</a></h3> <h3 class="col-md-4"><a href="/leaderboard">Leaderboard</a></h3> {% endblock %}

This small change stands in for all the changes you might make when updating an application.

3. Save the file.

Deploy the updated application

1. In Cloud Shell, redeploy the App Engine application:

   gcloud app deploy ./frontend/app.yaml --no-promote \ --no-stop-previous-version

2. Enter Y to confirm.

   Notice the two additional flags in the command, which mean that the previous version will continue to receive traffic.

   It may take up to 20 minutes to complete the updates to the deployment.

   Click Check my progress to verify the objective.

   Deploy the updated application.

3. In the Console, click Navigation menu > App Engine > Dashboard.

4. Click on the application URL in the top-right corner of the window. You should see that your application still displays the old title.

5. In the App Engine window, click Versions. You may need to refresh the page until you see two versions of the applications.

   Note: The version ID is in the form yyyymmddthhmmss, so it's easy to see which is the new and which is the old version.

6. Click on both version links to see the new and old version of the quiz application.

   New version (notice those exclamation points!):

   

   Old version:

   

7. Enable the checkbox for both versions of the application, and click Split traffic.

   

8. Select the radio button to deliver versions randomly.

9. Configure the traffic split to deliver 50% of traffic to the old version, and 50% to the new version.

   

10. Click Save.

11. Return to the Dashboard, set Version to All versions and click the application link.

    You should see one version of the application.

12. Refresh the homepage a few times.

You should see that the homepage displays the old version approximately half the time, and the new version half the time.

Note: In real-world scenarios, you might start by delivering small amounts of traffic to the new version in a canary release, and would use either a cookie or IP address to ensure that a client viewed a single consistent version of the application.

End your lab

When you have completed your lab, click End Lab. Google Cloud Skills Boost removes the resources you’ve used and cleans the account for you.

You will be given an opportunity to rate the lab experience. Select the applicable number of stars, type a comment, and then click Submit.

The number of stars indicates the following:

• 1 star = Very dissatisfied
• 2 stars = Dissatisfied
• 3 stars = Neutral
• 4 stars = Satisfied
• 5 stars = Very satisfied

You can close the dialog box if you don't want to provide feedback.

For feedback, suggestions, or corrections, please use the Support tab.

Copyright 2022 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.