Développer une application Node.js avec Gemini pour l'assistance Google Cloud

Ce tutoriel vous montre comment utiliser Gemini pour Google Cloud pour Google Cloud, un service dans Google Cloud, pour explorer, créer, modifier, tester et déployer exemple d'application Node.js.

Pour les étapes suivantes, considérez que vous êtes un développeur Node.js et que vous souhaitez pour écrire une application Web simple en JavaScript qui utilise un format de base. Dans ce vous utiliserez le framework Express pour l'application et les modèles EJS pour le formulaire HTML.

Ce guide est destiné aux développeurs Node.js qui souhaitent utiliser Gemini pour accélérer le processus de développement. Il suppose que vous êtes connaître les concepts de base du cloud, mais pas nécessairement ceux de Google Cloud.

Objectifs

Ce tutoriel vous apprend à utiliser Gemini pour effectuer les tâches suivantes : suivantes:

  • Développer une application Web Node.js dans Cloud Shell
  • Créer des tests unitaires pour votre application Web Node.js
  • Déployez votre application Web Node.js sur Cloud Run.

Produits Google Cloud utilisés

Ce tutoriel utilise les produits Google Cloud suivants :

  • Gemini: un collaborateur toujours actif dans Google Cloud qui propose une assistance basée sur l'IA générative à un large éventail d'utilisateurs, y compris des développeurs et des data scientists. Pour fournir une infrastructure intégrée d'assistance, Gemini est intégré à de nombreuses produits Google Cloud.
  • Cloud Code pour le plug-in Cloud Shell: plug-in IDE qui prend en charge le cycle de développement des applications exécutées sur Google Cloud.
  • Cloud Run: un service entièrement géré qui vous permet de créer et déployer des applications conteneurisées. Google Cloud gère le scaling et d'autres tâches d'infrastructure afin que vous puissiez vous concentrer sur la logique métier de votre code. Pour en savoir plus sur les tarifs, consultez la Tarifs de Cloud Run et utilisez la Simulateur de coût pour générer une estimation des coûts en fonction de votre utilisation prévue.

Avant de commencer

  1. Créer un projet Google Cloud si aucun projet Google Cloud existant ne peut être utilisé pour ce tutoriel.
  2. Activez Cloud Shell.
  3. Assurez-vous que Gemini est configuré pour votre compte utilisateur et votre projet Google Cloud.
  4. Activer Gemini pour Cloud Shell en sélectionnant le projet qui a accès Gemini.

Demander à Gemini de générer du code Node.js

Gemini peut vous aider à générer du code Node.js à partir des requêtes que vous fournissez dans le chat et les descriptions que vous rédigez dans les commentaires du code. La plus vous écrivez de code et plus vous fournissez de contexte à Gemini, mieux Gemini pourra vous aider à développer votre appli. Remarque que les réponses de Gemini peuvent varier ou à décrire le contexte. Il est donc recommandé de passer en revue les réponses de Gemini avant d'accepter les suggestions le processus de développement.

Avant de demander à Gemini de vous aider à générer un code de démarrage, utilisez la terminal Cloud Shell pour créer un répertoire vide et ajouter deux .

mkdir node-js-with-gemini
cd node-js-with-gemini
touch app.js test.js

Dans l'éditeur Cloud Shell, sélectionnez content_copy Explorateur et ouvrez le que vous venez de créer dans le terminal Cloud Shell.

Installer les packages

Vous savez que vous souhaitez installer les packages express et ejs pour votre Application Node.js Pour demander de l'aide à Gemini concernant l'installation de ces procédez comme suit:

  1. Dans le panneau de gauche de l'éditeur Cloud Shell, cliquez sur étincelle Gemini.

  2. Dans le volet Gemini, saisissez une requête telle que:

    What is the command to install express and ejs packages for node.js?

  3. Cliquez sur Envoyer Envoyer.

    Gemini renvoie une réponse semblable à celle suivantes:

    Pour installer les packages express et ejs pour Node.js, vous pouvez utiliser la classe la commande suivante:

    npm install express ejs
    
  4. Copiez la commande fournie par Gemini et exécutez-la dans votre terminal Cloud Shell.

Créer des fichiers d'application

Après avoir installé les packages, utilisez Gemini pour savoir comment Ajoutez les packages installés dans votre fichier app.js.

  1. Ouvrez votre fichier app.js dans l'éditeur Cloud Shell.
  2. Dans la discussion Gemini, saisissez une requête telle que:

    How do I add these packages to my app.js file?

    La réponse de Gemini sera semblable à celle-ci:

    Pour ajouter les packages express et ejs à votre fichier app.js, vous pouvez utiliser la classe code suivant:

    const express = require('express');
    const ejs = require('ejs');
    

    Cela nécessite les packages express et ejs et les mettront à la disposition de dans votre fichier app.js.

  3. Ajoutez le code fourni par Gemini à votre fichier app.js.

Générer du code avec des commentaires

Le plug-in Cloud Code dispose d'une fonctionnalité qui permet à Gemini utiliser des commentaires de fichier pour générer du code. Par exemple, lorsque vous ajoutez un commentaire dans votre fichier, vous pouvez demander à Gemini de générer du code comme décrit dans le commentaire.

Pour utiliser cette fonctionnalité dans votre fichier app.js, assurez-vous que Gemini est dans l'éditeur Cloud Shell.

  1. À la fin du fichier, ajoutez un espace réservé de commentaire pour initialiser le navigateur l'application. Par exemple:

    // Initialize express web app using ejs templating engine
    
  2. Placez le curseur de texte à la fin du commentaire, puis appuyez sur Control+Enter (pour Windows et Linux) ou Control+Return (pour macOS), puis appuyez sur Tabulation pour utiliser les fonctionnalités de génération de code de Gemini pour générer du code.

    La réponse de Gemini s'affiche sous deux lignes de code , semblable à celui-ci:

    // Initialize express web app using ejs templating engine
    
    const app = express();
    app.set('view engine', 'ejs');
    

    Si le résultat généré par la génération de code est différent de ce à quoi vous vous attendiez, modifiez ou et supprimez le contenu en trop.

Ajoutez ensuite d'autres commentaires afin de générer les fonctionnalités de base pour votre site Web Express l'application.

  1. En bas du fichier app.js, ajoutez les commentaires suivants:

    // add urlencoded middleware to parse form data
    
    // define the home route
    
    // create a /greeting POST route with a `name` parameter
    
    // create a /greeting route that accepts a name parameter
    
    // start the server on port 8080
    
  2. Générer un code pour chaque commentaire sur un fichier, de la même manière que vous avez généré du code auparavant.

  3. Avant d'accepter les suggestions, vérifiez l'exactitude du code généré.

    Les commentaires de votre fichier app.js doivent désormais être accompagnés de le code correspondant, semblable à ce qui suit:

    // add urlencoded middleware to parse form data
    app.use(express.urlencoded({ extended: true }));
    
    // define the home route
    app.get('/', (req, res) => {
      res.render('index');
    });
    
    // create a /greeting POST route with a `name` parameter
    app.post('/greeting', (req, res) => {
      const name = req.body.name || 'World';
      res.render('greeting', { name });
    });
    
    // start the server
    const port = process.env.PORT || 8080;
    app.listen(port, () => {
      console.log(`App listening on port ${port}`);
      console.log('Press Ctrl+C to quit.');
    });
    
    // create a /greeting route that accepts a name parameter
    app.get('/greeting/:name', (req, res) => {
      res.render('greeting', { name: req.params.name });
    });
    

Créer un fichier package.json

Une fois le code généré pour votre application de base, créez et ajoutez dans le fichier package.json.

  1. Créez un fichier package.json dans le même répertoire que votre fichier app.js.
  2. Dans l'éditeur Cloud Shell, sélectionnez déclenchez Gemini et saisissez une requête. par exemple:

    Based on my app.js file, can you create a package.json file?

    La réponse de Gemini devrait suggérer le script de démarrage les dépendances à spécifier. Il est semblable à ce qui suit:

    Bien sûr. Voici un fichier package.json que vous pouvez utiliser avec votre fichier app.js :

    {
      "name": "my-app",
      "version": "1.0.0",
      "description": "A simple Node.js web app using Express and EJS.",
      "main": "app.js",
      "scripts": {
        "start": "node app.js"
      },
    
      "dependencies": {
        "express": "^4.17.1",
        "ejs": "^3.1.6"
      }
    }
    

    Ce fichier package.json contient les informations suivantes:

    Nom de l'application (my-app)
    Version de l'application (1.0.0)
    Description de l'application (application Web Node.js simple utilisant Express et EJS)
    Fichier principal de l'application (app.js)
    Scripts pouvant être exécutés dans l'application (début)
    Dépendances de l'application (express et ejs)

  3. Copiez et collez uniquement le contenu fourni par Gemini dans votre fichier package.json.

Créer des modèles ejs

Pour terminer votre application Web, créez un répertoire views pour vos modèles ejs dans le même répertoire que vos fichiers app.js et package.json.

  1. Dans votre terminal, saisissez la commande suivante:

    mkdir views
    touch views/index.ejs views/greeting.ejs
    
  2. Ouvrez le fichier index.ejs dans l'éditeur et collez le contenu suivant:

    <html>
    <body>
        <form action="/greeting" method="post">
        <label for="name">What's your name?</label>
        <input type="text" id="name" name="name" autofocus />
        <button type="submit">Submit</button>
        </form>
    </body>
    </html>
    
  3. Ouvrez le fichier greeting.ejs dans l'éditeur et collez le contenu suivant:

    <html>
    <body>
        <a href="/">Home</a>
        <p>Hello <%= name %>~</p>
    </body>
    </html>
    

Prévisualiser votre application dans un navigateur

Une fois le code, les modèles et les exigences de votre application terminés, vous pouvez pour vérifier que votre application fonctionne.

  1. Exécutez la commande suivante pour installer les dépendances.

    npm install
    
  2. Exécutez la commande suivante pour démarrer l'application:

    npm start
    
  3. Vérifiez que l'application fonctionne. Sélectionnez le bouton Aperçu sur le Web situé en haut. à droite de la barre des tâches Cloud Shell. Sélectionnez ensuite le numéro de port le menu affiché. Cloud Shell ouvre le URL d'aperçu dans une nouvelle fenêtre du navigateur.

Écrire des tests unitaires

Après avoir vérifié que votre application Node.js fonctionne, vous pouvez écrire des tests unitaires dans votre test.js avant de déployer votre application sur Cloud Run. Dans l'exemple suivant, vous demanderez de l'aide à Gemini générer un test unitaire pour quand le code de réponse HTTP est 200.

  1. En bas de votre fichier app.js, ajoutez la ligne suivante pour exporter le fichier de votre application.

    module.exports = app;
    
  2. Ouvrez votre fichier test.js.

  3. Pour tester le moment où la réponse renvoie un code d'état HTTP 200, ouvrez la volet de chat Gemini, puis saisissez une requête telle que:

    Can you generate a unit test for my home route in app.js to assert that the response code is 200?

    Gemini doit répondre par un message semblable à celui suivantes:

    Bien sûr. Voici un test unitaire pour la route d'accueil dans app.js, qui garantit le code de réponse est 200:

    const assert = require('assert');
    const request = require('supertest');
    
    const app = require('./app.js');
    describe('GET /', () => {
      it('should return a 200 response code', async () => {
        const response = await request(app).get('/');
        assert.equal(response.status, 200);
      });
    });
    

    Ce test vérifie que l'itinéraire d'accueil renvoie un code d'état 200.

    Ajoutez le bloc de code suggéré à votre fichier test.js.

  4. Installez les packages de test Mocha et Supertest en exécutant la commande suivante : dans votre terminal:

    npm i mocha supertest
    
  5. Mettez à jour votre fichier package.json pour y inclure votre nouveau script de test et ses packages. Exemple :

    {
      "name": "my-app",
      "version": "1.0.0",
      "description": "A simple Node.js web app using Express and EJS.",
      "main": "app.js",
      "scripts": {
        "start": "node app.js",
        "test": "mocha"
      },
      "dependencies": {
      "express": "^4.17.1",
      "ejs": "^3.1.6",
      "mocha": "^10.2.0",
      "supertest": "^6.3.3"
      }
    }
    
  6. Exécutez la commande suivante pour lancer les tests:

    npm test
    

S'il n'y a pas d'erreur, votre test devrait s'afficher comme réussi. Si vous souhaitez ajouter tests supplémentaires pour vos autres itinéraires, continuez à demander à Gemini pour obtenir des suggestions à ajouter à votre fichier test.js.

Déployer dans Cloud Run

Maintenant que votre application s'exécute localement, vous pouvez la déployer sur Google Cloud. Cloud Run fonctionne bien dans ce scénario car vous pouvez effectuer des déploiements depuis le code source votre infrastructure lors de l'exécution de votre application.

  1. Dans la discussion Gemini, demandez à Gemini comment le déployer à Cloud Run directement depuis votre code source en utilisant gcloud:

    What is the gcloud command for deploying a Cloud Run service from source code?

    Gemini devrait répondre de quelque chose de semblable à:

    Vous pouvez effectuer le déploiement directement sur Cloud Run à partir de votre code source dans votre répertoire actuel à l'aide de gcloud. Pour ce faire, vous pouvez exécutez la commande gcloud run deploy avec --source flag Cet indicateur indique à gcloud d'utiliser votre code source pour créer une image de conteneur et la déployer sur Cloud Run.

    Par exemple, pour déployer le code dans votre fichier app.js Cloud Run, utilisez la commande suivante:

    gcloud run deploy app --source .
    

    Cette commande crée une image de conteneur à partir de votre fichier app.js et déploie à Cloud Run.

    Vous pouvez également utiliser l'option --region pour spécifier la région dans laquelle vous souhaitez pour déployer votre application. Par exemple, pour déployer votre application dans la région us-central1, vous devez utiliser la commande suivante:

    gcloud run deploy app --source . --region us-central1
    

    Pour en savoir plus sur le déploiement sur Cloud Run à partir de la source consultez la documentation Cloud Run.

  2. Utilisez la commande gcloud fournie par Gemini la réponse.

  3. Suivez les instructions pour sélectionner une région, puis choisissez l'option permettant d'autoriser non authentifiés pour votre application de test. Après le déploiement de l'application avec succès, le résultat renvoie une URL de service.

Effectuer un nettoyage

Pour éviter que les ressources soient facturées sur votre compte Google Cloud, utilisé dans ce tutoriel, vous pouvez supprimer le projet Google Cloud créé pour ce tutoriel. Vous pouvez également supprimer les différentes ressources.

  1. Attention: La suppression d'un projet aura les effets suivants: <ph type="x-smartling-placeholder">
      </ph>
    • Tout le contenu du projet est supprimé. Si vous avez utilisé un projet existant pour les tâches de ce document, lorsque vous le supprimez, vous supprimez également tout autre travail que vous avez effectué dans le projet.
    • Les ID de projets personnalisés sont perdus. Lorsque vous avez créé ce projet, vous avez peut-être créé un ID de projet personnalisé que vous souhaitez utiliser dans le à venir. Pour conserver les URL qui utilisent l'ID du projet, par exemple un URL appspot.com, supprimer les ressources sélectionnées dans le projet au lieu de supprimer l'ensemble du projet.
  2. Si vous envisagez d'explorer plusieurs architectures, tutoriels ou de démarrage rapide, réutiliser des projets peut vous aider à éviter de dépasser le quota de projets Dans la console Google Cloud, accédez à la page Gérer les ressources.

    Accéder à la page Gérer les ressources

  3. Dans la liste des projets, sélectionnez le projet que vous souhaitez supprimer. puis cliquez sur Supprimer.

  4. Dans la boîte de dialogue, saisissez l'ID du projet, puis cliquez sur Arrêter pour supprimer le projet.

Étape suivante