Sviluppa un'app Node.js con Gemini per l'assistenza di Google Cloud

Questo tutorial mostra come utilizzare Gemini per Google Cloud, un servizio collaboratore in Google Cloud, per esplorare, creare, modificare, testare ed eseguire il deployment dell'app Node.js di esempio.

Per i passaggi seguenti, considera che sei uno sviluppatore Node.js e di volere scrivere una semplice applicazione web in JavaScript che utilizza un formato di base. In questo userai il framework Express per l'app e i modelli EJS per il modulo HTML.

Questa guida è rivolta agli sviluppatori Node.js che desiderano utilizzare Gemini per accelerare il processo di sviluppo. Si presume che tu familiarità con i concetti cloud di base, anche se non necessariamente Google Cloud.

Obiettivi

Questo tutorial ti aiuta a imparare a usare Gemini per svolgere seguenti:

  • Sviluppa un'app web Node.js in Cloud Shell.
  • Creare test delle unità per l'app web Node.js.
  • Esegui il deployment dell'app web Node.js in Cloud Run.

Prodotti Google Cloud utilizzati

Questo tutorial utilizza i seguenti prodotti Google Cloud:

  • Gemini: un collaboratore sempre attivo in Google Cloud che offre assistenza basata sull'AI generativa a un'ampia gamma di utenti, tra cui sviluppatori e data scientist. Per fornire un'integrazione di assistenza, Gemini è integrato in molte Google Cloud.
  • Plug-in Cloud Code per Cloud Shell: un plug-in IDE che fornisce supporto per il ciclo di sviluppo delle app che verranno eseguite su in Google Cloud.
  • Cloud Run: un servizio completamente gestito che consente di creare ed eseguire il deployment di app containerizzate. Google Cloud gestisce la scalabilità e altre dell'infrastruttura, così potrai concentrarti sulla logica di business le API nel tuo codice. Per informazioni sui prezzi, consulta Prezzi di Cloud Run e utilizza Calcolatore prezzi per generare una stima dei costi in base all'utilizzo previsto.

Prima di iniziare

  1. Creare un progetto Google Cloud se non hai già un progetto Google Cloud che può essere utilizzato per questo tutorial.
  2. Attiva Cloud Shell.
  3. Assicurati che Gemini sia configurato per il tuo account utente e progetto Google Cloud.
  4. Abilita Gemini per Cloud Shell selezionando il progetto a cui è stato concesso l'accesso Gemini.

Chiedi a Gemini di generare il codice Node.js

Gemini può aiutarti a generare codice Node.js in base ai prompt che fornisci nella chat e le descrizioni che scrivi nei commenti del codice. La più codice scrivi e più contesto fornisci a Gemini, meglio Gemini potrà aiutarti a sviluppare la tua app. Nota che le risposte di Gemini possano variare a seconda di come chiedi domande o descrivere il contesto, per cui è bene rivedere le risposte di Gemini prima di accettare i suggerimenti durante durante il processo di sviluppo.

Prima di chiedere a Gemini di aiutarti a generare un codice di avvio, utilizza la terminale Cloud Shell per creare una directory vuota e aggiungerne due vuote .

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

Nell'editor di Cloud Shell, seleziona content_copy Explorer e apri lo appena creata nel terminale Cloud Shell.

Installa pacchetti

Sai che desideri installare i pacchetti express e ejs per il tuo Node.js. Per chiedere a Gemini di aiutarti a installare questi di terze parti, procedi nel seguente modo:

  1. Nel riquadro laterale sinistro nell'editor di Cloud Shell, fai clic su Gemini Gemini.

  2. Nel riquadro Gemini, inserisci un prompt come:

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

  3. Fai clic su Invia Invia.

    Gemini restituisce una risposta simile alla seguenti:

    Per installare i pacchetti express ed ejs per Node.js, puoi utilizzare la classe seguente comando:

    npm install express ejs

  4. Copia il comando fornito da Gemini ed eseguilo nel tuo terminale Cloud Shell.

Crea file di applicazioni

Dopo l'installazione dei pacchetti, utilizza Gemini per avere indicazioni su come: aggiungi i pacchetti installati nel file app.js.

  1. Apri il file app.js nell'editor di Cloud Shell.

  2. Nella chat di Gemini, inserisci un prompt come:

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

    La risposta di Gemini sarà simile alla seguente:

    Per aggiungere i pacchetti express ed ejs al file app.js, puoi utilizzare la classe codice seguente:

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

    Questa operazione richiederà i pacchetti express ed ejs, rendendoli disponibili nel file app.js.

  3. Aggiungi il codice fornito da Gemini al tuo file app.js.

Genera codice con commenti

Il plug-in Cloud Code ha una funzionalità che consente a Gemini usare i commenti del file per generare il codice. Ad esempio, quando aggiungi un commento come segnaposto nel tuo file, puoi chiedere a Gemini di generare il codice come descritto nel commento.

Per usare questa funzionalità nel file app.js, assicurati che Gemini sia abilitato nell'editor di Cloud Shell.

  1. Alla fine del file, aggiungi un segnaposto di commento per inizializzare il Web dell'app. Ad esempio:

    // Initialize express web app using ejs templating engine

  2. Sposta il cursore di testo alla fine del commento e premi Control+Enter (per Windows e Linux) o Control+Return (per MacOS), quindi premi Tab per usare le funzionalità di generazione del codice di Gemini per generare il codice.

    La risposta di Gemini avrà due righe di codice sotto il simile al seguente:

    // Initialize express web app using ejs templating engine

const app = express();
app.set('view engine', 'ejs');

    Se l'output della generazione del codice è diverso da quello previsto, modifica o eliminare i contenuti aggiuntivi in base alle tue esigenze.

Quindi, aggiungi altri commenti per generare le funzionalità di base per il tuo Express Web dell'app.

  1. Vai in fondo al file app.js e aggiungi i seguenti commenti:

    // 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. Genera un codice per ogni commento sul file simile a come hai generato il codice in precedenza.

  3. Prima di accettare i suggerimenti, esamina il codice generato per verificarne l'accuratezza.

    I commenti nel file app.js ora dovrebbero essere accompagnati da codice corrispondente, simile al seguente:

    // 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 });
});

Creare un file package.json

Dopo aver generato il codice per l'applicazione di base, crea e aggiungi al file package.json.

  1. Crea un file package.json nella stessa directory del file app.js.

  2. Nell'editor di Cloud Shell, seleziona spark Gemini e inserisci un prompt come:

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

    La risposta di Gemini dovrebbe suggerire lo script di avvio dipendenze da specificare e sarà simile al seguente:

    Certo. Ecco un file package.json che puoi utilizzare con il file app.js file:

    {
  "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"
  }
}

    Questo file package.json include le seguenti informazioni:

    Il nome dell'app (my-app)
    La versione dell'app (1.0.0)
    Una descrizione dell'app (una semplice app web Node.js che utilizza Express ed EJS).
    Il file principale dell'app (app.js)
    Gli script che possono essere eseguiti sull'app (avvio)
    Le dipendenze dell'app (express ed ejs)

  3. Copia e incolla solo i contenuti forniti da Gemini in il tuo file package.json.

Creare modelli ejs

Per completare l'app web, crea una directory views per i tuoi modelli ejs nella stessa directory dei file app.js e package.json.

  1. Nel terminale, inserisci quanto segue:

    mkdir views
touch views/index.ejs views/greeting.ejs

  2. Apri il file index.ejs nell'editor e incolla quanto segue:

    <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. Apri il file greeting.ejs nell'editor e incolla quanto segue:

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

Visualizzare l'anteprima dell'app in un browser

Ora che hai completato il codice, i modelli e i requisiti dell'app, puoi per verificare se l'app funziona.

  1. Esegui questo comando per installare le dipendenze.

    npm install

  2. Esegui questo comando per avviare l'app:

    npm start

  3. Verifica che l'app funzioni. Seleziona il pulsante Anteprima web in alto a destra della barra delle applicazioni di Cloud Shell. Quindi, seleziona il numero di porta da nel menu visualizzato. Cloud Shell apre URL anteprima in una nuova finestra del browser.

Scrittura dei test delle unità

Dopo aver confermato che l'app Node.js funziona, puoi scrivere i test delle unità nel tuo test.js prima di eseguire il deployment dell'app in Cloud Run. Nella nell'esempio seguente, chiederai a Gemini assistenza generando un test delle unità per quando il codice di risposta HTTP è 200.

  1. Nella parte inferiore del file app.js, aggiungi la riga seguente per esportare il file dell'app.

    module.exports = app;

  2. Apri il file test.js.

  3. Per verificare quando la risposta restituisce un codice di stato HTTP 200, apri la Gemini e inserisci un prompt come:

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

    Gemini dovrebbe rispondere con qualcosa di simile seguenti:

    Certo. Ecco un test delle unità per il percorso verso casa in app.js che garantisce il codice di risposta è 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);
  });
});

    Questo test verifica che il percorso verso casa restituisca un codice di stato 200.

    Aggiungi il blocco di codice suggerito al tuo file test.js.

  4. Installa i pacchetti Mocha test e Supertest eseguendo questo comando nel terminale:

    npm i mocha supertest

  5. Aggiorna il file package.json in modo da includere il nuovo script per il test e i relativi . Ad esempio:

    {
  "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. Esegui questo comando per eseguire i test:

    npm test

Il test dovrebbe risultare superato se non ci sono errori. Se vuoi aggiungere altri test per gli altri percorsi, continua a chiedere a Gemini per suggerimenti da aggiungere al tuo file test.js.

Esegui il deployment in Cloud Run

Ora che la tua app è in esecuzione localmente, puoi procedere con il deployment in Google Cloud. Cloud Run funziona bene in questo scenario perché è possibile eseguire il deployment dal codice sorgente e non è necessario gestire durante l'esecuzione dell'app.

  1. Nella chat di Gemini, chiedi a Gemini come eseguire il deployment a Cloud Run direttamente dal codice sorgente utilizzando gcloud:

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

    Gemini dovrebbe rispondere con qualcosa di simile a:

    Puoi eseguire il deployment direttamente in Cloud Run dal tuo codice sorgente nella directory attuale utilizzando gcloud. A questo scopo, puoi: usa il comando gcloud run deploy con --source flag. Questo flag indica a gcloud di utilizzare la tua origine per creare un'immagine container ed eseguirne il deployment in Cloud Run.

    Ad esempio, per eseguire il deployment del codice nel file app.js in Cloud Run, devi utilizzare questo comando:

    gcloud run deploy app --source .

    Questo comando creerà un'immagine container dal file app.js ed eseguirà il deployment in Cloud Run.

    Puoi anche usare il flag --region per specificare la regione in cui vuoi il deployment della tua app. Ad esempio, per eseguire il deployment della tua app nella regione us-central1, devi utilizzare il seguente comando:

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

    Per ulteriori informazioni sul deployment in Cloud Run dall'origine codice, puoi consultare la documentazione di Cloud Run.

  2. Usa il comando gcloud fornito da Gemini la risposta.

  3. Segui le istruzioni per selezionare una regione e scegli l'opzione per consentire. chiamate non autenticate per la tua app di test. Dopo il deployment dell'app correttamente, l'output restituirà un URL del servizio.

Esegui la pulizia

Per evitare che al tuo account Google Cloud vengano addebitati costi relativi alle risorse usati in questo tutorial, puoi eliminare il progetto Google Cloud per questo tutorial. In alternativa, puoi eliminare il singolo Google Cloud.

  1. Attenzione: l'eliminazione di un progetto ha i seguenti effetti:
      .
    • L'intero contenuto del progetto viene eliminato. Se utilizzavi un progetto esistente per le attività in questo documento, quando lo elimini, eliminerai anche qualsiasi altro lavoro fatto nel progetto.
    • Gli ID progetto personalizzati non sono più disponibili. Quando hai creato il progetto, potresti aver creato un ID progetto personalizzato che vuoi usare per il futuro. Per conservare gli URL che utilizzano l'ID progetto, ad esempio una URL appspot.com, elimina le risorse selezionate all'interno del progetto anziché eliminare l'intero progetto.

  2. Se prevedi di esplorare diverse architetture, tutorial delle guide rapide, il riutilizzo dei progetti può aiutarti a evitare di superare la quota Nella console Google Cloud, vai alla pagina Gestisci risorse.

    Vai a Gestisci risorse

  3. Nell'elenco dei progetti, seleziona il progetto che vuoi eliminare e e fai clic su Elimina.

  4. Nella finestra di dialogo, digita l'ID progetto, quindi fai clic su Chiudi per per eliminare il progetto.

Passaggi successivi