Перейти к содержимому

ХВАТИТ платить за Lovable! Создавайте SaaS-решения абсолютно бесплатно с помощью этого конструкто...

The Metaverse Guy

0:00 / 0:00

ХВАТИТ платить за Lovable! Создавайте SaaS-решения абсолютно бесплатно с помощью этого конструкто...

39 430 просмотров · 10 месяцев назад
The Metaverse Guy
245 тыс. подписчиков
39 430 просмотров · 10 месяцев назад
Устали платить за Bolt.new или Lovable AI? В этом пошаговом руководстве я покажу, как создать полноценное приложение полного цикла — фронтенд, бэкенд, аутентификацию и развёртывание — используя только бесплатные инструменты: Создайте прототип фронтенда в Google AI Studio (в некоторых документах он же «Google Firebase Studio») с мощными функциями работы с изображениями. Скопируйте код локально и продолжите работу в VS Code с помощью KiloCode (помощника по программированию ИИ с открытым исходным кодом) вместо платного приложения с курсором ИИ или Bolt AI. Исходный код проекта: https://github.com/zainulabedeen123/a... Добавьте аутентификацию с помощью Clerk (без сложной настройки кода — идеально для начинающих ИИ и вайб-кодинга). Создайте базу данных Postgres на Neon.tech и подключите её (с MCP или без). Разверните в Vercel на бесплатном тарифном плане. По ходу дела я сравню Lovable AI и Bolt.new (плюсы и минусы), когда конструктор приложений без кода эффективен, а когда платформа для разработки ИИ помогает, и как сохранить свой стек приложений свободным. Если вы не разбираетесь в технологиях или новичок в инструментах для разработки ИИ-приложений, здесь подробно показано, как создать приложение с ИИ, не покупая lovable.dev или bolt.new. Чему вы научитесь Быстрому прототипированию в Google AI Studio (инструменты визуального редактирования и демонстрация миниатюр) Переходу на локальную разработку с помощью KiloCode (OpenRouter + бесплатные модели) Добавлению авторизации Clerk (вход через Google) Настройке базы данных и таблиц Neon Развёртыванию в Vercel в один клик (+ собственный домен) Почему именно этот стек? Это практичная альтернатива lovable AI и bolt.new для создания веб-приложений и SaaS-решений без кода. Вы увидите реальный переход приложения от прототипа к локальному коду и к полному развертыванию ИИ — быстро. Ключевые слова, используемые для поиска: Если вы сравниваете цены на lovable AI, обзор lovable AI, руководство по lovable AI или интересуетесь, как использовать Bolt.new AI, это пошаговое руководство демонстрирует полностью бесплатный альтернативный рабочий процесс с курсором и открытым исходным кодом ИИ-агентов. Отлично подходит для веб-разработки, тестирования конструкторов ПО на базе ИИ и создания SAAS-приложений с экспериментами на основе ИИ без подписки. 00:00 Введение: Перестаньте платить за Bolt/Lovable — бесплатный полнофункциональный путь 00:23 План из двух инструментов: прототип + сборка всего остального 00:54 Краткое примечание: лайки/подписки и ажиотаж 01:11 Обзор Google AI Studio (зачем это использовать) 02:29 Ограничения прототипа (авторизация, платежи, публикация) 03:08 Запуск прототипа (генератор миниатюр ИИ) 03:28 Идея приложения и подсказка 04:26 Начало сборки (бесплатные кредиты) 05:09 Первый результат: загрузка фото и генерация 05:57 Добавление функции «выбрать область и редактировать» 06:34 Заметка об API-ключах и интеграциях 07:29 Добавление стилей и выражений 08:50 Результаты + удержание реквизитов 09:30 Дополнительные параметры: фон, стили текста, шрифты 11:08 Улучшенный предварительный просмотр результата 12:03 Ошибка в инструменте редактирования Появляется 13:05 Новый тест (лондонская сцена) 13:37 Всё ещё нет выбора — сообщите о проблеме 14:09 Исправлено: выбор области работает 14:27 Успешное редактирование (тест Микки Мауса) 14:57 Прототип готов → загрузка исходного кода 15:18 Распаковка и открытие в VS Code 15:45 Установка KiloCode (ИИ-агента с открытым исходным кодом) 16:23 Основы и настройка VS Code 17:49 Установка и панель KiloCode 18:30 Настройка OpenRouter + бесплатные модели 19:31 Выбор моделей (GLM, Gemini и т. д.) 20:39 Выбор бесплатных моделей (Gemini Flash/Pro, GLM 4.5 Air) 21:32 Новый чат: понимание и запуск проекта 21:58 Предоставление ключа API Gemini 22:21 Установка зависимостей и запуск задач 23:16 npm запуск разработки → локальный успех 23:46 Добавление авторизации Clerk (почему Clerk, а не Google Console) 24:04 Выбор поставщика(ов) Clerk 25:02 Создание приложения Clerk 25:52 Вставка запроса Clerk в KiloCode 26:21 Настройка переменных окружения 26:54 Интеграция Clerk (пакеты и код) 27:54 Настройка окружения и проверка входа 28:25 Работа входа; управление учётной записью 28:49 Интерфейс учётной записи 29:17 База данных с Neon (Postgres) 30:17 Добавление сервера Neon MCP (необязательно) 31:49 Запрос бэкэнда и подключение 32:50 Создание логики таблицы пользователей 33:51 Запрос на выполнение SQL для таблиц 34:22 Выполнение SQL вручную при необходимости 35:05 Процесс развёртывания Vercel 35:38 Отправка в репозиторий GitHub 37:19 Отправка выполнена; Импорт в Vercel 37:45 Импорт проекта Vercel 38:45 Добавление переменных окружения и развёртывание 39:15 Активный URL + быстрая проверка 39:45 Добавление собственного домена (обзор DNS) 40:43 Резюме: бесплатный конвейер полного цикла 41:13 Заключение и что разрабатывать дальше lovable AI, руководство по lovable AI, обзор lovable AI, lovable, bolt.new, кодирование Vi...