Автоматическое развертывание веб-приложения Genkit с генеративным искусственным интеллектом Node.js из системы управления версиями в облако

1. Обзор

Первое развертывание веб-приложения может быть пугающим. Если даже после первого развертывания этот процесс требует слишком много работы, вы можете избежать развертывания новых версий вашего приложения. Благодаря непрерывному развертыванию вы можете легко автоматически развертывать изменения вашего приложения.

В ходе этой лабораторной работы вы напишете веб-приложение и настроите Cloud Run для автоматического развертывания вашего приложения при внесении изменений в исходный код вашего приложения. Затем вы изменяете свое приложение и развертываете его снова.

Что вы узнаете

• Напишите веб-приложение с помощью редактора Cloud Shell.
• Сохраните код приложения на GitHub.
• Автоматически развертывайте свое приложение в Cloud Run

• Добавьте генеративный ИИ в свое приложение с помощью Genkit
• Управляйте подсказками LLM с помощью библиотеки dotprompt.

2. Предварительные условия

1. Если у вас еще нет учетной записи Google, вам необходимо создать учетную запись Google .
   • Используйте личную учетную запись вместо рабочей или учебной учетной записи. Рабочие и учебные учетные записи могут иметь ограничения, не позволяющие вам включить API, необходимые для этой лабораторной работы.
2. Если у вас еще нет учетной записи GitHub, вам необходимо создать учетную запись GitHub.
   • Используйте существующую учетную запись GitHub, если она у вас есть. GitHub с большей вероятностью заблокирует новую учетную запись как спам.
   • Настройте двухфакторную аутентификацию в своей учетной записи GitHub, чтобы снизить вероятность того, что ваша учетная запись будет помечена как спам.

3. Настройка проекта

1. Войдите в Google Cloud Console .
2. Включите биллинг в Cloud Console.
   • Завершение этой лабораторной работы должно стоить менее 1 доллара США в облачных ресурсах.
   • Вы можете выполнить действия, описанные в конце этого практического занятия, чтобы удалить ресурсы и избежать дальнейших расходов.
   • Новые пользователи имеют право на бесплатную пробную версию стоимостью 300 долларов США .
   • Посещаете мероприятие Gen AI for Devs? Может быть доступен кредит в размере 1 доллара США .
3. Создайте новый проект или повторно используйте существующий проект.
4. Убедитесь, что оплата включена в разделе «Мои проекты» в Cloud Billing.
   • Если в вашем новом проекте в столбце Billing account указано, Billing is disabled :
     1. Нажмите на три точки в столбце « Actions .
     2. Нажмите Изменить платеж.
     3. Выберите платежный аккаунт, который вы хотите использовать.
   • Если вы посещаете мероприятие Gen AI for Devs, учетная запись, скорее всего, будет называться Пробная учетная запись Google Cloud Platform.

4. Откройте редактор Cloud Shell.

1. Перейдите в редактор Cloud Shell.
2. Если терминал не отображается в нижней части экрана, откройте его:
   • Нажмите на гамбургер-меню
   • Нажмите Терминал
   • Нажмите «Новый терминал».
3. В терминале настройте свой проект с помощью этой команды:
   • Формат:

     gcloud config set project [PROJECT_ID]
     

   • Пример:

     gcloud config set project lab-project-id-example
     

   • Если вы не можете вспомнить идентификатор своего проекта:
     • Вы можете перечислить все идентификаторы ваших проектов с помощью:

       gcloud projects list | awk '/PROJECT_ID/{print $2}'
       

     
4. Если будет предложено авторизоваться, нажмите «Авторизовать» , чтобы продолжить.
5. Вы должны увидеть это сообщение:

   Updated property [core/project].
   

   Если вы видите WARNING и вас спрашивают Do you want to continue (Y/N)? , то, вероятно, вы неправильно ввели идентификатор проекта. Нажмите N , нажмите Enter и попробуйте еще раз запустить команду gcloud config set project .

5. Включите API

В терминале включите API:

gcloud services enable \
  run.googleapis.com \
  cloudbuild.googleapis.com \
  aiplatform.googleapis.com

Выполнение этой команды может занять несколько минут, но в конечном итоге она должна выдать успешное сообщение, подобное этому:

Operation "operations/acf.p2-73d90d00-47ee-447a-b600" finished successfully.

6. Настройте Git

1. Установите свой глобальный адрес электронной почты пользователя git:

   git config --global user.email "[e-mail]"
   

2. Установите свое глобальное имя пользователя git:

   git config --global user.name "Your Name"
   

3. Установите для глобальной ветки git по умолчанию значение main :

   git config --global init.defaultBranch main
   

7. Напишите свой код

Чтобы написать приложение на Node.js:

1. Перейдите в домашний каталог:

   cd ~
   

2. Создайте каталог codelab-genai :

   mkdir codelab-genai
   

3. Перейдите в каталог codelab-genai :

   cd codelab-genai
   

4. Создайте файл index.js :

   touch index.js
   

5. Создайте файл package.json :

   npm init es6 -y
   

6. Добавить express как зависимость

   npm install express
   

7. Добавьте файл .gitignore , чтобы предотвратить фиксацию node_modules

   echo node_modules/ >> .gitignore
   

8. Откройте файл index.js в редакторе Cloud Shell:

   cloudshell edit index.js
   

   Пустой файл должен появиться в верхней части экрана. Здесь вы можете редактировать файл index.js .
9. Скопируйте следующий код и вставьте его в открытый файл index.js :

   import express from 'express';
   
   const app = express();
   app.get('/', async (req, res) => {
       res.send('Hello world!');
   });
   
   const port = process.env.PORT || 8080;
   app.listen(port, () => {
       console.log(`codelab-genai: listening on port ${port}`);
   });
   

   Через несколько секунд редактор Cloud Shell автоматически сохранит ваш код. Этот код отвечает на http-запросы фразой «Hello world!». приветствие.

Ваш исходный код вашего приложения готов и готов к хранению в системе контроля версий.

8. Создайте репозиторий

1. Вернитесь к терминалу Cloud Shell в нижней части экрана.
2. Убедитесь, что вы все еще находитесь в правильном каталоге:

   cd ~/codelab-genai
   

3. Инициализируйте свой git-репозиторий

   git init -b main
   

4. Войдите в интерфейс командной строки GitHub.

   gh auth login
   

   Нажмите Enter , чтобы принять параметры по умолчанию, и следуйте инструкциям инструмента GitHub CLI, включая:
   1. В какой аккаунт вы хотите войти? GitHub.com
   2. Какой протокол вы предпочитаете для операций Git на этом хосте? HTTPS
   3. Аутентифицировать Git с помощью своих учетных данных GitHub? Y (пропустите, если этот пункт не отображается.)
   4. Как бы вы хотели аутентифицировать GitHub CLI? Login with a web browser
   5. Скопируйте свой одноразовый код
   6. Откройте https://github.com/login/device.
   7. Вставьте свой одноразовый код
   8. Нажмите «Авторизовать github».
   9. Завершите вход
5. Подтвердите, что вы вошли в систему:

   gh api user -q ".login"
   

   Если вы успешно вошли в систему, должно быть выведено ваше имя пользователя GitHub.
6. Создайте переменную GITHUB_USERNAME .

   GITHUB_USERNAME=$(gh api user -q ".login")
   

7. Подтвердите, что вы создали переменную среды:

   echo ${GITHUB_USERNAME}
   

   Если вы успешно создали переменную, должно быть выведено ваше имя пользователя GitHub.
8. Создайте пустой репозиторий GitHub с именем codelab-genai :

   gh repo create codelab-genai --private
   

   Если вы получили сообщение об ошибке:

   GraphQL: Name already exists on this account (createRepository)
   

   Тогда у вас уже есть репозиторий с именем codelab-genai . У вас есть два варианта продолжить изучение этого руководства:
   • Удалите существующий репозиторий GitHub.
   • Создайте репозиторий с другим именем и не забудьте изменить его с помощью следующих команд.
9. Добавьте репозиторий codelab-genai в качестве удаленного origin :

   git remote add origin https://github.com/${GITHUB_USERNAME}/codelab-genai
   

9. Поделитесь своим кодом

1. Подтвердите, что вы находитесь в правильном каталоге:

   cd ~/codelab-genai
   

2. Добавьте все файлы в текущем каталоге в этот коммит:

   git add .
   

3. Создайте первый коммит:

   git commit -m "add http server"
   

4. Отправьте свой коммит в main ветку origin репозитория:

   git push -u origin main
   

Вы можете запустить эту команду и посетить полученный URL-адрес, чтобы просмотреть код вашего приложения на GitHub:

echo -e "\n\nTo see your code, visit this URL:\n \
    https://github.com/${GITHUB_USERNAME}/codelab-genai/blob/main/index.js \n\n"

10. Настройте автоматическое развертывание

1. Оставьте вкладку «Редактор Cloud Shell» открытой. К этой вкладке мы вернемся позже.
2. В новой вкладке перейдите на страницу Cloud Run.
3. Выберите правильный проект Google Cloud в консоли.
4. Нажмите ПОДКЛЮЧИТЬ РЕПО.
5. Нажмите НАСТРОЙКА С ПОМОЩЬЮ CLOUD BUILD.
   1. Выберите GitHub в качестве поставщика репозитория.
      • Если вы не вошли в свою учетную запись GitHub в браузере, войдите в систему, используя свои учетные данные.
   2. Нажмите «Аутентификация» , а затем нажмите « Продолжить» .
   3. После входа в систему на странице Cloud Run вы увидите сообщение о том, что приложение GitHub не установлено ни в одном из ваших репозиториев.
   4. Нажмите кнопку «УСТАНОВИТЬ GOOGLE CLOUD BUILD» .
      • На странице «Настройка установки» выберите «Только выбирать репозитории» и выберите репозиторий codelab-genai , который вы создали с помощью CLI.
      • Нажмите «Установить».
      • Примечание. Если у вас много репозиториев GitHub, загрузка может занять несколько минут.
   5. Выберите your-user-name/codelab-genai в качестве репозитория.
      • Если репозиторий отсутствует, щелкните ссылку «Управление подключенными репозиториями» .
   6. Оставьте ветку как ^main$
   7. Выберите Go, Node.js, Python, Java, .NET Core, Ruby или PHP с помощью сборочных пакетов Google Cloud.
      • Остальные поля ( Build context directory , Entrypoint и Function target ) оставьте без изменений.
   8. Нажмите «Сохранить».
6. Прокрутите вниз до пункта «Аутентификация».
7. Нажмите «Разрешить неаутентифицированные вызовы».
8. Нажмите СОЗДАТЬ

После завершения сборки (которая займет несколько минут) запустите эту команду и посетите полученный URL-адрес, чтобы просмотреть работающее приложение:

echo -e "\n\nOnce the build finishes, visit your live application:\n \
    "$( \
        gcloud run services list | \
        grep codelab-genai | \
        awk '/URL/{print $2}' | \
        head -1 \
    )" \n\n"

11. Измените свой код

Вернуться в редактор Cloud Shell

Если у вас все еще открыт редактор Cloud Shell, вы можете пропустить эти шаги.

1. Перейдите в редактор Cloud Shell.
2. Если терминал не отображается в нижней части экрана, откройте его:
   • Нажмите на гамбургер-меню
   • Нажмите Терминал
   • Нажмите «Новый терминал».
3. В терминале настройте свой проект с помощью этой команды:
   • Формат:

     gcloud config set project [PROJECT_ID]
     

   • Пример:

     gcloud config set project lab-project-id-example
     

   • Если вы не можете вспомнить идентификатор своего проекта:
     • Вы можете перечислить все идентификаторы ваших проектов с помощью:

       gcloud projects list | awk '/PROJECT_ID/{print $2}'
       

     
4. Если будет предложено авторизоваться, нажмите «Авторизовать» , чтобы продолжить.
5. Вы должны увидеть это сообщение:

   Updated property [core/project].
   

   Если вы видите WARNING и вас спрашивают Do you want to continue (Y/N)? , то, вероятно, вы неправильно ввели идентификатор проекта. Нажмите N , нажмите Enter и попробуйте еще раз запустить команду gcloud config set project .

Добавьте Genkit и Vertex AI в свое приложение.

1. Вернитесь к терминалу Cloud Shell в нижней части экрана.
2. Убедитесь, что вы все еще находитесь в правильном каталоге:

   cd ~/codelab-genai
   

3. Установите Node.js Genkit SDK:

   npm install @genkit-ai/ai
   

4. Установите Node.js Genkit SDK для Vertex AI:

   npm install @genkit-ai/vertexai
   

5. Снова откройте index.js в редакторе Cloud Shell.

   cloudshell edit ~/codelab-genai/index.js
   

6. Замените код в файле index.js на:

   import express from 'express';
   const app = express();
   
   import { genkit } from 'genkit';
   import { gemini15Flash, vertexAI } from '@genkit-ai/vertexai';
   
   const ai = genkit({
       plugins: [
           vertexAI({ location: 'us-central1' }),
       ],
   });
   
   app.get('/', async (req, res) => {
       const animal = req.query.animal || 'dog';
       const prompt = `Give me 10 fun facts about ${animal}. Return this as html without backticks.`
       const llmResponse = await ai.generate({
           model: gemini15Flash,
           prompt: prompt,
       });
       const html = llmResponse.text;
       res.send(html);
   });
   
   const port = process.env.PORT || 8080;
   app.listen(port, () => {
       console.log(`codelab-genai: listening on port ${port}`);
   });
   

1. Убедитесь, что вы по-прежнему находитесь в правильном каталоге Cloud Shell:

   cd ~/codelab-genai
   

2. Запустите эти команды, чтобы зафиксировать новую версию вашего приложения в локальном репозитории git:

   git add .
   git commit -m "add latest changes"
   

3. Отправьте изменения на GitHub:

   git push
   

4. После завершения сборки запустите эту команду и посетите развернутое приложение:

   echo -e "\n\nOnce the build finishes, visit your live application:\n \
       "$( \
           gcloud run services list | \
           grep codelab-genai | \
           awk '/URL/{print $2}' | \
           head -1 \
       )" \n\n"
   

Завершение сборки может занять несколько минут, прежде чем вы сможете увидеть изменения.

Вы можете просмотреть историю всех изменений здесь: https://console.cloud.google.com/run/detail/us-central1/codelab-genai/revisions.

12. (Необязательно) Используйте файлы .prompt с Genkit.

1. Вернитесь к терминалу Cloud Shell в нижней части экрана.
2. Убедитесь, что вы все еще находитесь в правильном каталоге:

   cd ~/codelab-genai
   

3. Создайте папку prompts для хранения подсказок:

   mkdir prompts
   

4. Создайте файл animal-facts.prompt , чтобы создать первое приглашение:

   touch prompts/animal-facts.prompt
   

5. Откройте файл animal-facts.prompt в редакторе Cloud Shell:

   cloudshell edit ~/codelab-genai/prompts/animal-facts.prompt
   

6. Отредактируйте animal-facts.prompt и вставьте в него следующий код:

   ---
   model: vertexai/gemini-1.5-flash
   input:
       schema:
           animal: string
   ---
   
   Give me 10 fun facts about {{animal}}. Return the results as HTML without markdown backticks.
   

7. Откройте файл index.js в редакторе Cloud Shell:

   cloudshell edit ~/codelab-genai/index.js
   

8. Замените код в файле index.js на:

   import express from 'express';
   const app = express();
   
   import { genkit } from 'genkit';
   import { vertexAI } from '@genkit-ai/vertexai';
   
   const ai = genkit({
       plugins: [
           vertexAI({ location: 'us-central1' }),
       ],
   });
   
   app.get('/', async (req, res) => {
       const animal = req.query.animal || 'dog';
       const animalPrompt = ai.prompt('animal-facts');
       const llmResponse = await animalPrompt({animal});
       const html = llmResponse.text;
       res.send(html);
   });
   
   const port = process.env.PORT || 8080;
   app.listen(port, () => {
       console.log(`codelab-genai: listening on port ${port}`);
   });
   

1. Убедитесь, что вы по-прежнему находитесь в правильном каталоге Cloud Shell:

   cd ~/codelab-genai
   

2. Запустите эти команды, чтобы зафиксировать новую версию вашего приложения в локальном репозитории git:

   git add .
   git commit -m "add latest changes"
   

3. Отправьте изменения на GitHub:

   git push
   

4. После завершения сборки запустите эту команду и посетите развернутое приложение:

   echo -e "\n\nOnce the build finishes, visit your live application:\n \
       "$( \
           gcloud run services list | \
           grep codelab-genai | \
           awk '/URL/{print $2}' | \
           head -1 \
       )" \n\n"
   

Завершение сборки может занять несколько минут, прежде чем вы сможете увидеть изменения.

Вы можете просмотреть историю всех изменений здесь: https://console.cloud.google.com/run/detail/us-central1/codelab-genai/revisions.

13. (Необязательно) Используйте системные подсказки.

На этом шаге предполагается, что вы уже добавили файлы .prompt на предыдущем шаге.

1. Вернитесь к терминалу Cloud Shell в нижней части экрана.
2. Убедитесь, что вы все еще находитесь в правильном каталоге:

   cd ~/codelab-genai
   

3. Откройте файл animal-facts.prompt в редакторе Cloud Shell:

   cloudshell edit ~/codelab-genai/prompts/animal-facts.prompt
   

4. Отредактируйте animal-facts.prompt и вставьте в него следующий код:

   ---
   model: vertexai/gemini-1.5-flash
   config:
       temperature: 0.9
   input:
       schema:
           animal: string
   ---
   
   role "system"
   The user should have submitted an animal.
   If the user requests anything besides animal fun facts, respond in a kind and firm manner that you only provide information about fun facts.
   Give the user 10 fun facts about the animal the user provided.
   All responses should be valid HTML without markdown backticks.
   
   role "user"
   {{animal}}
   

1. Убедитесь, что вы по-прежнему находитесь в правильном каталоге Cloud Shell:

   cd ~/codelab-genai
   

2. Запустите эти команды, чтобы зафиксировать новую версию вашего приложения в локальном репозитории git:

   git add .
   git commit -m "add latest changes"
   

3. Отправьте изменения на GitHub:

   git push
   

4. После завершения сборки запустите эту команду и посетите развернутое приложение:

   echo -e "\n\nOnce the build finishes, visit your live application:\n \
       "$( \
           gcloud run services list | \
           grep codelab-genai | \
           awk '/URL/{print $2}' | \
           head -1 \
       )" \n\n"
   

Завершение сборки может занять несколько минут, прежде чем вы сможете увидеть изменения.

Вы можете просмотреть историю всех изменений здесь: https://console.cloud.google.com/run/detail/us-central1/codelab-genai/revisions.

14. Поздравления

В ходе этой лабораторной работы вы написали веб-приложение и настроили Cloud Run для автоматического развертывания вашего приложения при внесении изменений в исходный код вашего приложения. Затем вы изменили свое приложение и снова развернули его.

Если вам понравилась эта лабораторная работа, вы можете попробовать ее еще раз на другом языке программирования или в другой среде:

• Питон
• Node.js
• Идти
• Ява
• Угловой
• Next.js

Вот несколько вариантов продолжения обучения:

• Документация Genkit: начало работы
• Codelab для добавления наблюдаемости в ваше приложение Node.js: практические методы наблюдения для приложения генеративного ИИ на Javascript
• Codelab для добавления внешнего интерфейса в ваше приложение с помощью Next.js: автоматическое развертывание веб-приложения Generative AI Next.js из системы управления версиями в облако
• Codelab, чтобы показать, как использовать вызов функций: Как использовать вызов функций Gemini с Cloud Run
• Codelab для использования искусственного интеллекта для обработки видеоконтента: как использовать Cloud Run Jobs Video Intelligence API для пошаговой обработки видео