No-Code MVP. Как я создал бота-ассистента за 2 дня, используя только AI и конструктор

Современная продуктивность - это боль. Откройте свой смартфон и посчитайте, сколько у вас приложений для "организации жизни".

У меня было четыре основных "костыля", которые должны были мне помогать, а по факту дико бесили:

1. Задачи. Какой-нибудь Todoist или TickTick. Туда я дисциплинированно (иногда) скидывал рабочие дела.
2. Заметки. Google Keep или "Заметки" в телефоне. Это была свалка идей, мыслей, ссылок и скриншотов.
3. Финансы. Coinkeeper, таблица в Google Docs или любой другой трекер. Я честно пытался вести бюджет.
4. Покупки. Отдельный список, который кочевал из чата с женой в "Избранное" в тг.

И вот в чем проблема. Вы постоянно прыгаете между ними. Записал задачу. Через минуту вспомнил гениальную идею, полез в заметки. Купил кофе, полез в трекер финансов. Это очень неудобно и не факт, что вообще работает. 

Сколько раз вы "забивали" внести тот самый злополучный кофе за 250 рублей в свой трекер? Я лично постоянно, потому что это отдельное лишнее действие. Нужно разблокировать телефон, найти иконку, открыть приложение, нажать "плюс", вспомнить категорию, ввести сумму и т.д. В итоге что-то забываешь, статистика в трекере начинает врать, и вся система летит к ***ям.

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

В какой-то момент я решил, что мне нужно одно место. Одно. А где я провожу больше всего времени? В Телеграм. Он у меня всегда открыт.

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

Но я не программист и ничего не понимаю в серверах, Python, JavaScript, GitHub и всей этой разработке. Любая попытка загуглить "как сделать свое приложение" приводила меня на статьи об API, деплое и контейнеризации (страшные слова). Это стена, о которую разбиваются 99% хороших идей.

Ну и я решил попробовать одну схемку, чтобы ИИ сам написал код, а затем собрать это всё в простом конструкторе. Через два дня тестов, проб и ошибок у меня был готов мой личный ассистент

Это мой 4-в-1 комбайн. В нем живут:

• Мои Задачи (с дедлайнами, приоритетами и переносом)
• Мои Финансы (доходы, расходы и сводка)
• Мои Заметки (как Google Keep, только свой)
• Мой Список покупок (с приоритетами)

Бот поддерживает даже быстрые команды, которые позволяют моментально заносить доходы/расходы и фиксировать новые идеи и задачи, не открывая мини-приложения. 

Я не написал ни строчки кода сам. Весь код мне сгенерировала нейросеть (в моем случае Gemini 2.5 Pro). А в качестве сервера, хостинга и "клея" я использовал конструктор PuzzleBot.

В этом гайде я шаг за шагом покажу весь путь. Как я ставил ТЗ нейронке, как ругался с ней, когда она ошибалась (а она ошибалась, поверьте), и как собрал все это в PuzzleBot.

Это не просто инструкция, а мой личный кейс. Я докажу, что любой из вас может запустить свой MVP-проект буквально за выходные, вообще не разбираясь в коде.

Основная концепция. Стек для ленивых (но умных)

Итак, задача ясна: нужен свой "комбайн" в Telegram.

Классический путь стартапера или разработчика выглядел бы так:

1. Найти бэкенд-разработчика (Python/Go/Node.js).
2. Найти фронтенд-разработчика (React/Vue).
3. Арендовать сервер (AWS/Heroku/Яндекс.Облако).
4. Настроить базу данных (PostgreSQL/MySQL).
5. Настроить "деплой" через GitHub...

Это месяцы работы и сотни тысяч рублей. Это путь в "долину смерти" для 99% проектов. Это не MVP, это "Massive Vain Project" (массивный бесполезный проект).

Мой подход был другим (я назвал его "партизанским"). Суть: не делать то, что можно не делать.

• Нам не нужен свой сервер. Мы "поселим" нашего бота в конструкторе PuzzleBot (это и будет наш сервер).
• Нам не нужен бэкенд-код. Мы будем использовать готовые блоки в конструкторе PuzzleBot.
• Нам не нужна классическая база данных. Мы воспользуемся NocoDB - это по сути "умный Excel", который сразу из коробки дает нам готовый API.
• Нам не нужен фронтенд-разработчик. Мы попросим нейросеть написать нам HTML-файл.

В итоге наш "стек" технологий - это 4 компонента, три из которых бесплатные.

Наш стек (набор инструментов)

1. Telegram. Это наша "витрина", фасад, точка входа. Здесь пользователи общаются с ботом. Это бесплатно.
2. PuzzleBot. Это "сердце" и "сервер". Он выполняет три критические функции:хостинг (он хранит наш HTML-код и показывает его как Mini App внутри Telegram).бэкенд (он обрабатывает все команды и логику.интегратор (он знает кто вы, и передает ваш user_id в наше приложение). Есть бесплатный тариф, которого хватит на свою рабочую систему.
3. NocoDB (в PuzzleBot). Это наш "мозг" и "память". Нам не нужно ничего настраивать, мы просто создаем таблицу, и у нас тут же появляется ссылка для получения и отправки данных. В PuzzleBot она встроена, и это тоже бесплатно.
4. Нейросеть (Gemini): Это наш "бесплатный программист". Мы даем ей подробное ТЗ, а она пишет 100% HTML, CSS и JavaScript для наших приложений. Я использовал версию 2.5 Pro, которая входит в платную подписку Google AI за $20/мес. Но ее можно получить бесплатно в рамках акций от гугла или просто использовать другую нейронку (например, ChatGPT или Grok).

Мы получаем всю мощь "full-stack" приложения, используя только готовые ноу-код инструменты и ИИ-генератор.

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

Демо-доступ к @AkcioBot

Я открыл демо-доступ к своему боту @AkcioBot. Это не какая-то специальная версия, это именно тот бот, которым я сейчас пользуюсь каждый день. Вы сможете зайти и потрогать все четыре приложения, которые мы будем собирать.

Вот как это сделать:

1. Найдите бота. Откройте Телеграм, в поиске введите @AkcioBot или просто перейдите по ссылке на @AkcioBot.

2. Введите пароль. Бот попросит пароль. Просто отправьте ему сообщение:

3. Откройте приложения. После ввода пароля бот покажет вам главное меню с четырьмя кнопками:
ЗадачиФинансыЗаметкиПокупкиНажмите на любую из них. Telegram откроет Mini App (веб-приложение) - тот самый HTML-файл, который сгенерировала нейросеть и который живёт внутри PuzzleBot.

Покликайте. Добавьте задачу. Отметьте её выполненной. Создайте заметку.

Вот это мы и будем сейчас собирать с нуля.

Пошаговый план сборки. От идеи до MVP за 1 час

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

Погнали.

Шаг 1. Создаем Телеграм-бота (@BotFather)

Это самый простой шаг. Нам нужна витрина для нашего бота в Телеграм.

1. Откройте Telegram, найдите @BotFather (с синей галочкой верификации). Или просто перейдите по ссылке: https://telegram.me/BotFather
2. Напишите ему команду /newbot.
3. BotFather попросит придумать имя (например, Мой Ассистент) и username (например, MySuperAssistantBot, обязательно в конце слово bot или _bot).
4. В ответ он пришлет поздравление и API-токен (длинную строку из букв и цифр).
5. Скопируйте этот токен. Никому его не показывайте.

Шаг 2. Регистрируемся в конструкторе PuzzleBot

Теперь нам нужно оживить этого бота.

1. Идем на сайт PuzzleBot и регистрируемся. Для нашей задачи хватит бесплатной версии + при регистрации дают 7 дней платного тарифа, чтобы изучить весь функционал.
2. После входа в личный кабинет, ищем кнопку "Добавить бота".
3. Вставляем тот самый API-токен, который мы получили от @BotFather.
4. Нажимаем "Подключить".

Всё. Наш бот ожил. Он теперь подключен к PuzzleBot и готов принимать команды.

Шаг 3. Создаем память (NocoDB)

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

• Войдите в вашего бота в личном кабинете PuzzleBot. Найдите в меню слева раздел "Настройки".

• Затем перейдите на вкладку "Интеграции" и найдите NocoDB x PuzzleBot. Создайте аккаунт и базу данных (ссылка на подробную инструкцию).

• Вы получите API-токен от базы данных. Скопируйте его и сохраните, он нам ещё понадобится.
• Откройте интерфейс NocoDB. Нажмите "Import Data", выберите CSV и загрузите 4 таблицы, которые нам нужны.

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

Объяснение столбцов. Пример для таблицы "Задачи" (Tasks)

• user_id (Тип: Single Line Text) — здесь будет храниться ID пользователя Telegram
• task_name (Тип: Single Line Text) — название задачи
• status (Тип: Single Line Text) — active или done, чтобы отслеживать статус выполнения задачи
• deadline (Тип: Single Line Text) — срок выполнения, до какой даты
• priority (Тип: Number) — 1 (высокий приоритет) или 2 (обычный приоритет)

По итогу у вас должно получиться 4 таблицы в базе данных.

Шаг 4. Генерируем приложения (нейросеть)

Теперь начинается самое увлекательное. Мы не пишем код, а идем к нашему "программисту" Gemini (или ChatGPT/Grok/Claude). Для этой задачи не нужно париться с крутыми ИИ-ассистентами для кодинга (Cursor, Lovable, v0 и др.). Хватит обычного чат-бота, которым вы уже привыкли пользоваться.

Вот реальный путь создания приложения "Задачи", который я прошел.

Итерация 1. "Человеческий" промпт

Я начал с простого человеческого запроса. Я просто описал, что хочу.

Результат: ИИ выдал HTML-файл, но с кривым дизайном и множеством нерабочих элементов. Например, ИИ добавил функцию по добавлению/редактированию задач, но она не работала. Это был просто статичный список. Он грузил все задачи (и активные, и выполненные), не понимал, что такое "просрочено", и выводил приоритеты как цифры 1, 2, 3.

Итерация 2. Правки по дизайну и логике

Результат: ИИ попытался это сделать. Но тут начались реальные проблемы.

• Провал UX. ИИ сделал блоки, которые не помещались в экран телефона. Он добавил "Просрочено" и покрасил его в зеленый.
• Провал кода. Список вообще перестал загружаться. ИИ сломал код, а ошибку найти невозможно. (Позже мы исправили это в диалоге).

Итерация 3. Отладка и полировка

Пришлось жестко отлаживать ИИ.

Результат: Только после 10 таких итераций мы получили чистый, рабочий и полезный код.

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

 Чтобы вы не тратили 2 дня:

Промпт, который нужно было дать СРАЗУ (идеальный)

(Собранный на основе всех наших ошибок)

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

Промпт для ИИ:

Создай однофайловое HTML-приложение "Список Задач", готовое для встраивания в Telegram Web App.

1. Дизайн и Стили:

Стиль — минимализм, чистый, как в приложениях Apple (шрифт San Francisco).

Никаких стандартных синих ссылок или фиолетовых кнопок.

Цвета: Используй заданные цвета: красный (для просроченного), синий (для акцентов и задач на сегодня), серый (для фона, разделителей и неактивного текста).

2. Структура Страницы:

Верхний блок (Сводка): Два счетчика рядом: "Активных задач" и "Просрочено".

Блок "Добавить задачу":

Поле для названия (на всю ширину).

Галочка "Высокий приоритет" (простой квадратный чекбокс, не стандартный).

Поле для выбора даты (календарь).

Большая синяя кнопка "Добавить" (на всю ширину).

Списки Задач (группы):

Задачи должны быть разделены на группы: "Просрочено" (красный заголовок), "Сегодня" (синий заголовок), "Скоро (7 дней)", "Дальнейшие", "Инбокс (без даты)" и "Архив" (серый заголовок).

Важно: Каждую группу (кроме "Архива") должно быть видно. "Архив" должен быть свёрнут, но его можно развернуть, нажав на заголовок. Пустые группы (например, если нет просроченных) должны автоматически скрываться.

3. Вид Одной Задачи:

Слева: Круглый чекбокс. Когда на него нажимаешь, задача становится "выполненной" (перечеркнутой и серой) и улетает в "Архив".

Слева (рамка): У активных задач должна быть цветная полоска слева: красная (если просрочена), синяя (если дедлайн сегодня).

Текст: Если у задачи высокий приоритет, покажи иконку молнии "⚡️" перед названием.

Справа: Дата дедлайна (в формате "14.11").

4. Интерактивность (Окно редактирования):

Если нажать на название задачи (не на чекбокс), должно появиться всплывающее окно (модальное).

В этом окне кнопки: "Изменить название", "Перенести дату" и "Удалить задачу" (красная).

При нажатии на "Перенести дату", в этом же окне должен появиться календарь и кнопки "Сегодня", "Завтра", "В Инбокс".

5. Логика и Данные (Самое важное):

Приложение должно работать с внешним API. Дай мне в коде понятные места (переменные), куда я вставлю свой API_URL и API_KEY.

ID Пользователя: Приложение должно брать ID пользователя из Telegram (window.Telegram.WebApp.initDataUnsafe.user.id).

Загрузка (GET): При загрузке страницы, приложение должно запросить только задачи этого пользователя.

Добавление (POST): При добавлении задачи, приложение должно отправлять текст, дату, приоритет и user_id.

Обновление (PATCH): Когда я отмечаю задачу выполненной, меняю дату или название, приложение должно отправлять изменения в базу.

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

Статусы: Покажи текст "Загрузка..." пока задачи грузятся, и "Ошибка..." (красным), если что-то пошло не так.

А вот что получилось у меня спустя 6 диалогов с Gemini, в каждом диалоге примерно по 5-10 итераций (т.е. более 60+ промптов).

Готовые HTML-файлы

(Вам нужно будет только вставить в них свои API URL и token из Шага 3, об этом на следующем шаге)

1. Код для "Задач": https://drive.google.com/file/d/1nIaMq7fL91nKn0lRbfqWsftqF4OTLLhh/view?usp=drive_link
2. Код для "Финансов": https://drive.google.com/file/d/1K3RRRwqozrJvC02-NseQKtWAVzawmdgF/view?usp=drive_link
3. Код для "Заметок": https://drive.google.com/file/d/1mTSORvdcvh5Q6e7KmHW0sZvyszWAPtYX/view?usp=drive_link
4. Код для "Покупок": https://drive.google.com/file/d/1mTSORvdcvh5Q6e7KmHW0sZvyszWAPtYX/view?usp=drive_link

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

Шаг 5. Сборка и запуск (PuzzleBot)

У нас есть код, у нас есть "сервер". Соединяем.

• В PuzzleBot идем в раздел "Конструктор" в меню слева.

• Нажимаем плюсик сверху слева и выбираем блок "Мини-приложение":

• Даем ему имя (например, "Задачи").

• Внутри мини-приложения "Задачи" добавьте новый блок "HTML-код" и вставьте ваш HTML-файл.

Единственное, что нужно изменить в HTML-файле

 В каждом HTML файле есть две такие строчки:

    const NOCO_DB_API_URL = 'https://nocodb.puzzlebot.top/api/v1/db/data/v1/[БАЗА]/[ТАБЛИЦА]';

    const API_KEY = '[ВСТАВЬТЕ СЮДА СВОЙ API TOKEN NOCODB]';

Чтобы всё заработало, нужно заменить значения [БАЗА], [ТАБЛИЦА] и [API-ТОКЕН].

Откройте через браузер вашу таблицу в NocoDB, вы увидите ссылку, например:

https://nocodb.puzzlebot.top/dashboard/#/nc/pee4gn2s7a2da8v/m95v6ylhx30h14p

Так вот:

• pee4gn2s7a2da8v - это название вашего проекта (БАЗА)
• m95v6ylhx30h14p - это ссылка на вашу таблицу (ТАБЛИЦА)

Замените этими значениями слова  в const NOCO_DB_API_URL

А в const API_KEY подставьте значение API-токена от NocoDB, который вы получили при интеграции с PuzzleBot.

Сохраните изменения, нажав на стрелку в левом верхнем углу.

Остался последний штрих - научить бота их показывать.

Настройка логики бота (PuzzleBot)

Это "бэкенд" без бэкенда. Мы будем собирать логику из готовых блоков (как в лего).

Наша задача:

1. Сделать так, чтобы бот предлагал запустить это мини-приложение (приветственное сообщение).
2. Ограничить доступ, чтобы ботом могли пользоваться только вы.

1. Настраиваем приветствие (команда /start)

Когда пользователь заходит в бота впервые, он видит шаблонное приветствие и не может запустить мини-приложение.  Нам нужно это исправить.

1. В PuzzleBot идем в "Конструктор".
2. Находим команду /start (она обычно создается по умолчанию) и нажимаем на нее.
3. Нам нужно, чтобы бот дал ссылку на это мини-приложение. Для этого мы изменим логику работы кнопки.
4. Нажмите на кнопку "Круто! С чего мне начать?". Меняем название на ваше (например, "Задачи"). Выберите действие - Переход к Мини-приложению. И там укажите название вашего мини-приложения.

Сохраните изменения. Теперь бот отправляет ссылку на мини-приложение всем пользователям, которые запустили бота. 

2. Ограничиваем доступ. 

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

По умолчанию все пользователи вашего бота имеют статус "Без категории". Нам нужно сделать так, чтобы люди с этим статусом не могли пользоваться ботом, а для вас придумать новую категорию (например, "VIP"). 

Как это сделать:

1. В PuzzleBot идем на вкладку "Модерация".
2. Нажмите на знак "+", чтобы добавить новую категорию. Укажите любое название. и создайте категорию.
3. Найдите в списке пользователей себя и вручную установите себе новую категорию.

    4. Теперь вернитесь в "Конструктор". Найдите кнопку настроек в правом верхнем углу. Задайте доступ для вашей новой категории и нажмите "Сохранить".

Отлично. Бот готов, работает и приносит пользу (пока только вам). Но что, если превратить этот MVP в небольшой источник дохода?

Конструкторы вроде PuzzleBot прекрасны тем, что в них уже встроены инструменты монетизации. 

Шаг к полноценному бизнесу. Монетизация

Вы сделали полноценный продукт. Он решает реальную "боль". Логично, что он может приносить деньги. Вот два самых простых способа, которые настраиваются в PuzzleBot за 10 минут.

Вариант 1. "Мягкая" монетизация (обязательная подписка)

Это самый популярный сейчас метод. Вы не берете деньги с пользователя, но "оплату" берете его вниманием.

Как это работает: Бот просто не будет показывать кнопки главного меню (и, соответственно, не даст открыть приложения), пока пользователь не подпишется на ваш Telegram-канал.

Как настроить в PuzzleBot:

1. Зайдите в личный кабинет вашего бота в PuzzleBot. Привяжите ваш канал к боту через кнопку "Добавить ресурс" (нужно добавить бота в администраторы вашего канала).
2. Во вкладке "Конструктор" перейдите в настройки (кнопка в правом верхнем углу). Уберите "Доступ для категорий" (мы устанавливали на предыдущем шаге, чтобы никто не мог пользоваться ботом кроме вас). Вместо этого выберите "Проверка подписки на ресурс" и выберите ваш канал.
3. Во вкладке "События" найдите пункт "Запрет доступа к команде (проверка подписки на ресурс)" и поменяйте текстовое сообщение например на такое: "Подпишитесь на канал @aidaboris, чтобы начать пользоваться ботом. Затем нажмите сюда: /start"

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

Вариант 2: "Жесткая" монетизация (платный доступ)

Это классический SaaS. Вы продаете доступ к боту за реальные деньги (например, 100 рублей в месяц). Тут уже потребуется хорошо владеть конструктором PuzzleBot, чтобы правильно всё настроить.

Как это работает: Вы устанавливаете доступ для определенной категории (например, "VIP") и затем различными способами ведете пользователя к покупке. Бот проверит, оплатил ли пользователь доступ, и автоматически назначит ему эту категорию после успешной оплаты.

Как настроить в PuzzleBot (тезисно):

1. Сначала нужно подключить платежную систему в "Настройках" PuzzleBot (например, для физических лиц подойдут ЮМани или Telegram Stars).
2. Добавьте новые блоки, которые будут вести пользователя к покупке (зависит от вашей воронки).
3. В конце воронки отправляем пользователя на команду с текстом: "Доступ к боту платный (100р/мес). Оплатить?" и прикрепляем Inline-кнопку "Оплатить".
4. В действиях этой кнопки выбираем "Платеж" и указываем сумму.
5. Важно: В настройках платежа нужно добавить команду с действием "Изменить категории" на VIP после успешной оплаты.

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

Заключение. Вы великолепны (серьезно)

Давайте на секунду остановимся и посмотрим, что мы только что сделали.

Мы создали "full-stack" SaaS-продукт. У нас есть фронтенд (4 HTML-приложения). У нас есть бэкенд (логика PuzzleBot). У нас есть база данных (NocoDB). У нас есть аутентификация (проверка user_id через SDK). У нас есть API (GET/POST/PATCH/DELETE). У нас есть монетизация (подписка или прямые платежи).

Раньше, чтобы запустить такой проект, вам нужна была команда из 3-4 человек и несколько тысяч долларов "на старт". Сегодня вам нужен аккаунт в конструкторе и хороший промпт для нейросети. Это полностью меняет правила игры.

Вам больше не нужно "искать технаря", чтобы проверить свою идею. Вы теперь и технарь, и продакт-менеджер, и основатель в одном флаконе.

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

Теперь ваша очередь.