arrow_back

Serverlose Apps mit Firebase entwickeln: Challenge-Lab

Anmelden Teilnehmen
Test and share your knowledge with our community!
done
Get access to over 700 hands-on labs, skill badges, and courses

Serverlose Apps mit Firebase entwickeln: Challenge-Lab

Lab 1 Stunde universal_currency_alt 5 Guthabenpunkte show_chart Mittelstufe
Test and share your knowledge with our community!
done
Get access to over 700 hands-on labs, skill badges, and courses

GSP344

Logo: Google Cloud-Labs zum selbstbestimmten Lernen

Übersicht

In einem Challenge-Lab geht es um ein bestimmtes Szenario mit mehreren Aufgaben. Anders als bei einem normalen Lab erhalten Sie jedoch keine Schritt-für-Schritt-Anleitung, sondern nutzen die in den Labs des jeweiligen Kurses erlernten Fähigkeiten, um die Aufgaben selbst zu lösen. Ihre Lösungen werden automatisch bewertet. Die erzielten Punkte finden Sie rechts oben auf dieser Seite.

In Challenge-Labs werden keine neuen Grundlagen zu Google Cloud vermittelt. Sie sollen dabei Ihr Wissen erweitern und es wird erwartet, dass Sie beispielsweise Standardwerte ändern und Fehlermeldungen lesen und recherchieren, um Ihre eigenen Fehler zu beheben.

Die volle Punktzahl erreichen Sie nur, wenn Sie alle Aufgaben innerhalb der vorgegebenen Zeit lösen.

Dieses Lab wird Teilnehmern empfohlen, die sich für den Kurs Develop Serverless Apps with Firebase angemeldet haben. Sind Sie bereit?

Einrichtung und Anforderungen

Vor dem Klick auf „Start Lab“ (Lab starten)

Lesen Sie diese Anleitung. Labs sind zeitlich begrenzt und können nicht pausiert werden. Der Timer beginnt zu laufen, wenn Sie auf Lab starten klicken, und zeigt Ihnen, wie lange die Ressourcen für das Lab verfügbar sind.

In diesem praxisorientierten Lab können Sie die Lab-Aktivitäten in einer echten Cloud-Umgebung selbst durchführen – nicht in einer Simulations- oder Demo-Umgebung. Dazu erhalten Sie neue, temporäre Anmeldedaten, mit denen Sie für die Dauer des Labs auf Google Cloud zugreifen können.

Für dieses Lab benötigen Sie Folgendes:

  • Einen Standardbrowser (empfohlen wird Chrome)
Hinweis: Nutzen Sie den privaten oder Inkognitomodus, um dieses Lab durchzuführen. So wird verhindert, dass es zu Konflikten zwischen Ihrem persönlichen Konto und dem Teilnehmerkonto kommt und zusätzliche Gebühren für Ihr persönliches Konto erhoben werden.
  • Zeit für die Durchführung des Labs – denken Sie daran, dass Sie ein begonnenes Lab nicht unterbrechen können.
Hinweis: Wenn Sie über ein persönliches Google Cloud-Konto oder -Projekt verfügen, verwenden Sie es nicht für dieses Lab. So werden zusätzliche Kosten für Ihr Konto vermieden.

Umgebung bereitstellen

  1. Verknüpfen Sie das Projekt:
gcloud config set project $(gcloud projects list --format='value(PROJECT_ID)' --filter='qwiklabs-gcp')
  1. Klonen Sie das Repository:
git clone https://github.com/rosera/pet-theory.git

Das Szenario

In diesem Lab erstellen Sie mit einer REST API und einer Firestore-Datenbank eine Frontend-Lösung. Cloud Firestore ist eine NoSQL-Dokumentendatenbank auf der Firebase-Plattform, in der Sie Daten für Mobil‑ und Web-Apps im großen Maßstab speichern, synchronisieren und abfragen können. Das Lab basiert auf einem realen Szenario, in dem serverlose Infrastruktur von Google Cloud eingesetzt wird.

Sie erstellen diese Architektur:

Diagramm der Anwendungsarchitektur

Aufgabe 1: Firestore-Datenbank erstellen

In diesem Szenario erstellen Sie eine Firestore-Datenbank in Google Cloud. Dieses Diagramm zeigt die allgemeine Architektur.

Architekturdiagramm für das Firebase-Challenge-Lab

Voraussetzungen:

Feld Wert
Cloud Firestore Nativer Modus
Standort

Firestore-Datenbank erstellen

Führen Sie die folgenden Aufgaben aus:

  • Cloud Firestore-Datenbank erstellen
  • Firestore im nativen Modus verwenden
  • Standort hinzufügen

Klicken Sie auf Fortschritt prüfen. Firestore-Datenbank erstellen

Aufgabe 2: Datenbank füllen

In diesem Szenario werden Testdaten in die Datenbank eingefügt.

Dieses Diagramm zeigt die allgemeine Architektur.

Architektur für das Firebase-Challenge-Lab

Datenbank füllen

Firestore-Beispielschema:

Sammlung Dokument Feld
data 70234439 [dataset]

Das Dataset Netflix Movies and TV Shows enthält die folgenden Informationen:

Feld Beschreibung
show_id: Eindeutige ID des Films / der Serie
type: Kennzeichnung (Film oder Serie)
title: Titel des Films / der Serie
director: Regisseur
cast: Schauspieler
country: Land, in dem der Film / die Serie produziert wurde
date_added: Datum, ab dem der Film / die Serie auf Netflix verfügbar ist
release_year: Veröffentlichungsjahr des Films / der Serie
rating: Altersempfehlung des Films / der Serie
duration: Gesamtdauer in Minuten oder Anzahl der Staffeln

Führen Sie die folgenden Aufgaben aus:

  1. Verwenden Sie den Beispielcode unter pet-theory/lab06/firebase-import-csv/solution:
npm install
  1. Verwenden Sie zum Importieren der CSV-Datei den Knoten pet-theory/lab06/firebase-import-csv/solution/index.js:
node index.js netflix_titles_original.csv Hinweis: Prüfen Sie, ob die Firestore-Datenbank aktualisiert wurde, indem Sie die Daten in der Firestore-Benutzeroberfläche aufrufen.

Klicken Sie auf Fortschritt prüfen. Firestore-Datenbank füllen

Aufgabe 3: REST API erstellen

In diesem Szenario erstellen Sie eine Beispiel-REST API.

Dieses Diagramm zeigt die allgemeine Architektur.

Architekturdiagramm für das Firebase-Challenge-Lab

Cloud Run-Entwicklung

Feld Wert
Container Registry-Image: rest-api:0.1
Cloud Run-Dienst netflix-dataset-service
Berechtigung --allow-unauthenticated

Führen Sie die folgenden Aufgaben aus:

  1. Rufen Sie pet-theory/lab06/firebase-rest-api/solution-01 auf.
  2. Erstellen Sie den Code und stellen Sie ihn in Google Container Registry bereit.
  3. Stellen Sie das Image als Cloud Run-Dienst bereit.
Hinweis: Stellen Sie den Dienst mit maximal einer Instanz bereit, um das Limit für Cloud Run-Instanzen nicht zu überschreiten.
  1. Wechseln Sie zu Cloud Run und klicken Sie auf netflix-dataset-service. Kopieren Sie dann die Dienst-URL:
  • SERVICE_URL=copy url from your netflix-dataset-service
  • curl -X GET $SERVICE_URL sollte als Antwort ausgeben: {"status":"Netflix Dataset! Make a query."}

Klicken Sie auf Fortschritt prüfen. REST API bereitstellen und testen

Aufgabe 4: Firestore API-Zugriff

In diesem Szenario stellen Sie eine aktualisierte Version des Codes für den Zugriff auf die Firestore-Datenbank bereit.

Dieses Diagramm zeigt die allgemeine Architektur.

Architekturdiagramm für das Firebase-Challenge-Lab

Cloud Run Version 0.2 bereitstellen

Feld Wert
Container Registry-Image: rest-api:0.2
Cloud Run-Dienst netflix-dataset-service
Berechtigung --allow-unauthenticated

Führen Sie die folgenden Aufgaben aus:

  1. Rufen Sie pet-theory/lab06/firebase-rest-api/solution-02 auf.
  2. Erstellen Sie die aktualisierte Anwendung.
  3. Verwenden Sie Cloud Build, um die Image-Version zu taggen und in Container Registry bereitzustellen.
  4. Stellen Sie das neue Image als Cloud Run-Dienst bereit.
Hinweis: Stellen Sie den Dienst mit maximal einer Instanz bereit, um das Limit für Cloud Run-Instanzen nicht zu überschreiten.
  1. Wechseln Sie zu Cloud Run und klicken Sie auf netflix-dataset-service. Kopieren Sie dann die Dienst-URL:
  • SERVICE_URL=copy url from your netflix-dataset-service
  • curl -X GET $SERVICE_URL/2019 sollte ein JSON-Dataset zurückgeben.

Klicken Sie auf Fortschritt prüfen. REST API bereitstellen und testen

Aufgabe 5: Staging-Frontend bereitstellen

In diesem Szenario stellen Sie das Staging-Frontend bereit.

Dieses Diagramm zeigt die allgemeine Architektur.

Architekturdiagramm für das Firebase-Challenge-Lab

Frontend bereitstellen

Feld Wert
REST_API_SERVICE REST API-DIENST-URL
Container Registry-Image: frontend-staging:0.1
Cloud Run-Dienst frontend-staging-service

Führen Sie die folgenden Aufgaben aus:

  1. Rufen Sie pet-theory/lab06/firebase-frontend auf.
  2. Erstellen Sie die Frontend-Staging-Anwendung.
  3. Verwenden Sie Cloud Build, um die Image-Version zu taggen und in Container Registry bereitzustellen.
  4. Stellen Sie das neue Image als Cloud Run-Dienst bereit.
Hinweis: Stellen Sie den Dienst mit maximal einer Instanz bereit, um das Limit für Cloud Run-Instanzen nicht zu überschreiten.
  1. Greifen Sie über das Frontend auf die REST API und die Firestore-Datenbank zu.
  2. Rufen Sie die Frontend-Dienst-URL auf.
Hinweis: Für die angezeigten Einträge wird ein Demo-Dataset verwendet.

Webseite „Einführung in serverlose Lösungen“

Klicken Sie auf Fortschritt prüfen. Staging-Frontend bereitstellen

Aufgabe 6: Produktions-Frontend bereitstellen

In diesem Szenario bearbeiten Sie das Staging-Frontend, damit es die Firestore-Datenbank nutzt.

Dieses Diagramm zeigt die allgemeine Architektur.

Architekturdiagramm für das Firebase-Challenge-Lab

Frontend bereitstellen

Feld Wert
REST_API_SERVICE REST API-DIENST-URL
Container Registry-Image: frontend-production:0.1
Cloud Run-Dienst frontend-production-service

Führen Sie die folgenden Aufgaben aus:

  1. Rufen Sie pet-theory/lab06/firebase-frontend/public auf.
  2. Bearbeiten Sie die Frontend-Anwendung app.js so, dass sie die REST API verwendet.
  3. Denken Sie daran, das Jahr an die Dienst-URL anzuhängen.
  4. Verwenden Sie Cloud Build, um die Image-Version zu taggen und in Container Registry bereitzustellen.
  5. Stellen Sie das neue Image als Cloud Run-Dienst bereit. Hinweis: Stellen Sie den Dienst mit maximal einer Instanz bereit, um das Limit für Cloud Run-Instanzen nicht zu überschreiten.
  6. Greifen Sie über das Frontend auf die REST API und die Firestore-Datenbank zu.

Nachdem die Dienste bereitgestellt wurden, können Sie den Inhalt der Firestore-Datenbank mithilfe des Frontend-Diensts sehen.

Webseite „Einführung in serverlose Lösungen“

Klicken Sie auf Fortschritt prüfen. Produktions-Frontend bereitstellen

Glückwunsch!

Das wars! Sie haben das Lab erfolgreich abgeschlossen. Sie haben eine Firestore-Datenbank erstellt, Daten eingefügt, eine REST API erstellt und eine Frontend-Anwendung bereitgestellt, die mit der Firestore-Datenbank und der REST API interagiert. Außerdem haben Sie gelernt, wie eine Staging‑ und Produktions-Frontend-Anwendung bereitgestellt wird.

Skill-Logo „Develop Serverless Apps with Firebase“

Nächstes Skill-Logo erwerben

Dieses Lab zum selbstbestimmten Lernen ist Teil des Kurses Develop Serverless Apps with Firebase. Wenn Sie diesen Kurs abschließen, erhalten Sie das oben gezeigte Skill-Logo, das Sie in Ihren Lebenslauf oder Ihre Social-Media-Profile einfügen können. Teilen Sie Ihre Leistung mit #GoogleCloudBadge.

Google Cloud-Schulungen und -Zertifizierungen

In unseren Schulungen erfahren Sie alles zum optimalen Einsatz unserer Google Cloud-Technologien und können sich entsprechend zertifizieren lassen. Unsere Kurse vermitteln technische Fähigkeiten und Best Practices, damit Sie möglichst schnell mit Google Cloud loslegen und Ihr Wissen fortlaufend erweitern können. Wir bieten On-Demand-, Präsenz- und virtuelle Schulungen für Anfänger wie Fortgeschrittene an, die Sie individuell in Ihrem eigenen Zeitplan absolvieren können. Mit unseren Zertifizierungen weisen Sie nach, dass Sie Experte im Bereich Google Cloud-Technologien sind.

Anleitung zuletzt am 2. Mai 2024 aktualisiert

Lab zuletzt am 2. Mai 2024 getestet

© 2024 Google LLC. Alle Rechte vorbehalten. Google und das Google-Logo sind Marken von Google LLC. Alle anderen Unternehmens- und Produktnamen können Marken der jeweils mit ihnen verbundenen Unternehmen sein.