KO | EN

GitLite

Minimalist Open Source Repository Search Engine

gitlite — search

#dsh #dsh-plugin #developer-tools #ai-agent #claude-code #codex #typescript #ai-agents #deepseek-harness #mcp #cli #rust

telegram-bot-builder

★ 30 Open GitHub ↗

🤖 Визуальный конструктор Telegram ботов с drag-and-drop интерфейсом. Создавайте ботов без программирования, получайте готовый Python код для aiogram. React + TypeScript frontend, Express.js backend, PostgreSQL. Поддержка медиа, клавиатур, условной логики и аналитики пользователей.

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

**🇷🇺 Русский** | [🇬🇧 English](README.en.md)

<picture>
    <source media="(prefers-color-scheme: dark)" srcset="assets/images/bot_added_ui_visible.png">
    <source media="(prefers-color-scheme: light)" srcset="assets/images/bot_added_ui_visible.png">
    <img alt="Telegram Bot Builder" src="assets/images/bot_added_ui_visible.png" width="600">
  </picture>
  
  <h1>
    <img src="https://readme-typing-svg.herokuapp.com?font=Fira+Code&size=32&duration=2800&pause=2000&color=F75C7E&center=true&vCenter=true&width=600&lines=🤖+Telegram+Bot+Builder;Создавайте+ботов+без+кода!;Визуальный+конструктор" alt="Typing SVG" />
  </h1>
  
  **Создавайте Telegram ботов без программирования!**
  
  [![MIT License](https://img.shields.io/badge/License-MIT-green.svg?style=for-the-badge)](https://choosealicense.com/licenses/mit/)
  [![Node.js Version](https://img.shields.io/badge/node-%3E%3D18.0.0-brightgreen?style=for-the-badge&logo=node.js)](https://nodejs.org/)
  [![TypeScript](https://img.shields.io/badge/TypeScript-007ACC?style=for-the-badge&logo=typescript&logoColor=white)](https://www.typescriptlang.org/)
  [![React](https://img.shields.io/badge/React-20232A?style=for-the-badge&logo=react&logoColor=61DAFB)](https://reactjs.org/)
  [![PostgreSQL](https://img.shields.io/badge/PostgreSQL-316192?style=for-the-badge&logo=postgresql&logoColor=white)](https://www.postgresql.org/)
  
  ![GitHub stars](https://img.shields.io/github/stars/fedorabakumets/telegram-bot-builder?style=for-the-badge&logo=github)
  ![GitHub forks](https://img.shields.io/github/forks/fedorabakumets/telegram-bot-builder?style=for-the-badge&logo=github)
  ![GitHub issues](https://img.shields.io/github/issues/fedorabakumets/telegram-bot-builder?style=for-the-badge&logo=github)
  ![Visitors](https://visitor-badge.laobi.icu/badge?page_id=fedorabakumets.telegram-bot-builder&style=for-the-badge)
  
  
  
</div>

<div align="center">
  <p><strong>Визуальный конструктор с drag-and-drop интерфейсом, где вы просто перетаскиваете блоки на холст, а готовый бот появляется сам.</strong></p>
  
  > 💡 Идеально подходит для малого бизнеса, фрилансеров и тех, кто хочет быстро запустить бота, не изучая программирование.

<div style="margin: 20px 0;">
    <h3>📞 Связь с нами</h3>
    <a href="https://github.com/fedorabakumets/telegram-bot-builder/issues">
      <img src="https://img.shields.io/badge/GitHub-Issues-red?style=for-the-badge&logo=github" alt="GitHub Issues"/>
    </a>
    <a href="https://github.com/fedorabakumets/telegram-bot-builder/discussions">
      <img src="https://img.shields.io/badge/GitHub-Discussions-blue?style=for-the-badge&logo=github" alt="GitHub Discussions"/>
    </a>
    <a href="https://t.me/bot_builder_chat">
      <img src="https://img.shields.io/badge/Telegram-Chat-blue?style=for-the-badge&logo=telegram" alt="Telegram Chat"/>
    </a>
    <a href="https://t.me/botcraft_studio">
      <img src="https://img.shields.io/badge/Telegram-Channel-0088cc?style=for-the-badge&logo=telegram" alt="Telegram Channel"/>
    </a>
  </div>
</div>

---

### 🏗️ Архитектура системы

<br/>

<div align="center">
  <table>
    <tr>
      <td align="center" width="25%" style="padding: 15px;">
        <div style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); padding: 20px; border-radius: 15px; color: white;">
          <h3>🎨 Frontend</h3>
          <p><strong>React + TypeScript</strong></p>
          <p>Визуальный редактор</p>
          <hr style="border: 1px solid rgba(255,255,255,0.3);">
          <small>• Drag-and-drop интерфейс<br/>
          • Панель настроек блоков<br/>
          • Управление проектами</small>
        </div>
      </td>
      <td align="center" width="25%" style="padding: 15px;">
        <div style="background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%); padding: 20px; border-radius: 15px; color: white;">
          <h3>🖥️ Backend</h3>
          <p><strong>Express.js + Node.js</strong></p>
          <p>API сервер</p>
          <hr style="border: 1px solid rgba(255,255,255,0.3);">
          <small>• REST API для данных<br/>
          • Генерация Python кода<br/>
          • Загрузка медиафайлов</small>
        </div>
      </td>
      <td align="center" width="25%" style="padding: 15px;">
        <div style="background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%); padding: 20px; border-radius: 15px; color: white;">
          <h3>🗄️ База данных</h3>
          <p><strong>PostgreSQL + Drizzle</strong></p>
          <p>Хранение данных</p>
          <hr style="border: 1px solid rgba(255,255,255,0.3);">
          <small>• Проекты и схемы ботов<br/>
          • Пользователи и настройки<br/>
          • Медиафайлы</small>
        </div>
      </td>
      <td align="center" width="25%" style="padding: 15px;">
        <div style="background: linear-gradient(135deg, #fa709a 0%, #fee140 100%); padding: 20px; border-radius: 15px; color: white;">
          <h3>☁️ Деплой</h3>
          <p><strong>Railway + Python</strong></p>
          <p>Запуск ботов</p>
          <hr style="border: 1px solid rgba(255,255,255,0.3);">
          <small>• Автогенерация кода<br/>
          • Готовые Python боты<br/>
          • Облачный хостинг</small>
        </div>
      </td>
    </tr>
  </table>
</div>

#### 🔄 Поток данных

<details>
<summary><strong>📋 Подробное описание потока</strong> (нажми для раскрытия)</summary>

1. **👤 Пользователь** создает схему бота в визуальном редакторе
2. **🎨 Frontend** отправляет изменения через REST API, предлагает сохранить и перезапустить бота
3. **📡 API Server** валидирует данные и сохраняет в PostgreSQL
4. **🤖 Generator** преобразует схему в Python код с aiogram
5. **▶️ Запуск** — бот запускается как Python-процесс на сервере (Worker Pool)
6. **📱 Telegram** получает сообщения через polling (по умолчанию) или webhook
7. **📊 Analytics** собирает статистику использования в реальном времени

</details>

---

## 📁 Структура проекта

<details>
<summary><strong>Показать структуру проекта</strong></summary>

```
📦 telegram-bot-builder/
┣ 📂 client/                     # 🎨 React Frontend
┃ ┣ 📂 components/               # UI компоненты
┃ ┃ ┣ 📂 editor/                 # Визуальный редактор
┃ ┃ ┃ ┣ 📂 app-sidebar/          # Навигация по вкладкам
┃ ┃ ┃ ┣ 📂 analytics/            # Панель аналитики
┃ ┃ ┃ ┣ 📂 bot/                  # Управление ботами
┃ ┃ ┃ ┣ 📂 broadcast/            # Рассылки
┃ ┃ ┃ ┣ 📂 canvas/               # Холст редактора (drag & drop)
┃ ┃ ┃ ┣ 📂 code/                 # Вкладка «Код бота»
┃ ┃ ┃ ┣ 📂 dialogs/              # Диалоги с пользователями
┃ ┃ ┃ ┣ 📂 properties/           # Панель свойств блоков
┃ ┃ ┃ ┣ 📂 sidebar/              # Панель компонентов
┃ ┃ ┃ ┗ 📂 users/                # Вкладка «Пользователи»
┃ ┃ ┣ 📂 ui/                     # Базовые UI элементы
┃ ┃ ┗ 📂 media/                  # Медиа компоненты
┃ ┣ 📂 hooks/                    # React хуки
┃ ┣ 📂 pages/                    # Страницы приложения
┃ ┣ 📂 storage/                  # Локальное хранилище
┃ ┣ 📂 types/                    # TypeScript типы
┃ ┣ 📂 utils/                    # Утилиты
┃ ┗ 📄 App.tsx                   # Главный компонент
┣ 📂 server/                     # 🖥️ Express Backend
┃ ┣ 📂 auth/                     # Аутентификация
┃ ┣ 📂 bots/                     # Запуск/остановка ботов
┃ ┣ 📂 database/                 # Работа с PostgreSQL
┃ ┣ 📂 files/                    # Работа с файлами
┃ ┣ 📂 handlers/                 # Обработчики запросов
┃ ┣ 📂 middleware/               # Middleware
┃ ┣ 📂 migrations/               # Миграции БД
┃ ┣ 📂 redis/                    # Redis (события, кэш)
┃ ┣ 📂 routes/                   # API маршруты
┃ ┣ 📂 services/                 # Бизнес-логика
┃ ┣ 📂 storages/                 # Хранилища данных
┃ ┣ 📂 telegram/                 # Telegram API клиент
┃ ┣ 📂 templates/                # Шаблоны генерации
┃ ┣ 📂 terminal/                 # Терминал ботов
┃ ┣ 📂 utils/                    # Утилиты сервера
┃ ┗ 📄 index.ts                  # Точка входа сервера
┣ 📂 shared/                     # 🔗 Общие модули (схемы, типы)
┣ 📂 bots/                       # 🤖 Сгенерированные Python-боты
┣ 📂 docs/                       # 📚 Документация
┃ ┣ 📂 analysis/                 # Анализ архитектуры
┃ ┣ 📂 deployment/               # Инструкции по деплою
┃ ┣ 📂 development/              # Для разработчиков
┃ ┣ 📂 features/                 # Описание фич
┃ ┣ 📂 futures/                  # Планы развития
┃ ┗ 📂 releases/                 # Заметки к релизам
┣ 📂 migrations/                 # 🗄️ Миграции Drizzle ORM
┣ 📂 uploads/                    # 📁 Загруженные медиафайлы
┣ 📂 scripts/                    # 📜 Вспомогательные скрипты
┣ 📄 package.json                # 📦 Зависимости Node.js
┣ 📄 tsconfig.json               # ⚙️ Настройки TypeScript
┣ 📄 vite.config.ts              # ⚡ Конфигурация Vite
┣ 📄 drizzle.config.ts           # 🗄️ Настройки Drizzle ORM
┣ 📄 docker-compose.yml          # 🐳 Docker конфигурация
┗ 📄 .env.example                # 🔐 Пример переменных окружения
```

</details>

---

## 📡 API

> ⚠️ **Безопасность:** На данный момент многие эндпоинты открыты и не требуют аутентификации. Проект находится в стадии активной разработки — авторизация и изоляция данных между пользователями планируются в будущих релизах. Следите за обновлениями в нашем [Telegram-канале](https://t.me/botcraft_studio) и [чате](https://t.me/bot_builder_chat).

API маршруты находятся в директории `server/routes/`:

| Директория | Что содержит |
|-----------|-------------|
| `server/routes/projectRoutes/` | CRUD проектов, обновление схемы |
| `server/routes/botManagement/` | Запуск, остановка, перезапуск ботов |
| `server/routes/tables/` | Работа с таблицами данных |
| `server/routes/setup/` | Setup Wizard (первоначальная настройка) |
| `server/routes/setupWebhookRoutes.ts` | Приём webhook-апдейтов от Telegram |
| `server/routes/routes.ts` | Главный файл регистрации всех маршрутов |

---
## 🎯 Основные возможности

### 🎨 Визуальный редактор
- **Drag & Drop** — перетаскивайте блоки на холст, соединяйте стрелками
- **Набор блоков постоянно растёт** — новые ноды добавляются с каждым обновлением
- **Светлая и тёмная темы** — удобно работать днём и ночью
- **Адаптивный интерфейс** — работает на десктопе, планшете и смартфоне

### 💬 Сообщения и триггеры
- **Команды** — /start, /help и любые пользовательские команды
- **Текстовые триггеры** — реакция на конкретные слова или любое сообщение
- **Исходящие сообщения** — триггер на отправку сообщений ботом
- **Медиафайлы** — фото, видео, аудио, документы
- **Сбор данных** — сохранение ответов пользователей в переменные
- **Редактирование и пересылка** — изменение отправленных сообщений, пересылка в другие чаты

### ⌨️ Клавиатуры
- **Inline-кнопки** — с callback-данными и обработкой нажатий
- **Reply-клавиатуры** — обычные кнопки под полем ввода
- **Answer callback query** — ответ на нажатие inline-кнопки

### 👥 Группы и форумы
- **Триггеры на сообщения в группах** — бот реагирует на сообщения участников
- **Создание тем в форумах** — автоматическое создание топиков

### 🔌 Интеграции
- **HTTP-запросы** — обращение к любым внешним API
- **PostgreSQL** — прямые SQL-запросы к базе данных из бота
- **Условная логика** — ветвления "если... то..."
- **Переменные** — хранение и использование данных между шагами
- **Конвертация файлов** — преобразование форматов

### 🖥️ Вкладки конструктора
- **🎨 Редактор** — визуальный холст с нодами, drag & drop построение сценария
- **📋 Код** — просмотр, копирование и скачивание сгенерированного Python-кода
- **🤖 Бот** — управление токенами, запуск/остановка, статус, настройки
- **👥 Пользователи** — база всех, кто писал боту
- **💬 Диалоги** — переписки бота с пользователями в реальном времени
- **📢 Рассылки** — массовая отправка сообщений по базе
- **📊 Аналитика** — статистика использования бота
- **📑 Таблицы** — таблицы данных проекта (контент, настройки)

> 💡 Вкладки и блоки постоянно обновляются и дополняются с каждым релизом.

---

## ☁️ Запуск и деплой бота

### ▶️ Вариант 1: Запуск из конструктора (кнопка «Запустить»)

Бот запускается прямо из интерфейса конструктора:
- **На официальном сайте** — пока работает нестабильно, актуальную ссылку можно получить в чате [@bot_builder_chat](https://t.me/bot_builder_chat). Скоро выпускаем глобально!
- **Self-hosted (рекомендуется)** — разверните конструктор у себя и запускайте ботов из своей инфраструктуры

### 📦 Вариант 2: Скачать код и запустить где угодно

Из конструктора (официальный сайт или self-hosted):
1. Откройте вкладку **«Код бота»**
2. Скачайте сгенерированный `.py` файл
3. Отредактируйте под свои нужды (код полностью ваш, никакого чёрного ящика)
4. Запустите на любом сервере, VPS или домашнем компьютере — независимо от конструктора

### 🖥️ Вариант 3: Self-hosted конструктор

Разверните Bot Builder на своём сервере — и создавайте/запускайте ботов в своей инфраструктуре:

#### Railway (рекомендуется)

1. Зарегистрируйтесь на [Railway.app](https://railway.app/)
2. Создайте новый проект
3. Подключите репозиторий с кодом
4. Добавьте переменные окружения (см. [docs/deployment/RAILWAY_QUICK_DEPLOY.md](docs/deployment/RAILWAY_QUICK_DEPLOY.md))
5. Создайте PostgreSQL базу данных
6. Запустите миграции базы данных

Подробные инструкции: [docs/deployment/RAILWAY_QUICK_DEPLOY.md](docs/deployment/RAILWAY_QUICK_DEPLOY.md)

#### Docker

```bash
git clone https://github.com/fedorabakumets/telegram-bot-builder.git
cd telegram-bot-builder
docker compose up -d
```

#### Ручная установка (любая ОС)

См. пошаговую инструкцию ниже.

---

## 📜 Пошаговая инструкция

Подробное руководство по установке для Windows, macOS и Linux (Git, Node.js, PostgreSQL, Redis, Python, настройка БД, клонирование, запуск):

👉 **[docs/development/INSTALLATION.md](docs/development/INSTALLATION.md)**

> 🐳 **Быстрый старт:** `docker compose up -d` — и всё работает без ручной настройки.

> 💡 **Нужно обновить проект?** См. [🔄 Как обновить проект с GitHub](docs/development/HOW_TO_UPDATE.md)

---

## 🎓 Как создать своего первого бота?

<details>
<summary><strong>Пошаговое руководство</strong> (нажми для раскрытия)</summary>

### Шаг 1: Получите токен для бота
1. Откройте Telegram и найдите [@BotFather](https://t.me/BotFather)
2. Напишите `/newbot` и следуйте инструкциям
3. Вы получите токен вроде: `123456789:ABCdef...`

### Шаг 2: Откройте редактор
- При первом запуске у вас уже есть **проект по умолчанию** с узлом "Старт"
- Если нужен новый проект, откройте вкладку **"Проекты"** (слева) и нажмите кнопку **"+ Новый"**

### Шаг 3: Добавьте токен бота
1. В правой части нажмите кнопку **"Бот"** 
2. Вставьте токен, который вы получили от BotFather
3. Токен сохранится автоматически

### Шаг 4: Постройте сценарий бота
1. Перетащите блок **"Сообщение"** на холст рядом с узлом "Старт"
2. Напишите текст, который бот должен отправить
3. В настройках блока укажите, что будет дальше:
   - **Кнопки** - для выбора вариантов ответа
   - **Автопереход** - перейти к другому блоку автоматически
   - **Ожидание ввода** - дождаться сообщения от пользователя
4. Добавьте еще блоки и настройте переходы между ними

### Шаг 5: Запустите бота
1. Откройте вкладку **"Бот"** (справа внизу)
2. Нажмите кнопку **"Запустить"**
3. Откройте своего бота в Telegram
4. Тестируйте и улучшайте!

</details>

---

## 🧩 Типы блоков

<details>
<summary><strong>Полный список доступных блоков</strong> (нажми для раскрытия)</summary>

### 📨 Сообщения и триггеры

| Блок | Что он делает |
|------|---------------|
| **🔔 Триггер команды** | Срабатывает при вводе команды (/start, /help, любая своя) |
| **💬 Триггер текста** | Срабатывает на конкретное текстовое сообщение |
| **📩 Триггер входящего сообщения** | Срабатывает на каждое входящее сообщение |
| **📤 Триггер исходящего сообщения** | Срабатывает когда бот отправляет сообщение |
| **💬 Текстовое сообщение** | Отправляет текст пользователю (поддержка Markdown) |
| **📁 Медиафайл** | Отправляет фото, видео, аудио или документ |
| **💾 Сохранить ответ в переменную** | Сохраняет ответ пользователя для дальнейшего использования |
| **✏️ Редактировать сообщение** | Редактирует текст или кнопки уже отправленного сообщения |
| **↗️ Переслать сообщение** | Пересылка сообщения в другой чат |

### ⌨️ Клавиатуры

| Блок | Что он делает |
|------|---------------|
| **🔘 Триггер inline-кнопки** | Срабатывает когда пользователь нажимает inline-кнопку |
| **🔔 Триггер нажатия кнопки** | Срабатывает на каждое нажатие callback-кнопки |
| **⌨️ Клавиатура** | Отправляет сообщение с reply-клавиатурой |
| **✅ Answer callback query** | Отвечает на нажатие inline-кнопки (уведомление/alert) |

### 👥 Группы

| Блок | Что он делает |
|------|---------------|
| **👥 Триггер сообщений в группе** | Срабатывает на сообщения в групповых чатах |
| **📋 Создать тему форума** | Создаёт новый топик в форум-группе |

### 🔌 Интеграции и логика

| Блок | Что он делает |
|------|---------------|
| **🌐 HTTP-запрос** | Отправляет запрос к любому внешнему API |
| **🗄️ PostgreSQL запрос** | Выполняет SQL-запрос к базе данных |
| **🔀 Условие** | Ветвление логики: "если... то... иначе..." |
| **📝 Установить переменную** | Сохраняет значение в переменную для использования в других блоках |
| **📄 Конвертация файлов** | Преобразование файлов между форматами |

### 📦 Медиафайлы в сообщениях

В свойствах текстового сообщения можно прикрепить:
- **📸 Фотографии** — JPG, PNG
- **🎬 Видео** — видеоролики
- **🎵 Аудио** — музыка и записи
- **📄 Документы** — PDF, Word, Excel и другие

### 🔄 Логика переходов

Настраивается в свойствах каждого блока:
- **Кнопки** — пользователь выбирает вариант, бот переходит на нужное сообщение
- **Ожидание ввода** — бот ждёт ответ, затем переходит дальше
- **Автопереход** — переход к следующему блоку автоматически
- **Условные переходы** — ветвление по значению переменных

> 💡 Список блоков постоянно пополняется. Следите за обновлениями!

</details>

---

## 📚 Пример: Простой бот для пиццерии

<details>
<summary><strong>🍕 Пошаговый пример создания бота</strong> (нажми для раскрытия)</summary>

<br/>

<div align="center">
  <h3>🎯 Что мы создадим:</h3>
  <p><em>Полнофункциональный бот для приема заказов пиццы с меню, выбором и подтверждением</em></p>
</div>

### 🎨 Визуальная схема бота

<div align="center">
  <table style="border: none;">
    <tr>
      <td align="center" style="padding: 10px;">
        <div style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); padding: 15px; border-radius: 10px; color: white; min-width: 200px;">
          <h4>🚀 СТАРТ</h4>
          <p style="margin: 5px 0;">Команда /start</p>
        </div>
      </td>
    </tr>
    <tr>
      <td align="center" style="padding: 5px;">
        <div style="font-size: 24px;">⬇️</div>
      </td>
    </tr>
    <tr>
      <td align="center" style="padding: 10px;">
        <div style="background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%); padding: 15px; border-radius: 10px; color: white; min-width: 200px;">
          <h4>💬 ПРИВЕТСТВИЕ</h4>
          <p style="margin: 5px 0;">"Добро пожаловать! Выберите пиццу 🍕"</p>
        </div>
      </td>
    </tr>
    <tr>
      <td align="center" style="padding: 5px;">
        <div style="font-size: 24px;">⬇️</div>
      </td>
    </tr>
    <tr>
      <td align="center" style="padding: 10px;">
        <div style="background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%); padding: 15px; border-radius: 10px; color: white; min-width: 200px;">
          <h4>🍕 ВЫБОР ПИЦЦЫ</h4>
          <div style="display: flex; justify-content: space-around; margin-top: 10px;">
            <span style="background: rgba(255,255,255,0.2); padding: 5px 10px; border-radius: 5px; margin: 2px;">🍕 Маргарита</span>
            <span style="background: rgba(255,255,255,0.2); padding: 5px 10px; border-radius: 5px; margin: 2px;">🍕 Пепперони</span>
            <span style="background: rgba(255,255,255,0.2); padding: 5px 10px; border-radius: 5px; margin: 2px;">🥬 Вегетарианская</span>
          </div>
        </div>
      </td>
    </tr>
    <tr>
      <td align="center" style="padding: 5px;">
        <div style="font-size: 24px;">⬇️</div>
      </td>
    </tr>
    <tr>
      <td align="center" style="padding: 10px;">
        <div style="background: linear-gradient(135deg, #fa709a 0%, #fee140 100%); padding: 15px; border-radius: 10px; color: white; min-width: 200px;">
          <h4>📝 АДРЕС ДОСТАВКИ</h4>
          <p style="margin: 5px 0;">"Введите ваш адрес доставки"</p>
        </div>
      </td>
    </tr>
    <tr>
      <td align="center" style="padding: 5px;">
        <div style="font-size: 24px;">⬇️</div>
      </td>
    </tr>
    <tr>
      <td align="center" style="padding: 10px;">
        <div style="background: linear-gradient(135deg, #a8edea 0%, #fed6e3 100%); padding: 15px; border-radius: 10px; color: #333; min-width: 200px;">
          <h4>✅ ПОДТВЕРЖДЕНИЕ</h4>
          <p style="margin: 5px 0;">Проверка заказа</p>
        </div>
      </td>
    </tr>
    <tr>
      <td align="center" style="padding: 5px;">
        <div style="font-size: 24px;">⬇️</div>
      </td>
    </tr>
    <tr>
      <td align="center" style="padding: 10px;">
        <div style="background: linear-gradient(135deg, #96fbc4 0%, #f9f586 100%); padding: 15px; border-radius: 10px; color: #333; min-width: 200px;">
          <h4>🚗 ГОТОВО!</h4>
          <p style="margin: 5px 0;">"Спасибо за заказ! Ожидайте доставку"</p>
        </div>
      </td>
    </tr>
  </table>
</div>

### 🛠️ Пошаговое создание

<details>
<summary><strong>📋 Подробная инструкция</strong> (нажми для раскрытия)</summary>

#### 🎯 Шаг 1: Создание проекта
1. Откройте Telegram Bot Builder
2. Создайте новый проект "Пиццерия"
3. Получите токен от [@BotFather](https://t.me/BotFather)

#### 🧩 Шаг 2: Добавление блоков
1. **Стартовое сообщение** → "Добро пожаловать! Выберите пиццу 🍕"
2. **Кнопки выбора** → ["🍕 Маргарита", "🍕 Пепперони", "🥬 Вегетарианская"]
3. **Сообщение с ожиданием** → "Введите ваш адрес доставки"
4. **Финальное сообщение** → "Спасибо за заказ! Ожидайте доставку 🚗"

#### ⚙️ Шаг 3: Настройка переходов
- **Старт** → **Приветствие** (автопереход)
- **Приветствие** → **Выбор пиццы** (кнопки)
- **Выбор пиццы** → **Адрес** (любая кнопка)
- **Адрес** → **Подтверждение** (ожидание ввода)

#### 🚀 Шаг 4: Запуск и тестирование
1. Нажмите "Сгенерировать код"
2. Скачайте готовый Python файл
3. Запустите бота и протестируйте

</details>

### 💻 Сгенерированный код

<details>
<summary><strong>🐍 Посмотреть автоматически созданный Python код</strong> (нажми чтобы раскрыть)</summary>

```python
# 🤖 Автоматически сгенерированный бот для пиццерии
import asyncio
from aiogram import Bot, Dispatcher, types
from aiogram.filters import Command
from aiogram.types import ReplyKeyboardMarkup, KeyboardButton

# 🔑 Токен бота (замените на свой)
bot = Bot(token="YOUR_BOT_TOKEN")
dp = Dispatcher()

def get_pizza_keyboard():
    """🍕 Клавиатура с выбором пиццы"""
    keyboard = ReplyKeyboardMarkup(
        keyboard=[
            [KeyboardButton(text="🍕 Маргарита")],
            [KeyboardButton(text="🍕 Пепперони")],
            [KeyboardButton(text="🥬 Вегетарианская")]
        ],
        resize_keyboard=True,
        one_time_keyboard=True
    )
    return keyboard

@dp.message(Command("start"))
async def start_handler(message: types.Message):
    """🚀 Обработчик команды /start"""
    await message.answer(
        "🍕 Добро пожаловать в пиццерию!\n"
        "Выберите пиццу из меню:",
        reply_markup=get_pizza_keyboard()
    )

@dp.message(lambda message: "🍕" in message.text or "🥬" in message.text)
async def pizza_selected(message: types.Message):
    """🍕 Обработчик выбора пиццы"""
    pizza_type = message.text
    await message.answer(
        f"✅ Отличный выбор: {pizza_type}!\n"
        f"📍 Введите ваш адрес доставки:",
        reply_markup=types.ReplyKeyboardRemove()
    )

@dp.message()
async def address_handler(message: types.Message):
    """📍 Обработчик адреса доставки"""
    address = message.text
    await message.answer(
        f"🎉 Спасибо за заказ!\n"
        f"📍 Адрес: {address}\n"
        f"🚗 Ожидайте доставку в течение 30-40 минут!\n"
        f"📞 Мы свяжемся с вами для подтверждения."
    )

# 🚀 Запуск бота
async def main():
    print("🤖 Бот пиццерии запущен!")
    await dp.start_polling(bot)

if __name__ == "__main__":
    asyncio.run(main())
```

</details>

### 🎯 Результат

<div align="center">
  <table>
    <tr>
      <td align="center" width="33%" style="padding: 15px;">
        <div style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); padding: 20px; border-radius: 15px; color: white;">
          <h4>⚡ Быстро</h4>
          <p>10 минут от идеи<br/>до готового бота</p>
        </div>
      </td>
      <td align="center" width="33%" style="padding: 15px;">
        <div style="background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%); padding: 20px; border-radius: 15px; color: white;">
          <h4>🎯 Просто</h4>
          <p>Без единой строки<br/>программирования</p>
        </div>
      </td>
      <td align="center" width="33%" style="padding: 15px;">
        <div style="background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%); padding: 20px; border-radius: 15px; color: white;">
          <h4>🚀 Готово</h4>
          <p>Бот готов принимать<br/>заказы прямо сейчас!</p>
        </div>
      </td>
    </tr>
  </table>
</div>

</details>

---

## 📚 Документация

<br/>

<div align="center">
  <p><strong>Вся документация проекта организована в папке <code>docs/</code> и разделена по категориям для удобного поиска</strong></p>
</div>

<table>
<tr>
<td align="center" width="25%" style="padding: 15px;">
<div style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); padding: 20px; border-radius: 15px; color: white; min-height: 200px;">
<h3>🛠️ Разработчикам</h3>
<hr style="border: 1px solid rgba(255,255,255,0.3); margin: 15px 0;">
<div style="text-align: left; font-size: 14px;">

<p><strong>📋 <a href="docs/development/INSTALLATION.md" style="color: #FFE4E1;">Настройка проекта</a></strong><br/>
<small>Пошаговое руководство по установке</small></p>

<p><strong>🔧 <a href="docs/development/TROUBLESHOOTING_RU.md" style="color: #FFE4E1;">Устранение неполадок</a></strong><br/>
<small>Решение частых проблем</small></p>

<p><strong>🤝 <a href="docs/development/CONTRIBUTING.md" style="color: #FFE4E1;">Для контрибьюторов</a></strong><br/>
<small>Как участвовать в разработке</small></p>

<p><strong>📄 <a href="docs/JSDOC_STANDARDS.md" style="color: #FFE4E1;">JSDoc стандарты</a></strong><br/>
<small>Стандарты документации кода</small></p>

<p><strong>🧩 <a href="docs/development/adding-new-trigger.md" style="color: #FFE4E1;">Добавление нового узла</a></strong><br/>
<small>Инструкция по созданию новой ноды</small></p>

</div>
</div>
</td>
<td align="center" width="25%" style="padding: 15px;">
<div style="background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%); padding: 20px; border-radius: 15px; color: white; min-height: 200px;">
<h3>🚀 Деплой</h3>
<hr style="border: 1px solid rgba(255,255,255,0.3); margin: 15px 0;">
<div style="text-align: left; font-size: 14px;">

<p><strong>🚂 <a href="docs/deployment/RAILWAY_QUICK_DEPLOY.md" style="color: #FFE4E1;">Railway</a></strong><br/>
<small>Развертывание на Railway (рекомендуется)</small></p>

<p><strong>🐳 Docker</strong><br/>
<small>Контейнеризация приложения (скоро)</small></p>

<p><strong>☁️ VPS</strong><br/>
<small>Развертывание на собственном сервере (скоро)</small></p>

<p><strong>⚙️ CI/CD</strong><br/>
<small>Автоматическое развертывание (скоро)</small></p>

</div>
</div>
</td>
<td align="center" width="25%" style="padding: 15px;">
<div style="background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%); padding: 20px; border-radius: 15px; color: white; min-height: 200px;">
<h3>🧩 Возможности</h3>
<hr style="border: 1px solid rgba(255,255,255,0.3); margin: 15px 0;">
<div style="text-align: left; font-size: 14px;">

<p><strong>🏗️ <a href="docs/features/NODE_TYPES.md" style="color: #FFE4E1;">Типы узлов</a></strong><br/>
<small>Полный список доступных блоков</small></p>

<p><strong>🔧 <a href="docs/futures/features/possible-triggers-and-actions.md" style="color: #FFE4E1;">Триггеры и действия</a></strong><br/>
<small>Справочник возможностей</small></p>

<p><strong>📈 Производительность</strong><br/>
<small>Оптимизация и мониторинг (скоро)</small></p>

<p><strong>🧪 Тестирование</strong><br/>
<small>Стратегии тестирования (скоро)</small></p>

</div>
</div>
</td>
<td align="center" width="25%" style="padding: 15px;">
<div style="background: linear-gradient(135deg, #fa709a 0%, #fee140 100%); padding: 20px; border-radius: 15px; color: white; min-height: 200px;">
<h3>🔒 Безопасность</h3>
<hr style="border: 1px solid rgba(255,255,255,0.3); margin: 15px 0;">
<div style="text-align: left; font-size: 14px;">

<p><strong>🛡️ <a href="docs/development/HOW_TO_UPDATE.md" style="color: #FFE4E1;">Обновление проекта</a></strong><br/>
<small>Как обновить проект с GitHub</small></p>

<p><strong>🔐 Аутентификация</strong><br/>
<small>Защита пользовательских данных (скоро)</small></p>

<p><strong>🚨 Мониторинг</strong><br/>
<small>Отслеживание угроз (скоро)</small></p>

<p><strong>📋 Аудит</strong><br/>
<small>Проверка безопасности (скоро)</small></p>

</div>
</div>
</td>
</tr>
</table>

</div>

<div align="center" style="margin: 30px 0;">
  <h3>📖 Быстрый доступ к документации</h3>
  <div style="margin: 20px 0;">
    <a href="docs/home.md">
      <img src="https://img.shields.io/badge/📚_Полный_индекс-Все_документы-4285f4?style=for-the-badge&logo=gitbook" alt="Full Index"/>
    </a>
    <a href="docs/development/INSTALLATION.md">
      <img src="https://img.shields.io/badge/🚀_Быстрый_старт-Установка-ea4335?style=for-the-badge&logo=rocket" alt="Quick Start"/>
    </a>
    <a href="docs/development/TROUBLESHOOTING_RU.md">
      <img src="https://img.shields.io/badge/🔧_Помощь-Решение_проблем-34a853?style=for-the-badge&logo=tools" alt="Help"/>
    </a>
  </div>
</div>

<div align="center">
  <details>
    <summary><strong>🗂️ Полная структура документации</strong> (нажми для раскрытия)</summary>
    
  <div style="text-align: left; margin: 20px 0;">

```
  📂 docs/
  ├── 📁 development/              # 🛠️ Документация для разработчиков
  │   ├── 📄 INSTALLATION.md       # Настройка окружения разработки
  │   ├── 📄 TROUBLESHOOTING_RU.md # Устранение неполадок
  │   ├── 📄 CONTRIBUTING.md       # Руководство для контрибьюторов
  │   ├── 📄 adding-new-trigger.md # Добавление новой ноды
  │   └── 📄 HOW_TO_UPDATE.md     # Как обновить проект
  │
  ├── 📁 deployment/               # 🚀 Руководства по развертыванию
  │   ├── 📄 RAILWAY_QUICK_DEPLOY.md # Быстрый деплой на Railway
  │   ├── 📄 RAILWAY_TROUBLESHOOTING.md # Устранение проблем
  │   └── 📄 VERCEL_DEPLOY.md     # Развертывание на Vercel
  │
  ├── 📁 features/                 # 🧩 Описание возможностей
  │   ├── 📄 NODE_TYPES.md        # Типы узлов
  │   └── 📄 POSSIBLE_TRIGGERS_AND_ACTIONS.md # Триггеры
  │
  ├── 📁 futures/                  # 🔮 Планы развития
  │
  ├── 📁 releases/                 # 📝 Release notes
  │
  ├── 📄 home.md                   # 📚 Главная страница документации
  ├── 📄 JSDOC_STANDARDS.md       # 📋 Стандарты JSDoc
  └── 📄 bot-json-prompt.md       # 🤖 Промт для ИИ
  ```

</div>
    
  </details>
</div>

---

## 📋 Системные требования

<details>
<summary><strong>Технические требования</strong> (нажми для раскрытия)</summary>

<table>
<tr>
<th>💻 Компонент</th>
<th>⚡ Минимум</th>
<th>🚀 Рекомендуемо</th>
</tr>
<tr>
<td><strong>Node.js</strong></td>
<td>18.0</td>
<td>22.0+ LTS</td>
</tr>
<tr>
<td><strong>PostgreSQL</strong></td>
<td>17</td>
<td>17.10+</td>
</tr>
<tr>
<td><strong>Redis</strong></td>
<td>7.0</td>
<td>7.2+ (Memurai на Windows)</td>
</tr>
<tr>
<td><strong>Python</strong></td>
<td>3.10</td>
<td>3.13+</td>
</tr>
<tr>
<td><strong>RAM</strong></td>
<td>1 GB</td>
<td>2+ GB</td>
</tr>
<tr>
<td><strong>Диск</strong></td>
<td>500 MB</td>
<td>1+ GB SSD</td>
</tr>
</table>

### 🖥️ Поддерживаемые ОС
![Windows](https://img.shields.io/badge/Windows-0078D6?style=flat-square&logo=windows&logoColor=white)
![macOS](https://img.shields.io/badge/macOS-000000?style=flat-square&logo=apple&logoColor=white)
![Linux](https://img.shields.io/badge/Linux-FCC624?style=flat-square&logo=linux&logoColor=black)

</div>

</details>

---

## 🚀 Развертывание готового бота

### ▶️ Запуск из конструктора (основной способ)

Бот запускается **прямо из интерфейса** — нажмите кнопку «Запустить» во вкладке «Бот». Сервер автоматически:
1. Генерирует Python-код из вашей схемы
2. Запускает бот как Python-процесс (через Worker Pool)
3. Показывает логи и статус в реальном времени

> ⚠️ **Важно:** Python-зависимости устанавливаются один раз на сервере командой `pip install -r requirements.txt`. Все боты используют общее окружение.

### 📦 Скачать код и запустить отдельно

Из вкладки «Код бота» можно скачать сгенерированный `.py` файл и запустить независимо от конструктора:

<div align="center">
  <img src="assets/images/code-tab-preview.png" alt="Вкладка Код проекта" width="800">
  <p><em>Вкладка «Код проекта» — просмотр, копирование и скачивание сгенерированного Python-кода</em></p>
</div>

```bash
pip install -r requirements.txt   # один раз
python bot.py                     # запуск бота
```

Код полностью ваш — можно редактировать, дополнять, деплоить куда угодно.

### ☁️ Деплой на хостинг

| Платформа | Подходит для | Документация |
|-----------|-------------|--------------|
| **Railway** | Быстрый деплой, автоскейлинг | [RAILWAY_QUICK_DEPLOY.md](docs/deployment/RAILWAY_QUICK_DEPLOY.md) |
| **VPS** (DigitalOcean, Linode) | Полный контроль | Стандартный запуск Python |
| **Docker** | Изоляция, воспроизводимость | `docker compose up -d` |

---

## 📄 Лицензия

MIT License - используйте свободно для личных и коммерческих целей.

---

## 🤝 Помощь и поддержка

### 🆘 Быстрая помощь
<table>
<tr>
<td align="center" width="25%">
<h4>🐛 Нашли баг?</h4>
<a href="https://github.com/fedorabakumets/telegram-bot-builder/issues/new">
<img src="https://img.shields.io/badge/Создать_Issue-red?style=flat-square&logo=github" alt="Create Issue"/>
</a>
</td>
<td align="center" width="25%">
<h4>💡 Есть идея?</h4>
<a href="https://github.com/fedorabakumets/telegram-bot-builder/discussions">
<img src="https://img.shields.io/badge/Обсудить-blue?style=flat-square&logo=github" alt="Discuss"/>
</a>
</td>
<td align="center" width="25%">
<h4>📖 Нужна помощь?</h4>
<a href="docs/home.md">
<img src="https://img.shields.io/badge/Документация-green?style=flat-square&logo=gitbook" alt="Docs"/>
</a>
</td>
<td align="center" width="25%">
<h4>🤝 Хотите помочь?</h4>
<a href="docs/development/CONTRIBUTING.md">
<img src="https://img.shields.io/badge/Контрибьютинг-purple?style=flat-square&logo=git" alt="Contributing"/>
</a>
</td>
</tr>
</table>

</div>

---

telegram-bot-builder

Explore Similar Repositories

Was this content helpful?

Recent Feedback

Download README