Вайб кодинг
(Vibe coding)
(Vibe coding)
Полный гайд для изучения для запуска собственного продукта
Содержание:
Введение в Vibe coding
Как это было раньше:
У вас появляется гипотеза по продукту. Вы видите её в деталях, вы чувствуете, что она порвёт рынок.
А потом начинается реальность. Дорога в ад, вымощенная Jira-тикетами, спринтами, согласованиями с разработчиками, которые говорят «это на два месяца», и дизайнерами, у которых еще две команды с задачами приходят. К тому моменту, когда ваша идея, побитая и урезанная компромиссами, наконец-то добирается до кликабельного прототипа для проверки, вы уже и сами не помните, в чём там была идея
Но сейчас появляется возможность схлопнуть этот процесс с нескольких недель до пары часов.
И тут появляется Vibe coding
Идея очень проста: вы перестаёте быть инженером или писателем спецификаций. Вы становитесь креативным директором для нейронки. Вместо того чтобы кодить, вы просто накидываете ей на естественном языке: «Сделайте мне ленту как в Тиндере, только для котят», «А теперь прикрутите сюда кнопку с огненной анимацией». И что самое удивительное, это работает.
Сам автор термина, Андрей Карпати назвал это состоянием, когда вы «полностью отдаётесь вайбу и забываете, что код вообще существует».
Это не еще один фреймворк, а смена подхода. Ведь большая головная боль - проверка гипотез, внезапно перестаёт быть болью. Вам больше не нужно выпрашивать ресурсы и ждать очередного статуса. Вы, или ваш дизайнер, можете сами, общаясь с LLM, собрать рабочий прототип.
Но, как всегда, есть нюанс. И он огромен. За эту скорость вы платите качеством. Vibe coding — это прямая дорога к созданию кода, который ни один из разработчиков не сможет поддерживать и масштабировать. Дыры в безопасности, баги и чудовищный технический долг, который невозможно поддерживать - вот цена вайба.
И вот появляется главный выбор: быстрое протипирование / предсказуемое техническое решение.
Все зависит от ситуации и того как вы встроите вайб кодинг в продуктовый процесс. Но самое интересное теперь, что для проверки гипотез теперь узкое место это разработка или дизайн, а умение найти реальную пользовательскую проблему. То есть продакт менеджмент.
У вас появляется гипотеза по продукту. Вы видите её в деталях, вы чувствуете, что она порвёт рынок.
А потом начинается реальность. Дорога в ад, вымощенная Jira-тикетами, спринтами, согласованиями с разработчиками, которые говорят «это на два месяца», и дизайнерами, у которых еще две команды с задачами приходят. К тому моменту, когда ваша идея, побитая и урезанная компромиссами, наконец-то добирается до кликабельного прототипа для проверки, вы уже и сами не помните, в чём там была идея
Но сейчас появляется возможность схлопнуть этот процесс с нескольких недель до пары часов.
И тут появляется Vibe coding
Идея очень проста: вы перестаёте быть инженером или писателем спецификаций. Вы становитесь креативным директором для нейронки. Вместо того чтобы кодить, вы просто накидываете ей на естественном языке: «Сделайте мне ленту как в Тиндере, только для котят», «А теперь прикрутите сюда кнопку с огненной анимацией». И что самое удивительное, это работает.
Сам автор термина, Андрей Карпати назвал это состоянием, когда вы «полностью отдаётесь вайбу и забываете, что код вообще существует».
Это не еще один фреймворк, а смена подхода. Ведь большая головная боль - проверка гипотез, внезапно перестаёт быть болью. Вам больше не нужно выпрашивать ресурсы и ждать очередного статуса. Вы, или ваш дизайнер, можете сами, общаясь с LLM, собрать рабочий прототип.
Но, как всегда, есть нюанс. И он огромен. За эту скорость вы платите качеством. Vibe coding — это прямая дорога к созданию кода, который ни один из разработчиков не сможет поддерживать и масштабировать. Дыры в безопасности, баги и чудовищный технический долг, который невозможно поддерживать - вот цена вайба.
И вот появляется главный выбор: быстрое протипирование / предсказуемое техническое решение.
Все зависит от ситуации и того как вы встроите вайб кодинг в продуктовый процесс. Но самое интересное теперь, что для проверки гипотез теперь узкое место это разработка или дизайн, а умение найти реальную пользовательскую проблему. То есть продакт менеджмент.
Vibe coding vs разработка с LLM
Использование AI-помощников ≠ Vibe Coding.
А что тогда Vibe coding?
Это подход, когда вы забываете, что код вообще существует. Вы полностью доверяетесь AI, почти не глядя на результат.
В первоисточнике это было описано так:
«Я просто говорю, что хочу, и почти не трогаю клавиатуру».
«Я всегда нажимаю ‘Принять все’ и больше не читаю изменения в коде».
«Когда появляются ошибки, я просто копирую их в чат без комментариев. Обычно это помогает».
«Иногда AI не может исправить баг, и я прошу его вносить случайные изменения, пока баг не исчезнет».
Это чистый эксперимент.
Идеально для пет-проектов на выходные, чтобы быстро протестировать идею. Ключевое здесь: вы не вникаете в код.
А что тогда НЕ вайб-кодинг?
Профессиональная разработка с AI.
Работа разработчик это не только написание кода, но создание продукта, который при этом:
1 Работает надежно и предсказуемо.
2 Безопасен.
3 Понятен другим разработчикам.
4 Легко поддерживать и развивать в будущем.
И результат вайб-кодинга не подходит ни под один из параметров (по крайней мере пока.
Если LLM сгенерировала код, а вы его проверили, протестировали, поняли логику и убедились в его качестве - это не вайб-кодинг. Это современная, эффективная разработка.
Но вайб-кодинг это очень даже хорошо. Просто задачи, где он может применяться отличаются от промышленной разработки.
Проверить идею, сделать простой прототип.
Замечательная же вещь. Главное применять правильно.
А что тогда Vibe coding?
Это подход, когда вы забываете, что код вообще существует. Вы полностью доверяетесь AI, почти не глядя на результат.
В первоисточнике это было описано так:
«Я просто говорю, что хочу, и почти не трогаю клавиатуру».
«Я всегда нажимаю ‘Принять все’ и больше не читаю изменения в коде».
«Когда появляются ошибки, я просто копирую их в чат без комментариев. Обычно это помогает».
«Иногда AI не может исправить баг, и я прошу его вносить случайные изменения, пока баг не исчезнет».
Это чистый эксперимент.
Идеально для пет-проектов на выходные, чтобы быстро протестировать идею. Ключевое здесь: вы не вникаете в код.
А что тогда НЕ вайб-кодинг?
Профессиональная разработка с AI.
Работа разработчик это не только написание кода, но создание продукта, который при этом:
1 Работает надежно и предсказуемо.
2 Безопасен.
3 Понятен другим разработчикам.
4 Легко поддерживать и развивать в будущем.
И результат вайб-кодинга не подходит ни под один из параметров (по крайней мере пока.
Если LLM сгенерировала код, а вы его проверили, протестировали, поняли логику и убедились в его качестве - это не вайб-кодинг. Это современная, эффективная разработка.
Но вайб-кодинг это очень даже хорошо. Просто задачи, где он может применяться отличаются от промышленной разработки.
Проверить идею, сделать простой прототип.
Замечательная же вещь. Главное применять правильно.
Bolt
По своей сути, Bolt - это работающий в браузере ИИ-агент для разработки full-stack веб-приложений на JavaScript. Весь процесс взаимодействия построен на чат-интерфейсе. Вы не пишете код, вы даете команды агенту, а он в реальном времени вносит изменения в кодовую базу и показывает вам живой предпросмотр.
Bolt работает полностью в браузере, отпадает необходимость в настройке локального окружения, установке зависимостей и прочих технических сложностях.
Bolt легко подключается к ключевым сервисам, необходимым для прототипа:
Ограничения, которые нужно учитывать:
Простота это потолок: инструмент отлично справляется с созданием каркаса (scaffolding) и простых MVP, но стоит вам свернуть с проторенной дороги в сторону уникальной бизнес-логики или интеграции с вашим древним корпоративным софтом, как все сломается. Bolt впадает в ступор от нестандартных задач, он не архитектор и не способен на глубокую инженерную мысль.
Отсутствие прямого редактирования кода:
Когда ИИ заходит в тупик и начинает циклически исправлять одну и ту же ошибку или просто не понимает вас, вы не можете вмешаться и поправить код вручную. Приходится либо пытаться уговорить его через промпты, либо экспортировать код и дорабатывать в другой среде.
Только для веб-приложений:
На данный момент Bolt сфокусирован на создании веб-сайтов и веб-приложений. Для мобильных приложений или расширений для браузера он не подходит.
Стоимость - от 20$ в месяц, есть бесплатная версия с ограничением по количеству токенов.
Bolt работает полностью в браузере, отпадает необходимость в настройке локального окружения, установке зависимостей и прочих технических сложностях.
Bolt легко подключается к ключевым сервисам, необходимым для прототипа:
- Supabase для базы данных и аутентификации,
- Netlify для хостинга и развертывания,
- Stripe для платежей,
- Figma для импорта дизайна.
Ограничения, которые нужно учитывать:
Простота это потолок: инструмент отлично справляется с созданием каркаса (scaffolding) и простых MVP, но стоит вам свернуть с проторенной дороги в сторону уникальной бизнес-логики или интеграции с вашим древним корпоративным софтом, как все сломается. Bolt впадает в ступор от нестандартных задач, он не архитектор и не способен на глубокую инженерную мысль.
Отсутствие прямого редактирования кода:
Когда ИИ заходит в тупик и начинает циклически исправлять одну и ту же ошибку или просто не понимает вас, вы не можете вмешаться и поправить код вручную. Приходится либо пытаться уговорить его через промпты, либо экспортировать код и дорабатывать в другой среде.
Только для веб-приложений:
На данный момент Bolt сфокусирован на создании веб-сайтов и веб-приложений. Для мобильных приложений или расширений для браузера он не подходит.
Стоимость - от 20$ в месяц, есть бесплатная версия с ограничением по количеству токенов.
Cursor
Если Bolt - это инструмент для Vibe coding, то Cursor - это его антипод. Это не игрушка для быстрых прототипов, а профессиональная среда разработки (IDE) для создания программного обеспечения.
В отличие от простого копирования кода в ChatGPT, Cursor может проиндексировать и понять весь проект. Это позволяет ему давать контекстуально релевантные ответы и генерировать код, который учитывает уже существующие компоненты и логику.
Вы можете выделить кусок кода и попросить ИИ переписать его или сгенерировать новый блок по описанию, не переключаясь на окно чата.
Можно скормить ИИ ссылки на документацию по библиотекам, и он будет использовать эти знания при ответах.
Ограничения, которые нужно учитывать:
Cursor не напишет за вас сложную систему с нуля. Он ускоряет рутинные задачи, пишет тесты и помогает разбираться в чужом коде, но финальная ответственность за архитектуру и логику всегда лежит на вас. Качество его работы напрямую зависит от вашего умения ставить задачи.
В отличие от браузерных инструментов, Cursor - это десктопное приложение. Вам всё так же нужно настраивать своё рабочее окружение, управлять зависимостями и разбираться с локальными конфигурациями.
Стоимость: недавно были скандалы насчет количества запросов, которое входит в подписку, многие жаловались что теперь упираются в лимит практически каждый день, есть бесплатный триал на 2 недели, потом $20 минимум.
В отличие от простого копирования кода в ChatGPT, Cursor может проиндексировать и понять весь проект. Это позволяет ему давать контекстуально релевантные ответы и генерировать код, который учитывает уже существующие компоненты и логику.
Вы можете выделить кусок кода и попросить ИИ переписать его или сгенерировать новый блок по описанию, не переключаясь на окно чата.
Можно скормить ИИ ссылки на документацию по библиотекам, и он будет использовать эти знания при ответах.
Ограничения, которые нужно учитывать:
Cursor не напишет за вас сложную систему с нуля. Он ускоряет рутинные задачи, пишет тесты и помогает разбираться в чужом коде, но финальная ответственность за архитектуру и логику всегда лежит на вас. Качество его работы напрямую зависит от вашего умения ставить задачи.
В отличие от браузерных инструментов, Cursor - это десктопное приложение. Вам всё так же нужно настраивать своё рабочее окружение, управлять зависимостями и разбираться с локальными конфигурациями.
Стоимость: недавно были скандалы насчет количества запросов, которое входит в подписку, многие жаловались что теперь упираются в лимит практически каждый день, есть бесплатный триал на 2 недели, потом $20 минимум.
Lovable
Lovable позиционирует себя как AI-соинженер и пытается занять нишу между простотой Bolt и профессиональной сложностью Cursor.
Работает через чат-интерфейс, но нацелен на создание более основательных full-stack приложений и поощряет более структурированный и итеративный подход к разработке.
Lovable - это ИИ-конструктор, который генерирует полнофункциональные приложения на основе описаний на естественном языке.
Поддерживает React, и интегрируется с Stripe для платежей, Supabase для баз данных и Netlify для развертывания.
Интеграция с GitHub:
В отличие от более закрытой среды Bolt, Lovable имеет тесную интеграцию с GitHub.
Стоимость: 5 промтов в день бесплатно. Первая платная версия $25
Работает через чат-интерфейс, но нацелен на создание более основательных full-stack приложений и поощряет более структурированный и итеративный подход к разработке.
Lovable - это ИИ-конструктор, который генерирует полнофункциональные приложения на основе описаний на естественном языке.
Поддерживает React, и интегрируется с Stripe для платежей, Supabase для баз данных и Netlify для развертывания.
Интеграция с GitHub:
В отличие от более закрытой среды Bolt, Lovable имеет тесную интеграцию с GitHub.
Стоимость: 5 промтов в день бесплатно. Первая платная версия $25
Replit
Инструмент для проведения внутренних воркшопов, обучения или быстрого создания proof-of-concept без привлечения разработчиков. Работает сразу из коробки, ничего донастраивать не нужно
Главное удобство - всё в одном месте. Вам не нужно отдельно покупать хостинг или настраивать сервер для развертывания.
Вы написали код, нажали кнопку Deploy и приложение уже доступно по ссылке.
Стоимость: есть бесплатный тариф. Платная версия Replit Core, дает доступ к продвинутым ИИ-моделям, стоит от 20$ в месяц.
Главное удобство - всё в одном месте. Вам не нужно отдельно покупать хостинг или настраивать сервер для развертывания.
Вы написали код, нажали кнопку Deploy и приложение уже доступно по ссылке.
Стоимость: есть бесплатный тариф. Платная версия Replit Core, дает доступ к продвинутым ИИ-моделям, стоит от 20$ в месяц.
v0 Vercel
Это личный ИИ-дизайнер и фронтенд-разработчик в одном лице. Его единственная задача генерировать код для UI по текстовому описанию или картинке.
Вы просите «сделать страницу с ценами на три тарифа», и он выдаёт вам несколько готовых визуальных вариантов.
В отличие от Bolt и Lovable, v0 не создаёт полноценное приложение с базой данных и бэкендом. Делает только заглушки на фронте, но чтобы было похоже на правду.
Если надо что то сверстать либо собрать симпатичный фронт, то хороший вариант.
Стоимость: Есть бесплатный ежемесячный пакет кредитов, Pro-тариф стоит от 20$ в месяц.
Вы просите «сделать страницу с ценами на три тарифа», и он выдаёт вам несколько готовых визуальных вариантов.
В отличие от Bolt и Lovable, v0 не создаёт полноценное приложение с базой данных и бэкендом. Делает только заглушки на фронте, но чтобы было похоже на правду.
Если надо что то сверстать либо собрать симпатичный фронт, то хороший вариант.
Стоимость: Есть бесплатный ежемесячный пакет кредитов, Pro-тариф стоит от 20$ в месяц.
Windsurf
Прямой конкурент Cursor.
Cкачиваемый редактор кода (IDE). Вы работаете с кодом напрямую, а ИИ помогает через несколько ключевых функций:
ИИ видит все файлы, что позволяет ему писать и исправлять код в разных частях вашего приложения одновременно.
Каскад - это ключевое отличие от конкурентов. Вы даете общую задачу («добавь аутентификацию через Google»), а Windsurf сам определяет, какие файлы нужно создать или изменить, вносит правки и показывает вам результат для утверждения.
Стоимость: щедрый бесплатный тариф с доступом к базовым моделям ИИ. Платные версии от 15$ в месяц.
Cкачиваемый редактор кода (IDE). Вы работаете с кодом напрямую, а ИИ помогает через несколько ключевых функций:
ИИ видит все файлы, что позволяет ему писать и исправлять код в разных частях вашего приложения одновременно.
Каскад - это ключевое отличие от конкурентов. Вы даете общую задачу («добавь аутентификацию через Google»), а Windsurf сам определяет, какие файлы нужно создать или изменить, вносит правки и показывает вам результат для утверждения.
Стоимость: щедрый бесплатный тариф с доступом к базовым моделям ИИ. Платные версии от 15$ в месяц.
a0 dev
AI-конструктор, созданный специально и исключительно для разработки мобильных приложений на React Native.
Финальная задача это создание работающего мобильного приложения, которое можно тестировать на реальном устройстве и публиковать в App Store.
Принцип работы похож на Bolt, но с мобильной спецификой. Вы описываете в чате идею вашего приложения или конкретного экрана, а a0.dev генерирует готовый проект на React Native.
Практически a0.dev идеально подходит для быстрого прототипирования мобильных приложений, чтобы проверить гипотезу на реальных пользователях смартфонов.
Есть облачная сборка. Вам не нужен Mac для сборки iOS-приложения; a0.dev делает это в облаке и позволяет отправить приложение в TestFlight или App Store.
Стоимость: есть бесплатный тариф с ограниченным количеством генераций в день, чисто чтобы попробовать инструмент но не более. Pro-версия от 20$ в месяц.
Финальная задача это создание работающего мобильного приложения, которое можно тестировать на реальном устройстве и публиковать в App Store.
Принцип работы похож на Bolt, но с мобильной спецификой. Вы описываете в чате идею вашего приложения или конкретного экрана, а a0.dev генерирует готовый проект на React Native.
Практически a0.dev идеально подходит для быстрого прототипирования мобильных приложений, чтобы проверить гипотезу на реальных пользователях смартфонов.
Есть облачная сборка. Вам не нужен Mac для сборки iOS-приложения; a0.dev делает это в облаке и позволяет отправить приложение в TestFlight или App Store.
Стоимость: есть бесплатный тариф с ограниченным количеством генераций в день, чисто чтобы попробовать инструмент но не более. Pro-версия от 20$ в месяц.
Как вам материалы?
Об авторе:
Еще материалы по теме продакт менеджмента: