#ai #dev #lovable #tools

🚀 Крутое обновление Lovable: Визуальный редактор!

Lovable продолжает удивлять! Теперь в платформе появился визуальный редактор интерфейса, который позволяет менять элементы без использования промптов и траты кредитов 🎨

Пример использования на скрине (взял ранее написанное приложение по генерации мемов)

Что нового:

- Раньше: выбор визуального элемента + описание его изменений через промпт (что, между прочим, до сих недостижимо для многих других AI-кодеров)
- Теперь: прямое редактирование через визуальный интерфейс
- Экономия кредитов на мелких правках

✨ Что можно редактировать:
- Цвета (включая кастомные)
- Размеры текста
- Отступы
- Скругления углов
- Прозрачность
- Стили шрифтов
- Тексты кнопок и заголовков

💡 Почему это круто:
- Мгновенные изменения без ожидания ответа AI
- Экономия кредитов
- Точное попадание в желаемый результат
- Интуитивно понятный интерфейс

Единственное, чего не хватает - это возможности перетаскивать элементы мышкой по экрану. Но уверен, что это дело времени!

P.S. а знали ли вы, что в Lovable также есть аналог .cursorrules для задания общего контекста, в котором происходит разработка приложения?

#Lovable #NoCode #WebDev #AI

Open Agent Platform от LangChain: создавайте умных агентов, а не бэкенд 🤖

Привет, друзья! Сегодня хотел обратить ваше внимание на новую платформу от LangChain, которая обещает избавить нас от написания тонны кода для создания AI-агентов.

Я до этого пробовал https://chai.new/ (по сути bolt.new но для агентов, построенный на базе фреймворка https://langbase.com ) и CrewAI Studio - очень удобно, ничего не нужно устанавливать локально, вся мульти-агентная система "собирается" простым текстовым описанием на русском языке. На выходе вы получаете и схему, и работающий код. В случае с CrewAI есть потенциальная возможность превратить созданную мульти-агентную систему в MCP-сервер при помощи automcp. А в случае с langbase для этой цели проще всего использовать https://mcpify.ai/ которому в принципе пофигу какой код или текстовое описание "превращать" в MCP сервер, чуть ранее писал об этом, классный инструмент, но недостаток в том, что кодовую базу MCP сервера вы уже не контроллируете).

Но Langchain решили сделать платформу где агентные и мульти-агентные системы
создаются без написания кода по аналогии как это происходит сейчас во Flowise (только во Flowise, на мой взгляд, все выглядит симпатичнее, но зато у Langchain система работает на базе Langgraph)

Итак Open Agent Platform (OAP) — это веб-интерфейс для создания и управления LangGraph-агентами без необходимости писать код. Идея супер, особенно если вы уже устали от бесконечных строк на Python.

Что умеет эта платформа? 📋

Заявлено следующее:
• Управление агентами: создание, настройка и общение через браузерный интерфейс
• Интеграция с RAG: поддержка retrieval-augmented generation через LangConnect
• Инструменты MCP: подключение к внешним сервисам через HTTP MCP сервер
• Мульти-агентная оркестрация: один агент может управлять другими
• Аутентификация: встроенная поддержка Supabase (можно заменить своим решением, что по-моему и стоит сделать сразу, т.к. если у вас Pro подписка на Supabase, то даже самый мелкий проект будет стоить +$10 в месяц)

Детали архитектуры здесь

По описанию, OAP выглядит как неплохой инструмент для тех, кто хочет быстро прототипировать агентов без глубокого погружения в LangChain API. Но не ждите чудес — это всё ещё молодая технология со своими ограничениями. А первоначальная настройка и запуск могли бы быть и попроще. Если кто еще пробовал установку по инструкции поделитесь своими впечатлениями в комментариях.

Демонстрацию работы можно посмотреть здесь
Транскрипт демки тут.

#ai #langchain #agents #nocode #developer_tools

Создание AI-тьютора испанского языка за час: разбор live-кодинга с Lovable 🤖

Команда Lovable вчера провела интересный онлайн-эксперимент — создание полноценного AI-тьютора для изучения испанского языка в прямом эфире. Разбираем, что получилось и какие технологии использовались.

Что такое Lovable? 🛠

Про Lovable уже писал много раз (пост 1, пост 2, пост 3, пост 4), но на всякий случай напомню.
Lovable — платформа для создания full-stack приложений с помощью естественного языка. Вместо написания кода разработчики общаются с AI, описывая нужную функциональность.

Основные возможности:
• Создание React-приложений через текстовые команды
• Интеграция с Supabase для backend-функций
• Автоматическое развертывание и управление базой данных
• Поддержка аутентификации и внешних API

Техническая архитектура проекта ⚙️

Стек технологий: 1️⃣ Frontend: React (единственный поддерживаемый фреймворк) 2️⃣ Backend: Supabase (база данных + Edge Functions) 3️⃣ AI: OpenAI API для обработки текста и голоса 4️⃣ Аутентификация: встроенная система Supabase

Структура приложения:
• Глобальная боковая панель навигации
• Страница дашборда (по умолчанию)
• Чат-интерфейс для общения с AI
• Панель настроек справа

Реализованная функциональность 📱

Основные возможности:
• Текстовый чат с AI-тьютором на испанском
• Голосовой ввод с преобразованием речи в текст
• Воспроизведение ответов AI в аудиоформате
• Перевод сообщений AI на английский
• Настройка скорости воспроизведения аудио

Система кредитов:
• Ограничение бесплатного использования
• Списание кредитов за AI-операции
• Отображение баланса в интерфейсе
• Модальное окно при исчерпании лимита

Практические советы по работе с Lovable 💡

Эффективные промпты:
• Разбивайте сложные задачи на мелкие шаги
• Будьте максимально конкретны в описаниях
• Указывайте технические детали (например, "используй OpenAI")
• Добавляйте требования к UI/UX сразу

Работа с ошибками:
• Не нажимайте "Try to fix" больше 2-3 раз
• Используйте функцию отката к предыдущим версиям
• Переформулируйте запрос, если AI "застрял"
• Применяйте Chat Mode для планирования сложных изменений

Интеграция с внешними сервисами 🔗

Supabase:
• Автоматическое создание таблиц для профилей пользователей
• Безопасное хранение API-ключей в секретах
• Edge Functions для серверной логики
• Миграции базы данных "на лету"

OpenAI API:
• Отдельные Edge Functions для каждой AI-задачи
• Обработка текста, речи и переводов
• Настраиваемые системные промпты
• Автоматическое развертывание при изменениях

Ограничения и особенности ⚠️

Текущие ограничения:
• Только React в качестве frontend-фреймворка
• Производительность снижается в пиковые часы
• Необходимость детального планирования промптов
• Ограниченная поддержка кастомных доменов

Рекомендации:
• Используйте Custom Knowledge для хранения требований проекта
• Применяйте гибридный подход: Lovable + ручное редактирование кода
• Интегрируйтесь с GitHub для версионирования
• Тестируйте функциональность после каждого изменения

Планы развития проекта 🚀

Следующие этапы: 1️⃣ Улучшение дизайна и UX 2️⃣ Добавление геймификации (рейтинг достижений) 3️⃣ Админ-панель для управления пользователями 4️⃣ Интеграция Stripe для монетизации 5️⃣ Запуск на Product Hunt

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

Очень рекомендую посмотреть этот эксперимент в записи (1 час), или прочитать транскрипт. Я подготовил 2 версии транскрипта: • детальную • краткую

P.S. На этой неделе курса по AI-программированию и ИИ-агентам у нас была очень близкая тема - мы делали синхронный переводчик для зума, и также в одном из вариантов использовали lovable, в следующей заметке напишу чуть подробнее что и как мы делали и дам ссылки на веб-приложения, которые у нас получились.

#ai_development #nocode #lovable #supabase #react