Instrukcje i wymagania dotyczące konfiguracji modułu
Chroń swoje konto i postępy. Zawsze używaj okna przeglądania prywatnego i danych logowania do modułu, kiedy go uruchamiasz.

App Dev - Deploying the Application into App Engine Flexible Environment: Node.js

Laboratorium 2 godz. universal_currency_alt Punkty: 5 show_chart Wprowadzające
info Ten moduł może zawierać narzędzia AI, które ułatwią Ci naukę.
Te treści nie są jeszcze zoptymalizowane pod kątem urządzeń mobilnych.
Dla maksymalnej wygody odwiedź nas na komputerze, korzystając z linku przesłanego e-mailem.

Overview

In this lab, you deploy the Quiz application into App Engine Flex, 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 Flex requirements for an application.
  • Deploy the quiz application into App Engine Flex.
  • 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 Google Skills 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.

    Highlighted Cloud Shell icon

  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:

Project ID highlighted in the Cloud Shell Terminal

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. Preparing 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 --depth=1 https://github.com/GoogleCloudPlatform/training-data-analyst
  1. Create a soft link as a shortcut to the working directory:
ln -s ~/training-data-analyst/courses/developingapps/v1.3/nodejs/appengine ~/appengine

Configure the case study application and review code

  1. Change the directory that contains the sample files for this lab:
cd ~/appengine/start
  1. Configure the Quiz application:
. prepare_environment.sh Note: This script file:
  • Creates an App Engine application.
  • Creates a Cloud Storage bucket.
  • Exports environment variables GCLOUD_PROJECT and GCLOUD_BUCKET.
  • Runs npm install.
  • Creates entities in Datastore.
  • Creates a Pub/Sub topic.
  • Creates a Spanner Instance, Database, and Table.
  • Creates a Cloud Function.
  • Prints out the Google Cloud Platform Project ID.
  1. In Cloud Shell, click Open Editor. If prompted, click Open in a new window.

  2. Navigate to appengine/start.

Note: The folder structure for the quiz application has changed to reflect how it is deployed in App Engine.

The web application is in a folder called frontend.

There are configuration files for App Engine; app.yaml and config.json in the frontend folder.

Click Check my progress to verify the objective. Preparing the Case Study Application

Task 2. Preparing application code for App Engine Flex deployment

In this section, you modify the configuration files for deployment of the quiz application frontend into App Engine Flex.

Create the app.yaml file for the frontend

  1. In the Cloud Shell code editor, open appengine/start/frontend/app.yaml.
  2. Add two key: value pairs, and set scaling to manual:
  • The first setting, runtime, indicates that you want to use the nodejs 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.

...frontend/app.yaml

runtime: nodejs env: flex manual_scaling: instances: 1
  1. Modify the appengine/start/frontend/config.json file to include a key GCLOUD_BUCKET, the value is the name of the -media bucket in your project, which is <GCP-Project-ID>-media.

...frontend/config.json

{ "GCLOUD_BUCKET" : "<REPLACE_WITH_BUCKET_NAME>" }
  1. Save the files.

Deploy the frontend to App Engine Flex

  1. In Cloud Shell, deploy the quiz application to App Engine Flex:
gcloud app deploy ~/appengine/start/frontend/app.yaml

If asked "Do you want to continue (Y/n)?" press Y.

Note: The App Engine automatically packages up the code, containerizes it, and deploys it.

It may take up to five minutes to complete the deployment.
  1. Wait for the deployment to be completed.
  2. In the Cloud Platform Console, on the Navigation menu, click App Engine.
  3. Click on the link to your application in the top-right corner of the App Engine Dashboard.
Note: The link is in the form https://<PROJECT_ID>.appspot.com.

You should see your application.
Deploy the frontend to App Engine Flex

Task 3. Updating an App Engine Flex 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 the appengine/start/frontend/web-app/views/home.pug file.
  2. Add several exclamation points to the top-level heading.

...frontend/web-app/views/home.pug

extends base.pug block content h1 Welcome to the Quite Interesting Quiz!!!!!!!!!! .jumbotron p Welcome to the Quite Interesting Quiz where you can create a question, take a test or review feedback h3.col-md-4 a(href="/questions/add") Create Question h3.col-md-4 a(href="/client/") Take Test h3.col-md-4 a(href="/leaderboard") Leaderboard Note: This small change stands in for all the changes you might make when updating an application.
  1. Save the file.

Deploy the updated application

  1. In Cloud Shell, redeploy the App Engine application:
gcloud app deploy ~/appengine/start/frontend/app.yaml --no-promote \ --no-stop-previous-version

If asked "Do you want to continue (Y/n)?" press Y.

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

It may take up to five minutes to complete the updates to the deployment.
  1. In the Cloud Platform Console, on the Navigation menu, click App Engine > Dashboard.
  2. Click on the application URL in the top-right corner of the window. You should see that your application still displays the old title.
  3. In the App Engine window, click Versions.
Note: You should see that there are two versions of the application. The version ID is in the form yyyymmddthhmmss, so it's easy to see which is the new and which is the old version.
  1. Click on the version link for the new version.
Note: You should see the new version of your application (with all the exclamation marks!).
  1. Use the checkboxes to select both versions of the application, and click Split traffic in the top-right of the Versions page.
  2. Configure the traffic allocation to deliver 50% of traffic to the old version, and 50% to the new version.
  3. Select the radio button to randomly split traffic to each versions.
  4. Click Save.
  5. Navigate to the site and refresh the homepage a few times.
Note: You should see that that the homepage displays the old version approximately half the time, and the new version half the time.

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.
Updating the App Engine Flex Application

Task 4. Bonus

In the bonus, you can explore activating the Cloud Debugger and Cloud Error Reporting features in your application. Use the steps from the Debugging Application Errors lab guide to:

  1. Create a Cloud Source Repository.
  2. Push the appropriate code into the repository.
  3. Set up Cloud Debugger and Cloud Error Reporting.
  4. Explore debug snapshots and logpoints.
  5. Explore Error Reporting.
  6. View Cloud Logging.
Note: Review

Which of the following statements about App Engine Flex and Container Engine are true?

  1. Both App Engine Flex and Container Engine use Docker containers.
  2. Both App Engine and Container Engine require a load balancer to be provisioned explicitly.
  3. Both App Engine and Container Engine serve traffic via an appspot.com domain.

Which mechanisms can you use to direct traffic splits with App Engine?

  1. Via the IP address
  2. Via a cookie
  3. Randomly
  4. Via authenticated username
  5. None of the above; this is not possible with App Engine

End your lab

When you have completed your lab, click End Lab. Google Skills 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 2026 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.

Zanim zaczniesz

  1. Moduły tworzą projekt Google Cloud i zasoby na określony czas.
  2. Moduły mają ograniczenie czasowe i nie mają funkcji wstrzymywania. Jeśli zakończysz moduł, musisz go zacząć od początku.
  3. Aby rozpocząć, w lewym górnym rogu ekranu kliknij Rozpocznij moduł.

Użyj przeglądania prywatnego

  1. Skopiuj podaną nazwę użytkownika i hasło do modułu.
  2. Kliknij Otwórz konsolę w trybie prywatnym.

Zaloguj się w konsoli

  1. Zaloguj się z użyciem danych logowania do modułu. Użycie innych danych logowania może spowodować błędy lub naliczanie opłat.
  2. Zaakceptuj warunki i pomiń stronę zasobów przywracania.
  3. Nie klikaj Zakończ moduł, chyba że właśnie został przez Ciebie zakończony lub chcesz go uruchomić ponownie, ponieważ spowoduje to usunięcie wyników i projektu.

Ta treść jest obecnie niedostępna

Kiedy dostępność się zmieni, wyślemy Ci e-maila z powiadomieniem

Świetnie

Kiedy dostępność się zmieni, skontaktujemy się z Tobą e-mailem

Jeden moduł, a potem drugi

Potwierdź, aby zakończyć wszystkie istniejące moduły i rozpocząć ten

Aby uruchomić moduł, użyj przeglądania prywatnego

Najlepszym sposobem na uruchomienie tego laboratorium jest użycie okna incognito lub przeglądania prywatnego. Dzięki temu unikniesz konfliktu między swoim kontem osobistym a kontem do nauki, co mogłoby spowodować naliczanie dodatkowych opłat na koncie osobistym.