Вайбкодинг в Битрикс24: как собрать приложение самому

Вайбкодинг в Битрикс24: как собрать приложение самому
Время прочтения:
7 минуты
Обычно мы проводим короткие видеообзоры обновлений Битрикс24, где показываем, как новые функции встраиваются в бизнес-процессы. Майский релиз оказался сложнее обычного, в платформу внедрили полноценный ИИ. Поэтому вместо короткого обзора провели онлайн-практикум, где разобрали новые AI-инструменты и в прямом эфире собрали приложение через вайбкод под задачу.

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

Статья сделана на основе прошлого вебинара «AI обновления в Битрикс24». Внутри всё, что нужно знать о новых инструментах, и инструкция, как вайбкодить свои приложения для CRM. Запись практикума удобно смотреть параллельно с текстом и сразу собирать приложение под себя.

Смотреть запись практикума AI в CRM Битрикс24: разбор обновлений — ссылка на просмотр в Вконтакте

Что такое вайбкодинг простыми словами

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

Год-два назад нейросеть выдавала только куски кода, разработчик их проверял и дополнял, постепенно превращаясь из простого кодера в архитектора сервиса. Сейчас AI-ассистент может собрать готовое рабочее приложение целиком.

Сначала про три слова, которые встретятся дальше:

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

Прежде чем собирать своё приложение, стоит выбрать способ. Автоматизацию под задачу бизнеса делают двумя разными путями.

Первый подход: вайбкодинг

Те самые текстовые задачи, которые отправляют AI-ассистенту (Codex или Claude), и он собирает готовое приложение. Это быстро, но внутреннее устройство остаётся непрозрачным. Помимо этого надо разобраться, как готовое приложение подключить к своим системам и разместить на сервере. Если нужно приложение, которое интегрирует в себе несколько сервисов (например, сбор заявок с сайта и мессенджеров), этот подход будет сложнее и дольше. Он ближе к тем, кто разбирается в разработке или будет править код, то есть к ИТ-специалистам.

Писать код будет внешняя нейросеть, которую вы подключаете по API-ключу. Инструментов на рынке заметно больше четырёх, но проверенный срез такой:

Claude — claude.ai. Один из самых популярных для вайбкодинга, отдельно решается вопрос с доступом из РФ.
ChatGPT с Codex — chatgpt.com. Собирали приложение на нём в эфире, позволяет переключать модели под задачу.
Cursor — cursor.com. Редактор кода с AI-ассистентом внутри.
Битрикс24 Коворк Код — cowork.bitrix24.ru. Десктопное приложение с ИИ-агентом на базе BitrixGPT, которое автоматизирует рутинные задачи и создает рабочие микроприложения прямо внутри вашей экосистемы Битрикс24. На момент вебинара была в бете и показалась сыроватой, поэтому в эфире не использовали.

Рейтинги ИИ моделей переписываются постоянно, сегодня впереди одна, через месяц другая. Есть и сложности с доступом к AI-ассистентам, нужна отдельная оплаченная подписка (не РФ) и рабочий VPN. Во время онлайн-вебинара использовали Codex.

Второй подход: конструкторы сценариев

Этот способ подходит тем, кто минимально связан с разработкой. Любой процесс собирается из блоков-нод, логика остаётся видимой и управляемой без погружения в код. Подходит, когда в код углубляться незачем, но контролировать, как работает процесс, хочется.

n8n — n8n.io. Зарубежный сервис для создания ИИ-автоматизаций из блоков. Интерфейс на английском, доступ через VPN, нужен оплаченный зарубежный аккаунт. Очень широкий функционал, полезен и ИТ-специалистам, и обычным пользователям.

Подпислон AI-агенты — agents.podpislon.ru. Российский аналог n8n. Процесс собирается так же из блоков, поддерживает большинство интеграций с сервисами, которые использует бизнес в России. Есть готовые шаблоны автоматизаций с ИИ, которые легко подключить к своим порталам.

Что лучше, вопрос неправильный. Есть первый подход, есть второй, а дальше вы выбираете под свою задачу. Где-то важнее доступ к коду, а где-то скорость и низкий порог входа. Дальше разбираем первый подход на платформе Битрикс24 Вайбкод.

Что можно собрать вайбкодингом в Битрикс24

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

С помощью вайбкодинга можно своими силами собрать новую кнопку или раздел в интерфейсе портала, отчёт или дашборд, которого нет в штатной сборке, калькулятор под конкретную методику расчёта, небольшой инструмент под задачу одного отдела. В таких задачах везде понятная логика, ограниченный набор данных и один сценарий использования. Пока приложение живёт на уровне MVP, вайбкодинг кажется очень полезным инструментом.

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

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

Что нужно до старта

1. Всё держится на REST API Битрикс24, поэтому понадобятся коммерческий тариф портала и подписка BitrixGPT + Маркетплейс. Регистрация в вайбкод-платформе Битрикс24 и выдача ей доступов.

2. Платить внутри платформы придётся вайбами, это её внутренняя валюта. Списываются за работу сервера и за обращения к BitrixGPT.

3. Плюс подписка на того AI-ассистента, через которого будете собирать. В эфире работали через ChatGPT с программой Codex.

Сборка приложения «План продаж»: по шагам

Для наших задач будем пробовать собрать вот такое приложение для отдела продаж. Это небольшой дашборд по сделкам сотрудников для руководителя. Ниже пошаговая инструкция:



Шаг 1. Понять, что вообще нужно

Перед промтом всегда стоит потребность. Без неё нейросеть соберёт что-то абстрактно правильное и никому не нужное. Для начала нам нужно сформулировать, какое приложение нам необходимо в Битрикс.

Как было. Представим, что наш руководитель отдела продаж каждый день собирает статистику руками. Ему нужно отфильтровать сделки по менеджеру, просуммировать в Excel, не забыть фильтр по периоду. А иногда приходится писать каждому сотруднику в личку, собрать цифры и потом их же перепроверить.

Как хотелось. Зайти в Битрикс24, открыть готовый отчёт: фильтр по сотруднику и периоду, прогресс-бар, план, факт, остаток. И чтобы руководитель мог поставить каждому свой план на месяц. Зимой продажи активные, план больше, летом не сезон, план меньше.

Шаг 2. Создать API-ключ и раздать права

В левом меню вайбкод-платформы есть раздел «API-ключи». Кнопка «Создать», название, ниже режим доступа и права.


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

Сразу после создания платформа отдаёт готовый промт для нейросети, ключ в нём уже подставлен.

Шаг 3. Написать промт

Промт состоит из двух частей. Служебную отдаёт сама платформа: API-ключ, ссылка на документацию и описание, как к ней обращаться. Без неё ассистент работает только у себя локально и не знает, какие методы ему доступны.

Описание приложения пишете вы. Для плана продаж оно выглядело так:



Важный момент: в промте прямо названо поле с типом «дата», по которому фильтруется период. В нашем случае это «дата начала» сделки. Чем точнее опишете поля и логику расчёта, тем меньше правок будет потом.

Одним предложением задачу не поставить. Работают примеры желаемого результата и описание сценария по порядку, от экрана к экрану.

Шаг 4. Дождаться сборки

После отправки промта ассистент идёт по шагам и пишет, что делает: изучает документацию платформы, сверяет описание с реальными данными портала, вытаскивает идентификаторы полей, собирает файлы. У нас приложение уложилось в шесть файлов.

Время от времени ассистент просит что-то подтвердить: доступ в интернет, запуск команды, публикацию на сервер.

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

Шаг 5. Поднять сервер Black Hole

Сначала приложение собирается локально, в папке проекта на компьютере. Чтобы оно жило без включённого компьютера и открывалось с телефона, нужен сервер.

Раздел так и называется, «Серверы Black Hole». При создании выбираете API-ключ, тариф и регион. Название говорящее: устройство сервера от вас спрятано, не надо разбираться с доменом, SSL-сертификатом и доступами к файлам. Этим занимается платформа.

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

Шаг 6. Задеплоить и встроить в портал

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

Дальше приложение встраивается в интерфейс Битрикс24. Способа два: попросить нейросеть сделать приложение с OAuth-авторизацией под каждого пользователя либо воспользоваться механизмом самой платформы, где есть вкладка «Приложения» и кнопка «Встроить в Битрикс24».

Мест встройки много: левое меню, чат, задачи проекта. У нас приложение вставало пунктом левого меню.

Сколько это стоит

Цена складывается из трёх частей, и деньги здесь не самая крупная.

Подписка на AI-ассистента. Порядка 2000 рублей в месяц плюс VPN, если ассистент недоступен напрямую. Он умеет далеко не только вайбкод, поэтому расход обычно и так есть в бюджете.

Вайбы на платформе. Внутренняя валюта Битрикс24 Вайбкод, списывается за аренду сервера и за обращения к BitrixGPT. Минимальный сервер стоит 600 вайбов в месяц, тариф делится на дневной и ночной, ночью дешевле. Автосон позволяет не платить за простой. При регистрации на баланс приходит стартовый пакет вайбов. Актуальные тарифы и пакеты опубликованы в хелпдеске Битрикс24.

Время. Главная статья расходов. Сформулировать промт, дождаться сборки, пройти круги правок, разобраться, почему приложение ведёт себя не так, как задумано. Разница в скорости со сборкой классическим способом действительно измеряется десятками раз, но часы уходят не на ожидание, а на постановку задачи.

Отсюда простой критерий. Если время есть и задача понятна с двух сторон, архитектурной и бизнесовой, формат подходит. Если задачу ещё предстоит сформулировать, вайбкодинг эту работу не сделает.

Итоги

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

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

Если у вас возникают ошибки во время вайбкодинга, это нормально. Сделайте скриншот вашего экрана с ошибкой и логов сервера, дальше отправьте в чат AI-ассистента. Он сам найдет причину и предложит варианты исправления ошибки.

Вайбкодинг не отменяет разработчиков, а скорее сдвигает момент их привлечения в проект. Теперь вы можете своими силами собрать рабочее MVP и отдать команде на доработку. К сожалению, без разработчиков все еще нельзя обойтись в задачах, где есть вопросы в правах доступа: кому давать доступ к приложению, чтобы сотрудники не дотянулись до чужих сделок и клиентских данных. Например, наше приложение «План продаж» по умолчанию видят все пользователи. Если вам нужно, чтобы доступ имели только пользователи с определенными правами, то такую задачу лучше отдать на доработку программистам.

Полная запись практикума со сборкой приложения и разбором ошибок можно посмотреть тут -  ссылка на просмотр в Вконтакте