Создайте собственный Copilot или DALLE-2: как интегрировать GPT в ваши JS-проекты

Чтобы обучить достойную модель машинного обучения, требуются годы.

Компьютеры не так умны, как мы думаем, поэтому они не торопятся, учась находить разницу между кошками и собаками.

Но, к счастью, вам не нужно тратить годы на сбор милых фотографий кошек и собак, чтобы обучить собственную модель. Вместо этого вы можете воспользоваться существующими моделями, обученными сотнями людей. Эти модели уже довольно сообразительны: кто-то из них может написать стихотворение, кто-то — код, а кто-то — нарисовать красивые картинки.

Модель, на которой я хотела сегодня остановиться, — это GPT. Некоторые даже называют ее гуманоидом в процессе создания, настолько она умна. Она принимает подсказку и выдает вам реальный текст в качестве вывода.

Модель может создать что угодно, от твита до целого стихотворения или короткого рассказа. Недавно мне было интересно интегрировать ее в один из моих проектов Next.js, поэтому я узнала несколько изящных приемов, которыми хочу поделиться сегодня.

💡 Подсказка: обратите внимание, что это пошаговое руководство не подходит для начинающих. Я предполагаю, что вы уже знаете JavaScript и используете в своем проекте Next.js или Node.js. Если вам нужно пошаговое руководство, я оставлю ссылку в конце статьи.

Все начинается с игровой площадки

Если вы никогда раньше не работали с предварительно обученными моделями, создайте бесплатную учетную запись OpenAI и встретимся на игровой площадке.

Как новый пользователь, вы получите кредит $18, который будет действителен в течение нескольких месяцев, чтобы вы могли свободно начать экспериментировать.

Напишите свою первую подсказку

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

Так что отправляйтесь на игровую площадку и попросите ее вам что-нибудь написать. Все равно что. Просто дайте побольше деталей.

Несколько идей, чтобы начать:

• Напиши мне песню о…
• Сгенерируй пять идей для Twitter о…
• Напиши мне несколько прикольных названий фильмов…

💡 Совет: будьте как можно более конкретными. Если вы сравните общие подсказки, такие как «Напиши мне…», с более конкретными («Сгенерируй 10 уникальных идей о…»), вы быстро заметите разницу!

Цепочка подсказок

Еще один хитрый трюк, который вы можете использовать — это цепочка подсказок.

Скопируйте вкладку с игровой площадкой и используйте полученный результат во втором окне.

Например:

1. попросите модель в первом окне сгенерировать идею блога;
Онлайн-курс "Чистий код та патерни проєктування" від robot_dreams.
Прискорюйте й спрощуйте процес розробки.Під менторством лектора з 15-річним досвідом ви навчитеся застосовувати 20+ шаблонів, опануєте рефакторинг і принципи чистого коду.
Детальніше
2. вставьте эту идею блога в следующее окно и попросите модель написать вам краткое изложение;
3. в третьем окне вы можете вставить краткое резюме и попросить модель написать целый пост.

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

Но как это работает?

Автор иллюстрации: Jay Alammar

Я не собираюсь вдаваться в 101 подробность об ML, но вкратце:

• GPT состоит из множества «параметров» — каждый параметр представляет собой специализированное число. Когда вы вводите предложение в GPT, оно объединяет это предложение с параметрами, чтобы его закончить.
• В GPT есть 175 миллиардов таких параметров и это составляет 800 ГБПо состоянию на конец 2022 года.
• GPT не понимает слов. Все это просто число для модели, включая вашу подсказку.

Упрощенная версия происходящего под капотом выглядит примерно так:

output = input * parameter

Автор иллюстрации: Jay Alammar

Вам нужен всего один npm-пакет

Есть несколько способов интеграции моделей OpenAI, но самый простой — использовать npm-пакет. Это пакет NodeJS, и вы можете установить его, как обычно, в свои проекты JavaScript, используя npm или yarn:

$ npm install openai

После того, как вы его установили, нужно создать файл .env, в котором будет храниться ваш ключ Open AI, и добавить новый файл в серверную часть, который будет вызывать API.

Здесь вы можете получить ключ API. Получив его, добавьте новую строку в файл .env:

OPENAI_API_KEY="your-key-here"

💡 Подсказка: если вы часто тестируете свое приложение, у вас, вероятно, скоро закончится кредит. Не забудьте проверить остаток здесь.

Теперь единственный кусок кода на бэкенде, который вам нужен, это:

import { Configuration, OpenAIApi } from 'openai';

const configuration = new Configuration({
  apiKey: process.env.OPENAI_API_KEY,
});

const openai = new OpenAIApi(configuration);

const basePromptPrefix = "Write me a tweet about...";
const generateAction = async (req, res) => {
  // show your prompt
  console.log(`API: ${basePromptPrefix}${req.body.userInput}`)

  const baseCompletion = await openai.createCompletion({
    model: 'text-davinci-003',
    prompt: `${basePromptPrefix}${req.body.userInput}`,
    temperature: 0.7,
    max_tokens: 250,
  });
  
  const basePromptOutput = baseCompletion.data.choices.pop();

  res.status(200).json({ output: basePromptOutput });
};

export default generateAction;

Вот что мы делаем:

• Импортируем конфигурации для настройки соединения и OpenAIApi для совершения вызова.
Онлайн-курс "Корпоративна культура" від Laba.
Як з нуля побудувати стабільну корпоративну культуру, систему внутрішньої комунікації та бренд роботодавця, з якими ви підвищите продуктивність команди, — пояснить HR-директор Work.ua.
Детальніше про курс
• Установливаем соединение с Open AI, указав наш API Key.
• Устанавливаем базовую подсказку — это может быть все, что указывает на то, что вы ожидаете получить от этой модели. Таким образом вашему пользователю просто нужно ввести остальное, чтобы получить правильный результат.
• Принимаем ввод пользователя и выводим его на консоль вместе с базовой подсказкой.
• Вызываем Open AI и указываем модель (text-davinci-003) вместе с несколькими наиболее важными параметрами, такими как температура (более высокое значение температуры означает большую случайность) и длина вывода (всего 250 — это около 1000 символов).
• Возвращаем результат в формате JSON.

Это фрагмент кода из приложения Next.js, поэтому на внешнем интерфейсе я могу просто вызвать свою новую конечную точку и передать ей приглашение пользователя в качестве параметра. Затем я могу сохранить результат в переменной и делать с ним все, что захочу. Это было не сложно, правда?

Несколько креативных идей для проекта

• Создавать посты для Twitter из больших кусков текста.
• Создавать воображаемых друзей или бота, разговаривающего как Илон Маск.
• Создавать выжимки из статей.
Курс English For Tech course від Enlgish4IT.
Лише 7 тижнів по 20-30 хвилин щоденного навчання допоможуть вам подолати комунікативні бар'єри. Отримайте знижку 10% за промокодом ITCENG.
Дійзнайтеся більше
• Генерировать заголовки для статей в блоге.

Надеюсь, эта статья вдохновила вас на создание чего-то потрясающего!

Если вы новичок и ищете больше пошагового руководства, я настоятельно рекомендую ознакомиться с этим замечательным бесплатным курсом от Buildspace. Удачи!

Это текст из личного блога, опубликованный с разрешения автора.