Bolt.new: что это и как быстро собрать MVP

Bolt.new: что это и как собрать MVP за выходные

Bolt new — это браузерный инструмент для сборки веб-приложений: описываешь идею текстом, получаешь работающий код с предпросмотром прямо в браузере. Никакой установки, никакого терминала. За одно утро реально собрать SaaS-трекер с регистрацией пользователей, маршрутами и API. В этом материале — пошаговый практикум: от пустого промпта до задеплоенного MVP конкретного приложения, честное сравнение с Lovable по четырём критериям и список ловушек, которые не попадают в обычные обзоры.

Что такое Bolt.new и чем отличается от других no-code инструментов

Bolt.new создан командой StackBlitz — тех самых людей, которые изобрели технологию WebContainers. Это важно понимать с самого начала: Bolt — полноценная среда разработки, а не обёртка над ChatGPT с кнопкой «сгенерировать код». Под капотом работает полноценная Node.js-среда прямо в браузере — та же, что стоит у разработчика на ноутбуке, только без установки.

От Tilda или Webflow Bolt отличается принципиально. Tilda собирает страницы из блоков. Bolt генерирует настоящий код с зависимостями, npm-пакетами, файловой структурой и работающим сервером. Это не конструктор визуала — это среда разработки в браузере.

От Bubble Bolt отличается выходом: Bubble хранит логику приложения внутри своей закрытой платформы, экспортировать код нельзя. Bolt генерирует реальный React-код на TypeScript, который можно скачать ZIP-архивом или отправить в GitHub. Вы не заперты на платформе.

От классических AI-ассистентов типа ChatGPT Bolt отличается тем, что код сразу запускается в браузере. Справа от редактора живёт предпросмотр: нажал кнопку в интерфейсе — видишь результат сразу. Это принципиально меняет скорость итерации.

Для тех, кто интересуется вайбкодингом — Bolt один из главных инструментов этого подхода: описываете словами, получаете работающий продукт. Разница с Cursor или Windsurf в том, что Bolt работает полностью в браузере и не требует локальной установки. Никакого «скачай, настрой, разберись с путями» — открыл вкладку и пишешь промпт.

Как работает WebContainers — браузер как среда разработки

WebContainers — это технологическая база Bolt.new. Если кратко: полноценная операционная среда Node.js, которая запускается внутри браузерной вкладки через WebAssembly.

Что это означает на практике: когда Bolt генерирует проект, он не отправляет код на какой-то удалённый сервер для исполнения. Проект собирается и запускается прямо у вас в браузере. npm install выполняется в браузере. Vite-сервер запускается в браузере. Когда вы видите предпросмотр приложения справа — это не картинка с сервера StackBlitz, это ваш локальный dev-сервер.

Отсюда несколько практических следствий:

• скорость предпросмотра почти мгновенная — нет round-trip до сервера;
• можно работать в самолёте с ограниченным интернетом (сам Bolt.new нужен только для LLM-запросов);
• среда воспроизводима: то, что работает у вас в браузере, будет работать после деплоя с тем же Node.js-окружением.

Стек по умолчанию: React, Vite и TypeScript. Это современный стандарт для фронтенд-разработки. Код читаем для любого React-разработчика — если потом нанимаете разработчика для масштабирования, он не увидит проприетарной магии. В промпте можно указать Next.js, Svelte или Vue — Bolt переключится на нужный стек.

Под капотом Bolt использует Claude Sonnet или GPT-4o для генерации кода. Какая именно модель работает в конкретный момент — зависит от нагрузки и настроек платформы. Обе модели хорошо справляются с React-кодом, разница в сложных задачах незначительна для первого MVP.

Шаг 1. Промпт, который реально работает (примеры из практики)

Самая распространённая ошибка первого запуска: слишком короткий или слишком длинный промпт. «Сделай трекер задач» — слишком мало, Bolt генерирует что-то базовое без понимания контекста. Промпт на три абзаца с описанием каждого пикселя — слишком много, модель путается и пропускает важное.

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

Вот конкретный промпт для SaaS-трекера задач, который мы разберём пошагово:

Создай SaaS-трекер задач для небольших команд.

Экраны:
- лендинг с описанием и кнопкой регистрации
- регистрация и логин (email и пароль)
- дашборд: список проектов пользователя
- страница проекта: задачи в трёх колонках (To Do, In Progress, Done),
  карточки можно перетаскивать между колонками

Стек: React, TypeScript, Vite.
Для хранения данных пока используй localStorage.
Дизайн: минимализм, тёмные акценты, шрифт Inter.

Такой промпт даёт Bolt чёткий план: что строить, сколько экранов, какой стек, как хранить данные. Результат — за 40-60 секунд появится рабочее приложение с навигацией между страницами.

Несколько правил для хорошего промпта:

• называйте конкретные библиотеки, если знаете: «используй react-beautiful-dnd для drag-and-drop» лучше, чем «сделай перетаскивание»;
• указывайте источник данных: localStorage для старта, конкретный API-эндпоинт если есть бэкенд;
• просите один экран за раз, если продукт сложный: «сначала только регистрация и логин, остальное добавим потом»;
• не описывайте дизайн пиксельно: «минимализм» и «тёмные акценты» дадут Bolt свободу сгенерировать что-то связное, а не набор несогласованных правил.

Если первый результат не понравился — не редактируйте промпт и не начинайте заново. Напишите в чат уточнение: «переделай навигацию: сделай сайдбар вместо топбара» или «измени цвет кнопок на зелёный». Bolt дополнит код, а не перегенерирует проект с нуля.

Шаг 2. Итерация: от черновика к рабочему прототипу

После первой генерации у вас есть скелет. Дальше начинается итерация — самая продуктивная часть работы в Bolt.new.

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

Промпты для итерации нашего трекера задач:

# Промпт 2: добавить метки к задачам
Добавь к карточкам задач метки (теги): высокий приоритет, средний, низкий.
Метку выбирают при создании задачи. На карточке показывай цветную точку.

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

# Промпт 4: экспорт
Добавь кнопку "Экспорт CSV" на странице проекта - выгружает все задачи
проекта в CSV-файл с колонками: название, статус, дата создания.

Каждый такой промпт Bolt обрабатывает за 30-90 секунд. За первую половину дня реально пройти 15-20 итераций и получить приложение, которое можно показывать потенциальным пользователям.

Важный момент про токены: каждый промпт расходует токены. На Free-плане они кончаются быстро — на сложном проекте хватит на 3-5 итераций в день. На Pro за $20/мес лимит значительно выше. Для реальной сборки MVP за выходные нужен Pro.

Если Bolt начинает «зависать» в итерации (генерирует код с ошибкой, которая не исправляется следующим промптом) — помогает конкретный запрос с указанием файла: «в файле src/components/TaskCard.tsx исправь ошибку: при перетаскивании карточки зависает анимация». Bolt умеет редактировать конкретные файлы, если указать их явно.

Шаг 3. Деплой и подключение домена

Когда прототип готов к первым пользователям — время деплоить. У Bolt два встроенных пути.

Первый путь: встроенный деплой через Netlify. Прямо из интерфейса Bolt нажимаете «Deploy» — приложение публикуется на Netlify и получает адрес вида your-project-name.netlify.app. Это занимает 1-2 минуты. Для первых показов прототипа достаточно.

Второй путь: экспорт в GitHub. Bolt отправляет проект в ваш репозиторий на GitHub (нужно подключить аккаунт). Дальше деплоите куда угодно: Vercel, Railway, собственный VPS. Это рекомендуемый путь, если хотите контроль над инфраструктурой или планируете добавить настоящий бэкенд позже.

Третий путь: скачать ZIP. Кнопка в правом верхнем углу. Получаете архив с полным проектом — открываете локально, деплоите вручную куда нужно.

Подключение собственного домена к Netlify-деплою: заходите в настройки Netlify, раздел «Domain management», добавляете домен и прописываете DNS-записи у своего регистратора. Занимает 10-15 минут плюс время распространения DNS (обычно до часа).

Один нюанс для нашего трекера задач с localStorage: данные хранятся в браузере пользователя, не на сервере. Это нормально для прототипа, но означает, что данные не синхронизируются между устройствами и не сохраняются при очистке браузера. Для следующего шага нужна настоящая база данных — туда уже потребуется либо Supabase через отдельную настройку, либо полноценный бэкенд.

Bolt.new против Lovable: когда что выбрать

Bolt и Lovable AI решают похожую задачу: быстрый MVP в браузере без локальной установки. Но под капотом они устроены по-разному, и это влияет на выбор.

Bolt лучше выбрать в трёх случаях:

• нужен фронтенд-прототип без базы данных — лендинг с формой, интерактивный дашборд, SPA с localStorage;
• нужен Node.js-бэкенд с кастомными API-роутами, которые Lovable не умеет генерировать так гибко;
• важна скорость первых 30 минут: Bolt выдаёт работающий предпросмотр быстрее, стартовая итерация ощущается живее.

Lovable лучше выбрать в двух случаях:

• нужна реальная база данных с аутентификацией прямо из коробки: одним промптом «добавь регистрацию через email» Lovable подключает Supabase Auth, Bolt потребует ручной настройки;
• нужен SaaS с платёжной системой Stripe: Lovable интегрирует Stripe автоматически, Bolt умеет, но чаще требует дополнительных правок.

Если вы нетехнический фаундер и строите первый продукт без разработчика — Lovable быстрее даст полный стек. Если вы технически подкованы или строите фронтенд-инструмент без сложного бэкенда — Bolt гибче и быстрее на старте.

Ловушки и ограничения, о которых не пишут в обзорах

Большинство обзоров Bolt.new останавливаются на «смотри как классно, за 5 минут готово приложение». Вот что обычно не попадает в эти обзоры.

Python-бэкенд не поддерживается. WebContainers — это Node.js. Если ваш проект требует Python (FastAPI, Flask, машинное обучение, обработка данных) — Bolt не подходит. Можно сделать React-фронтенд в Bolt и подключить его к внешнему Python-API, но сам Python-сервер в Bolt не запустить.

Загрузка файлов на сервер не работает нативно. Bolt генерирует код для загрузки файлов, но раздавать их как статику с сервера в рамках WebContainers не выйдет. Для работы с файлами нужен внешний сервис: Supabase Storage, S3, Cloudinary. Это дополнительная настройка, которую Bolt сам не сделает без точных инструкций.

Токены расходуются быстро на сложных задачах. Просьба «добавь аутентификацию» на проекте с 20 файлами может съесть значительную часть дневного лимита. Bolt читает весь проект при каждом запросе — чем больше проект вырос, тем дороже каждый промпт. После 50-60 итераций проект может стать «тяжёлым» для Free-плана.

Откат к предыдущей версии не всегда прост. Bolt сохраняет историю, но если несколько итераций подряд сломали то, что работало — вернуться назад сложнее, чем в Git. Рекомендация: каждые 10-15 итераций отправляйте снапшот в GitHub. Это занимает 30 секунд и даёт вам точки отката.

Реальная база данных требует внешнего сервиса. localStorage для прототипа — нормально. Но для MVP с несколькими пользователями нужна настоящая БД. Bolt сам не поднимет PostgreSQL в браузере — нужно подключать Supabase, PlanetScale или другой внешний сервис через переменные окружения. Это уже требует минимальных технических навыков.

Мобильный вид нужно просить явно. По умолчанию Bolt генерирует десктопный интерфейс. Если нужен адаптив — добавляйте это требование в каждый промпт, который касается интерфейса: «убедись, что этот экран адаптивен для мобильных устройств». Иначе на смартфоне всё будет ужато и неудобно.

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

Понимание этих ограничений не отменяет пользу Bolt.new. Это просто честная картина того, с чем вы столкнётесь при работе с реальным продуктом, а не учебным примером. Для проверки гипотезы и сборки первого прототипа Bolt — один из лучших инструментов на рынке в 2026 году.