Chargement...
Aucun résultat.

Mettez en pratique vos compétences dans la console Google Cloud

Instructions et exigences de configuration de l'atelier
Protégez votre compte et votre progression. Utilisez toujours une fenêtre de navigation privée et les identifiants de l'atelier pour exécuter cet atelier.

Développement d'applications : Stocker des données d'application dans Cloud Datastore – Node.js

Atelier 2 heures universal_currency_alt 5 crédits show_chart Débutant
info Cet atelier peut intégrer des outils d'IA pour vous accompagner dans votre apprentissage.
Ce contenu n'est pas encore optimisé pour les appareils mobiles.
Pour une expérience optimale, veuillez accéder à notre site sur un ordinateur de bureau en utilisant un lien envoyé par e-mail.

Présentation

Dans cet atelier, vous allez examiner l'application de l'étude de cas : un quiz en ligne. Vous allez également stocker les données de l'application Quiz dans Cloud Datastore.

Le squelette de l'application Quiz a déjà été codé. Vous allez cloner un dépôt contenant le squelette à l'aide de Google Cloud Shell, examiner le code dans l'éditeur Cloud Shell, puis l'afficher à l'aide de la fonction d'aperçu sur le Web de Cloud Shell.

Vous modifierez ensuite le code de façon à stocker les données dans Cloud Datastore.

Objectifs

Dans cet atelier, vous allez apprendre à effectuer les tâches suivantes :

  • Exploiter Cloud Shell en tant qu'environnement de développement

  • Intégrer Cloud Datastore dans une application NodeJS

Prérequis

Pour chaque atelier, nous vous attribuons un nouveau projet Google Cloud et un nouvel ensemble de ressources pour une durée déterminée, sans frais.

  1. Connectez-vous à Qwiklabs dans une fenêtre de navigation privée.

  2. Vérifiez le temps imparti pour l'atelier (par exemple : 01:15:00) : vous devez pouvoir le terminer dans ce délai.
    Une fois l'atelier lancé, vous ne pouvez pas le mettre en pause. Si nécessaire, vous pourrez le redémarrer, mais vous devrez tout reprendre depuis le début.

  3. Lorsque vous êtes prêt, cliquez sur Démarrer l'atelier.

  4. Notez vos identifiants pour l'atelier (Nom d'utilisateur et Mot de passe). Ils vous serviront à vous connecter à Google Cloud Console.

  5. Cliquez sur Ouvrir la console Google.

  6. Cliquez sur Utiliser un autre compte, puis copiez-collez les identifiants de cet atelier lorsque vous y êtes invité.
    Si vous utilisez d'autres identifiants, des messages d'erreur s'afficheront ou des frais seront appliqués.

  7. Acceptez les conditions d'utilisation et ignorez la page concernant les ressources de récupération des données.

Activer Google Cloud Shell

Google Cloud Shell est une machine virtuelle qui contient de nombreux outils pour les développeurs. Elle comprend un répertoire d'accueil persistant de 5 Go et s'exécute sur Google Cloud.

Google Cloud Shell vous permet d'accéder à vos ressources Google Cloud grâce à une ligne de commande.

  1. Dans la barre d'outils située en haut à droite dans la console Cloud, cliquez sur le bouton "Ouvrir Cloud Shell".

    Icône Cloud Shell encadrée

  2. Cliquez sur Continuer.

Le provisionnement et la connexion à l'environnement prennent quelques instants. Une fois connecté, vous êtes en principe authentifié et le projet est défini sur votre ID_PROJET. Par exemple :

ID de projet mis en évidence dans le terminal Cloud Shell

gcloud est l'outil de ligne de commande pour Google Cloud. Il est préinstallé sur Cloud Shell et permet la complétion par tabulation.

  • Vous pouvez lister les noms des comptes actifs à l'aide de cette commande :
gcloud auth list

Résultat :

Credentialed accounts: - @.com (active)

Exemple de résultat :

Credentialed accounts: - google1623327_student@qwiklabs.net
  • Vous pouvez lister les ID de projet à l'aide de cette commande :
gcloud config list project

Résultat :

[core] project =

Exemple de résultat :

[core] project = qwiklabs-gcp-44776a13dea667a6 Remarque : Pour consulter la documentation complète sur gcloud, accédez au guide de présentation de la gcloud CLI.

Prévisualiser l'application de l'étude de cas

Dans cette section, vous allez accéder à Cloud Shell, cloner le dépôt Git qui contient l'application Quiz, puis exécuter l'application.

Cloner le code source dans Cloud Shell

Pour cloner le dépôt du cours, exécutez la commande suivante dans Cloud Shell :

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

Configurer et exécuter l'application de l'étude de cas

  1. Créez un lien symbolique qui servira de raccourci vers le répertoire de travail :

ln -s ~/training-data-analyst/courses/developingapps/v1.3/nodejs/datastore ~/datastore

  1. Accédez au répertoire qui contient vos fichiers de travail :

cd ~/datastore/start

  1. Exportez une variable d'environnement GCLOUD_PROJECT qui référence l'ID du projet GCP :

export GCLOUD_PROJECT=$DEVSHELL_PROJECT_ID

  1. Installez les dépendances de l'application :

npm install

  1. Pour exécuter l'application, exécutez la commande suivante :

npm start

Examiner l'application de l'étude de cas

  1. Dans Cloud Shell, cliquez sur Web preview > Preview on port 8080 (Aperçu sur le Web > Prévisualiser sur le port 8080) pour prévisualiser l'application Quiz.

web-preview.png

  1. Dans la barre de navigation, cliquez sur Create Question (Créer une question).
  1. Dans la barre de navigation, cliquez sur Take Test (Faire le test).
  1. Dans la barre de navigation, cliquez sur GCP.

  1. Pour revenir à l'application côté serveur, cliquez sur le lien Quite Interesting Quiz (Quiz très intéressant) dans la barre de navigation.

Examiner le code de l'application de l'étude de cas

Dans cette section, vous allez examiner le code de l'application de l'étude de cas à l'aide de l'éditeur de texte Cloud Shell.

Utiliser l'éditeur de code Cloud Shell

  1. Dans Cloud Shell, cliquez sur Open Editor (Ouvrir l'éditeur).

code-editor.png

  1. Accédez au dossier datastore/start/server dans le panneau de l'explorateur de fichiers situé à gauche de l'éditeur.

Examiner l'application Web Express

  1. Sélectionnez le fichier datastore/start/server/app.js.
  1. Sélectionnez le dossier datastore/start/server/web-app.
  1. Sélectionnez le fichier datastore/start/server/web-app/questions.js.
  1. Dans le fichier questions.js, localisez le gestionnaire qui répond aux requêtes HTTP POST pour la route /questions/add.
  1. Sélectionnez le dossier datastore/start/server/web-app/views.
  1. Affichez le fichier datastore/start/server/web-app/views/questions/add.pug.
  1. Sélectionnez le fichier datastore/start/server/api/index.js.
  1. Sélectionnez le fichier datastore/start/server/gcp/datastore.js.

Ajouter des entités à Cloud Datastore

Dans cette section, vous allez écrire le code permettant d'enregistrer les données du formulaire dans Cloud Datastore.

Créer une application App Engine pour provisionner Cloud Datastore

  1. Revenez à Cloud Shell et appuyez sur Ctrl+C pour arrêter l'application.

  2. Pour créer une application App Engine dans votre projet, exécutez la commande suivante :

gcloud app create --region "us-central"

Importer et utiliser le module NodeJS Datastore

  1. Ouvrez le fichier ...gcp/datastore.js dans l'éditeur de code Cloud Shell.

  2. Chargez le module config du dossier parent.

  3. Chargez le module @google-cloud/datastore.

  4. Déclarez un objet client Datastore nommé ds.

datastore.js

'use strict'; // TODO: Load the ../config module const config = require('../config'); // END TODO // TODO: Load the @google-cloud/datastore module const {Datastore} = require('@google-cloud/datastore'); // END TODO // TODO: Create a Datastore client object, ds // The Datastore(...) factory function accepts an options // object which is used to specify which project's // Datastore should be used via the projectId property. // The projectId is retrieved from the config module. This // module retrieves the project ID from the GCLOUD_PROJECT // environment variable. const ds = new Datastore({ projectId: config.get('GCLOUD_PROJECT') }); // END TODO

Écrire le code permettant de créer une entité Cloud Datastore

  1. Déclarez une constante nommée kind, initialisée par la valeur 'Question'.

datastore.js

// TODO: Declare a constant named kind // The Datastore key is the equivalent of a primary key in a // relational database. // There are two main ways of writing a key: // 1. Specify the kind, and let Datastore generate a unique // numeric id // 2. Specify the kind and a unique string id const kind = 'Question'; // END TODO

  1. Supprimez l'instruction d'espace réservé Promise.resolve({}) existante de la fonction create(...).

  2. Déclarez une constante nommée key pour stocker la clé de cette entité.

  3. Déclarez une constante nommée entity, puis initialisez-la avec la constante key et les propriétés des questions du quiz extraites des données du formulaire.

  4. Utilisez l'objet client Datastore (ds) pour enregistrer l'entité en appelant la méthode save(entity).

datastore.js

// The create({quiz, author, title, answer1, answer2, // answer3, answer4, correctAnswer}) function uses an // ECMAScript 2015 destructuring assignment to extract // properties from the form data passed to the function function create({ quiz, author, title, answer1, answer2, answer3, answer4, correctAnswer }) { // TODO: Remove Placeholder statement // return Promise.resolve({}); // END TODO // TODO: Declare the entity key, // with a Datastore generated id const key = ds.key(kind); // END TODO // TODO: Declare the entity object, with the key and data const entity = { key, // The entity's members are represented in a data property. // This is an array where each element represents one // member in the entity. Each element is an object with a // name and a value data: [ { name: 'quiz', value: quiz }, { name: 'author', value: author }, { name: 'title', value: title }, { name: 'answer1', value: answer1 }, { name: 'answer2', value: answer2 }, { name: 'answer3', value: answer3 }, { name: 'answer4', value: answer4 }, { name: 'correctAnswer', value: correctAnswer }, ] }; // END TODO // TODO: Save the entity, return a promise // The ds.save(...) method returns a Promise to the // caller, as it runs asynchronously. return ds.save(entity); // END TODO }

Exécuter l'application et créer une entité Cloud Datastore

  1. Enregistrez le fichier ...gcp/datastore.js, puis revenez à l'invite de commande Cloud Shell.

  2. Pour lancer l'application, exécutez la commande suivante :

npm start
  1. Dans Cloud Shell, cliquez sur Web preview > Preview on port 8080 (Aperçu sur le Web > Prévisualiser sur le port 8080) pour prévisualiser l'application Quiz.
  2. Cliquez sur Create Question (Créer une question).
  3. Remplissez le formulaire avec les valeurs suivantes, puis cliquez sur Save (Enregistrer).

Champ du formulaire

Valeur

Author (Auteur)

Votre nom

Quiz

Google Cloud Platform

Title (Titre)

Which company owns GCP?

Answer 1 (Réponse 1)

Amazon

Answer 2 (Réponse 2)

Google [sélectionnez la case d'option "Answer 2" (Réponse 2)]

Answer 3 (Réponse 3)

IBM

Answer 4 (Réponse 4)

Microsoft
  1. Accédez à la console Cloud Platform, puis cliquez sur Datastore dans le menu de navigation.

Cliquez sur "Check my progress" (Vérifier ma progression) pour vérifier l'objectif. Créer une application App Engine et ajouter des entités à Cloud Datastore

Bonus : Interroger Cloud Datastore

Dans cette section, vous allez écrire du code permettant de récupérer des données d'entité de Cloud Datastore.

Écrire le code permettant de récupérer des entités Cloud Datastore

  1. Revenez à l'éditeur de code.

  2. Dans le fichier ...gcp/datastore.js, supprimez le code de la méthode list(quiz).

  3. Dans la méthode list(...), créez une requête qui récupère des entités Question pour un quiz spécifique à partir de Cloud Datastore.

  4. Exécutez la requête avec le client Datastore et attribuez l'objet de promesse renvoyé à une constante.

  5. Écrivez une instruction pour renvoyer la promesse.

  6. Associez une méthode then(...) à la promesse.

  7. Écrivez une fonction fléchée dans la méthode then(...) pour récupérer la réponse de Cloud Datastore.

  8. Dans la fonction fléchée, extrayez les résultats de la réponse.

  9. Remodelez les données en ajoutant chaque ID d'entité et en supprimant la bonne réponse des données renvoyées par Cloud Datastore.

  10. Complétez le code dans le corps de la fonction fléchée pour renvoyer une page d'entités ou un objet indiquant qu'il s'agit de la dernière page de résultats.

Exécuter l'application et tester la requête Cloud Datastore

  1. Enregistrez le fichier ...gcp/datastore.js, puis revenez à la commande Cloud Shell.
  2. Arrêtez l'application en appuyant sur Ctrl+C.
  3. Démarrez l'application.
  4. Dans Cloud Shell, cliquez sur Web preview > Preview on port 8080 (Aperçu sur le Web > Prévisualiser sur le port 8080) pour prévisualiser l'application Quiz.
  5. Remplacez la chaîne de requête à la fin de l'URL de l'application par /api/quizzes/gcp.
  1. Revenez à la page d'accueil de l'application et cliquez sur Take Test (Faire le test).
  2. Cliquez sur GCP.

Vous trouverez la solution à la section bonus dans le dossier bonus de l'atelier.

Terminer l'atelier

Une fois l'atelier terminé, cliquez sur Terminer l'atelier. Google Cloud Skills Boost supprime les ressources que vous avez utilisées, puis efface le compte.

Si vous le souhaitez, vous pouvez noter l'atelier. Sélectionnez un nombre d'étoiles, saisissez un commentaire, puis cliquez sur Envoyer.

Le nombre d'étoiles correspond à votre degré de satisfaction :

  • 1 étoile = très insatisfait(e)
  • 2 étoiles = insatisfait(e)
  • 3 étoiles = ni insatisfait(e), ni satisfait(e)
  • 4 étoiles = satisfait(e)
  • 5 étoiles = très satisfait(e)

Si vous ne souhaitez pas donner votre avis, vous pouvez fermer la boîte de dialogue.

Pour soumettre des commentaires, suggestions ou corrections, veuillez accéder à l'onglet Assistance.

Copyright 2026 Google LLC Tous droits réservés. Google et le logo Google sont des marques de Google LLC. Tous les autres noms de société et de produit peuvent être des marques des sociétés auxquelles ils sont associés.

Avant de commencer

  1. Les ateliers créent un projet Google Cloud et des ressources pour une durée déterminée.
  2. Les ateliers doivent être effectués dans le délai imparti et ne peuvent pas être mis en pause. Si vous quittez l'atelier, vous devrez le recommencer depuis le début.
  3. En haut à gauche de l'écran, cliquez sur Démarrer l'atelier pour commencer.

Utilisez la navigation privée

  1. Copiez le nom d'utilisateur et le mot de passe fournis pour l'atelier
  2. Cliquez sur Ouvrir la console en navigation privée

Connectez-vous à la console

  1. Connectez-vous à l'aide des identifiants qui vous ont été attribués pour l'atelier. L'utilisation d'autres identifiants peut entraîner des erreurs ou des frais.
  2. Acceptez les conditions d'utilisation et ignorez la page concernant les ressources de récupération des données.
  3. Ne cliquez pas sur Terminer l'atelier, à moins que vous n'ayez terminé l'atelier ou que vous ne vouliez le recommencer, car cela effacera votre travail et supprimera le projet.

Ce contenu n'est pas disponible pour le moment

Nous vous préviendrons par e-mail lorsqu'il sera disponible

Parfait !

Nous vous contacterons par e-mail s'il devient disponible

Un atelier à la fois

Confirmez pour mettre fin à tous les ateliers existants et démarrer celui-ci

Utilisez la navigation privée pour effectuer l'atelier

Le meilleur moyen d'exécuter cet atelier consiste à utiliser une fenêtre de navigation privée. Vous éviterez ainsi les conflits entre votre compte personnel et le compte temporaire de participant, qui pourraient entraîner des frais supplémentaires facturés sur votre compte personnel.