使用 Gemini 开发 Node.js 应用以获得 Google Cloud 方面的帮助

本教程介绍如何使用 Gemini for Google Cloud（Google Cloud 中 AI 赋能的协作工具）探索、创建、修改、测试和部署示例 Node.js 应用。

对于以下步骤，假设您是 Node.js 开发者，希望使用 JavaScript 编写一个使用基本表单的简单 Web 应用。在这种情况下，您将为应用使用 Express 框架，为 HTML 表单使用 EJS 模板。

本指南适用于希望使用 Gemini 加快开发过程的 Node.js 开发者。本文档假定您熟悉基本的云概念，但不一定要熟悉 Google Cloud。

目标

本教程将帮助您了解如何使用 Gemini 执行以下操作：

  • 在 Cloud Shell 中开发 Node.js Web 应用。
  • 为您的 Node.js Web 应用编写单元测试。
  • 将 Node.js Web 应用部署到 Cloud Run。

使用的 Google Cloud 产品

本教程使用以下 Google Cloud 产品：

  • Gemini：Google Cloud 中始终在线的协作工具，为广大用户（包括开发者和数据科学家）提供由生成式 AI 提供支持的协助。为了提供集成式协助体验，Gemini 已嵌入到许多 Google Cloud 产品中。
  • Cloud Code for Cloud Shell 插件：一款 IDE 插件扩展程序，可为将在 Google Cloud 上运行的应用提供开发周期支持。
  • Cloud Run：一项全代管式服务，可用于构建和部署容器化应用。Google Cloud 负责处理伸缩和其他基础架构任务，以便您可以专注于代码的业务逻辑。如需了解价格信息，请参阅 Cloud Run 价格页面，然后使用价格计算器根据您的预计使用情况来估算费用。

准备工作

  1. 如果您现在还没有可用于本教程的 Google Cloud 项目，请创建一个 Google Cloud 项目。
  2. 激活 Cloud Shell。
  3. 确保已为您的 Google Cloud 用户帐号和项目设置 Gemini。
  4. 选择已获准使用 Gemini 功能的项目，为 Cloud Shell 启用 Gemini。

提示 Gemini 生成 Node.js 代码

Gemini 可以根据您在聊天中提供的提示以及您在代码注释中撰写的说明来帮助您生成 Node.js 代码。您编写的代码越多，提供给 Gemini 的上下文越多，Gemini 提供的回答就越能帮助您开发应用。请注意，Gemini 的回答可能会因您提问或描述上下文的方式而异，因此最好在开发过程中先查看双子座的回答，然后再接受建议。

在让 Gemini 帮助生成起始代码之前，请使用 Cloud Shell 终端创建一个空目录，并添加两个空文件。

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

在 Cloud Shell 编辑器中，选择 content_copy 探索器，然后在 Cloud Shell 终端中打开您刚刚创建的文件夹。

安装软件包

您知道要为 Node.js 应用安装 express 和 ejs 软件包。如需请求 Gemini 获取有关安装这些软件包的帮助，请按以下步骤操作：

  1. 在 Cloud Shell Editor 的左侧面板中，点击 spark Gemini。

  2. 在 Gemini 窗格中，输入如下提示：

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

  3. 点击发送 发送。

    Gemini 会返回类似于以下内容的响应：

    如需安装适用于 Node.js 的 Express 和 ejs 软件包，您可以使用以下命令：

    npm install express ejs

  4. 复制 Gemini 提供的命令，并在 Cloud Shell 终端中运行。

编写应用文件

安装软件包后，请使用 Gemini 获取有关如何在 app.js 文件中添加已安装的软件包的指导。

  1. 在 Cloud Shell Editor 中打开 app.js 文件。

  2. 在 Gemini 聊天中，输入如下提示：

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

    Gemini 的回答将类似于以下内容：

    如需将 Express 软件包和 ejs 软件包添加到您的 app.js 文件中，您可以使用以下代码：

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

    这将需要 Express 和 ejs 软件包，并使其可在 app.js 文件中使用。

  3. 将 Gemini 提供的代码添加到您的 app.js 文件中。

生成带注释的代码

Cloud Code 插件具有一项功能，可让 Gemini 使用文件注释生成代码。例如，当您在文件中将注释添加为占位符时，可以提示 Gemini 生成代码（如注释中所述）。

如需在 app.js 文件中使用此功能，请确保在 Cloud Shell Editor 中启用了 Gemini。

  1. 在文件末尾，添加评论占位符以初始化 Web 应用。例如：

    // Initialize express web app using ejs templating engine

  2. 将文本光标移动到注释的末尾，然后按 Control+Enter（适用于 Windows 和 Linux）或 Control+Return（适用于 MacOS），然后按 Tab 键，即可使用 Gemini 的代码生成功能生成代码。

    Gemini 的响应会在注释下方显示两行代码，类似于以下内容：

    // Initialize express web app using ejs templating engine

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

    如果代码生成输出内容与您的预期不同，请根据需要修改或删除多余内容。

接下来，添加更多注释，为您的 Express Web 应用生成基本功能。

  1. 转到 app.js 文件底部，并添加以下注释：

    // 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. 为每个文件注释生成代码，方法与之前生成代码的方式类似。

  3. 在接受建议之前，请检查生成的代码是否准确无误。

    app.js 文件中的注释现在应该附带相应的代码，类似于以下内容：

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

创建 package.json 文件

为基本应用生成代码后，创建内容并将其添加到 package.json 文件。

  1. 在 app.js 文件所在的目录中创建一个 package.json 文件。

  2. 在 Cloud Shell Editor 中，选择 spark Gemini 并输入如下提示：

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

    Gemini 的响应应该会建议要指定的启动脚本和依赖项，内容将类似于以下内容：

    好的。以下是可与 app.js 文件搭配使用的 package.json 文件：

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

    此 package.json 文件包含以下信息：

    应用的名称 (my-app)
    应用的版本 (1.0.0)
    应用的说明（使用 Express 和 EJS 的简单 Node.js Web 应用。）
    应用的主文件 (app.js)
    可在应用上运行的脚本（开始）
    应用的依赖项（express 和 ejs）

  3. 请仅将 Gemini 提供的内容复制并粘贴到您的 package.json 文件中。

创建 ejs 模板

如需完成 Web 应用，请在 app.js 和 package.json 文件所在的同一目录中，为 ejs 模板创建一个 views 目录。

  1. 在您的终端中，输入以下内容：

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

  2. 在编辑器中打开 index.ejs 文件，然后粘贴以下内容：

    <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. 在编辑器中打开 greeting.ejs 文件，然后粘贴以下内容：

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

在浏览器中预览应用

完成应用代码、模板和要求后，您现在可以确认应用能否正常运行。

  1. 运行以下命令以安装依赖项。

    npm install

  2. 运行以下命令以启动应用：

    npm start

  3. 确认应用可正常运行。选择 Cloud Shell 任务栏右上角的网页预览按钮。然后，从显示的菜单中选择端口号。Cloud Shell 将在新的浏览器窗口中打开预览网址。

编写单元测试

确认 Node.js 应用可正常运行后，您可以先在 test.js 文件中编写单元测试，然后再将应用部署到 Cloud Run。在以下示例中，您将请求 Gemini 帮助生成针对 HTTP 响应代码 200 的单元测试。

  1. 在 app.js 文件底部，添加以下代码行以导出应用文件。

    module.exports = app;

  2. 打开 test.js 文件。

  3. 如需测试响应何时返回 HTTP 200 状态代码，请打开 Gemini 聊天窗格并输入如下提示：

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

    Gemini 应该会如下所示：

    好的。以下是 app.js 中主路由的单元测试，可确保响应代码为 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);
  });
});

    此测试检查主路线是否返回状态代码 200。

    将建议的代码块添加到您的 test.js 文件中。

  4. 在终端中运行以下命令，安装 Mocha 测试和超级测试软件包：

    npm i mocha supertest

  5. 更新 package.json 文件以包含新的测试脚本及其软件包。例如：

    {
  "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. 运行以下命令以运行测试：

    npm test

如果没有错误，您的测试应显示为通过。如果您想为其他路由添加其他测试，请继续请求 Gemini 提供将添加到 test.js 文件中的建议。

部署到 Cloud Run

应用现已在本地运行后，您可以继续部署到 Google Cloud。Cloud Run 非常适合此场景，因为您可以从源代码进行部署，而无需在应用运行时管理任何基础架构。

  1. 在 Gemini 聊天中，询问 Gemini 如何使用 gcloud 直接从您的源代码部署到 Cloud Run：

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

    Gemini 应该会回复类似如下的内容：

    您可以使用 gcloud 从当前目录中的源代码直接部署到 Cloud Run。为此，您可以将 gcloud run deploy 命令与 --source flag 搭配使用。此标志指示 gcloud 使用您的源代码构建容器映像并将其部署到 Cloud Run。

    例如，如需将 app.js 文件中的代码部署到 Cloud Run，您可以使用以下命令：

    gcloud run deploy app --source .

    此命令将从 app.js 文件构建容器映像，并将其部署到 Cloud Run。

    您还可以使用 --region 标志指定要部署应用的区域。例如，将应用部署到 us-central1 区域，您可以使用以下命令：

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

    如需详细了解如何从源代码部署到 Cloud Run，请参阅 Cloud Run 文档。

  2. 使用 Gemini 在响应中提供的 gcloud 命令。

  3. 按照提示选择区域，然后选择相应选项，以允许对测试应用进行未经身份验证的调用。应用部署成功后，输出将返回服务网址。

清理

为避免系统因本教程中使用的资源向您的 Google Cloud 帐号收取费用，您可以删除为本教程创建的 Google Cloud 项目。或者，您也可以删除各个资源。

  1. 警告：删除项目会产生以下影响：
    • 项目中的所有内容都会被删除。如果您使用现有项目来处理本文档中的任务，则删除该项目后，您在该项目中完成的任何其他工作也会一并删除。
    • 自定义项目 ID 会丢失。创建此项目时，您可能创建了要在将来使用的自定义项目 ID。如需保留使用该项目 ID 的网址（例如 appspot.com 网址），请删除项目内的所选资源，而不是删除整个项目。

  2. 如果您打算探索多个架构、教程或快速入门，重复使用项目可以帮助您避免超出项目配额限制。在 Google Cloud 控制台中，转到管理资源页面。

    转到“管理资源”

  3. 在项目列表中，选择要删除的项目，然后点击删除。

  4. 在对话框中输入项目 ID，然后点击关停以删除项目。

后续步骤