Вайбкодинг (vibe coding) — разработка в диалоге с ИИ: вы описываете задачу обычным языком, модель пишет код. Хороший стек для такого подхода — это не модные инструменты, а связка, в которой ИИ меньше ошибается, а его ошибки дёшево откатываются. Ниже — инструменты, технологии и обязательный минимум по защите данных.
Что такое вайбкодинг и почему стек важен
Термин ввёл Андрей Карпатый в начале 2025 года. Разработчик описывает желаемое поведение приложения, ИИ генерирует, исправляет и рефакторит код, а человек фокусируется на продукте.
Выбор стека здесь важнее, чем в обычной разработке: модели заметно лучше работают с популярными, хорошо задокументированными технологиями. С нишевым фреймворком, по которому мало примеров, ИИ чаще придумывает несуществующие API и ошибается в архитектуре.
Практическое правило: берите то, по чему больше всего открытого кода и документации. Next.js, а не экзотический метафреймворк. React, а не Solid. PostgreSQL, а не CockroachDB.
AI-инструменты для вайбкодинга
Cursor — AI-редактор кода
Cursor — форк VS Code с глубокой интеграцией ИИ:
- агентный режим: многофайловые изменения, запуск тестов и исправление ошибок;
- чат с контекстом всего проекта;
- Tab-автодополнение с учётом соседних файлов;
- поддержка MCP (Model Context Protocol) для подключения внешних инструментов;
- правила проекта (
.cursor/rules).
Можно выбирать модели разных провайдеров (Anthropic, OpenAI, Google). Есть бесплатный тариф с ограничениями и платные планы — цены на момент написания смотрите на сайте; оплата иностранной картой.
Cursor лучше всего работает с существующей кодовой базой. Если стартуете с нуля, начальный скаффолдинг удобно сделать в Lovable или Bolt.new, а затем перейти в Cursor.
Сайт: cursor.com
Claude Code — агент командной строки от Anthropic
Claude Code — AI-агент, который работает в терминале и IDE, читает и пишет файлы проекта и запускает команды.
- запускает тесты, линтеры, сборку и итеративно доводит задачу до результата;
- делает git-коммиты с осмысленными сообщениями;
- читает
CLAUDE.md— файл с инструкциями для проекта; - подключает MCP-серверы.
Доступен в подписках Claude и через API — актуальные условия на сайте Anthropic. Особенно силён в рефакторинге и задачах, требующих понимания архитектуры.
Lovable — приложение из промпта
Lovable — платформа для создания веб-приложений по текстовому описанию:
- генерирует дизайн, фронтенд на React и бэкенд;
- интеграция с Supabase и собственный облачный бэкенд;
- публикация в один клик;
- синхронизация с GitHub;
- визуальный редактор для правки интерфейса.
Хорош для быстрого MVP. Сложную бизнес-логику и интеграции удобнее дорабатывать в Cursor или Claude Code. Есть бесплатный тариф и платные планы.
Сайт: lovable.dev
Bolt.new — вайбкодинг в браузере
Bolt.new от StackBlitz — среда разработки с ИИ прямо в браузере:
- WebContainers — Node.js в браузере;
- npm-пакеты и предпросмотр приложения в реальном времени;
- шаблоны Next.js, Remix, SvelteKit, Astro и других;
- деплой через Netlify и другие платформы.
Bolt.new удобнее Lovable тем, кто хочет видеть и контролировать код.
Сайт: bolt.new
v0 by Vercel — генерация интерфейсов
v0 генерирует React-компоненты на Tailwind CSS и shadcn/ui по описанию или скриншоту, а также целые приложения с деплоем на Vercel. В вайбкодинге его удобно использовать для отдельных экранов и компонентов (таблицы, формы, карточки), которые потом дорабатываются в редакторе.
Сайт: v0.app
Windsurf — альтернатива Cursor
Windsurf (ранее Codeium) — AI-редактор кода с агентом Cascade, работающим в контексте всего проекта. По возможностям близок к Cursor; выбор между ними — дело вкуса и тарифов.
Сайт: windsurf.com
Рекомендуемый технологический стек
Фронтенд: Next.js + TypeScript + Tailwind CSS + shadcn/ui
Next.js — самый частый выбор для вайбкодинга:
- по нему огромное количество открытого кода и документации;
- фронтенд и бэкенд в одном проекте (Route Handlers, Server Actions);
- Tailwind CSS ИИ генерирует уверенно;
- shadcn/ui — компоненты копируются в проект, и ИИ легко их адаптирует.
Для небольших SPA без SSR и SEO проще Vite + React + TypeScript.
Чего избегать: фреймворков с маленьким сообществом — по ним у моделей мало примеров, выше риск выдуманных API.
Бэкенд: PocketBase или Supabase
Для большинства vibe-проектов полноценный бэкенд избыточен:
- Старт: PocketBase на VPS — один файл, база, авторизация, файлы и REST API без серверного кода. См. PocketBase как бэкенд.
- Рост: PostgreSQL — Supabase (облачный или self-hosted) или управляемый PostgreSQL у российского провайдера.
- Сложная логика: Route Handlers в Next.js или отдельный сервис на Node.js/Python.
База данных: PostgreSQL как основной выбор
PostgreSQL — стандарт для веб-приложений: по нему больше всего примеров, и запросы, схемы и миграции ИИ генерирует уверенно.
SQLite (через PocketBase, Turso, Cloudflare D1) — отличный выбор для старта и небольших проектов, ИИ его тоже хорошо знает. Подробное сравнение — в статье SQLite, PostgreSQL, MySQL или NoSQL.
MongoDB подходит для документных данных, но в большинстве задач PostgreSQL с JSONB-колонками решает то же самое.
Деплой: Coolify на российском VPS или Vercel
- Для российских проектов: Coolify на VPS — ставится один раз и деплоит все проекты через git push. Альтернатива без своего сервера — Amvera с рублёвой оплатой.
- Для международных проектов и MVP: Vercel для фронтенда плюс Railway или Fly.io для бэкенда и БД.
Пошагово — в статье как задеплоить вайбкод-проект за 10 минут.
Управление состоянием: Zustand или TanStack Query
- Zustand — минималистичное глобальное состояние;
- TanStack Query — серверное состояние, кэширование, синхронизация;
- Jotai — атомарное состояние.
Redux Toolkit для новых небольших проектов обычно избыточен.
Аутентификация
- Clerk — managed-сервис с готовыми UI-компонентами, есть бесплатный тариф; оплата иностранной картой.
- Auth.js (NextAuth) или Better Auth — open-source, данные пользователей в вашей базе.
- PocketBase — авторизация из коробки.
Для российских проектов без возможности платить за Clerk подойдут open-source библиотеки с PostgreSQL или PocketBase.
Стек по уровням
Стартер (MVP за выходные)
- Инструмент: Lovable или Bolt.new
- Фронтенд: React (генерируется автоматически)
- Бэкенд: Supabase cloud (бесплатный тариф)
- Деплой: Vercel Hobby
- Стоимость: в рамках бесплатных тарифов
Подходит для хакатонов, прототипов, проверки идей.
Indie Hacker (от идеи до продаж)
- Инструмент: Cursor и/или Claude Code
- Фронтенд: Next.js + TypeScript + Tailwind + shadcn/ui
- Бэкенд: PocketBase self-hosted
- База данных: SQLite (PocketBase) или управляемый PostgreSQL
- Деплой: Coolify на VPS или Amvera
- Стоимость: подписка на AI-инструмент плюс недорогой VPS
Подходит для SaaS, инди-продуктов, небольших команд.
Команда (production-grade)
- Инструмент: Cursor + Claude Code + v0 для интерфейсов
- Фронтенд: Next.js + TypeScript + Tailwind + shadcn/ui
- Бэкенд: Supabase self-hosted или управляемый PostgreSQL в Yandex Cloud
- Деплой: Coolify или Kubernetes в российском облаке
- Аутентификация: Supabase Auth или Keycloak
- CI/CD: GitHub Actions
Подходит для B2B SaaS и продуктов с командой.
Инструменты поддержки вайбкодинга
Инструкции для ИИ: CLAUDE.md, AGENTS.md или правила Cursor в корне проекта — архитектура, соглашения, запреты. ИИ читает их в каждой сессии.
Линтер и типизация: TypeScript + ESLint + Prettier ловят ошибки сгенерированного кода сразу.
Тесты: Vitest или Jest. Просите ИИ писать тесты вместе с кодом.
Схема БД под рукой: держите схему в отдельном файле или миграциях — ИИ точнее пишет запросы, когда видит структуру таблиц.
Бэкапы базы в вайбкодинге: обязательный минимум
Агент с доступом к терминалу работает быстро — и так же быстро может выполнить prisma migrate reset, DROP TABLE или удалить папку с SQLite-файлом. Код откатывается через git, данные — только из бэкапа. Что делать, если это уже случилось, — в статье ИИ стёр базу данных: что делать.
Где лежат данные в стеке из этой статьи:
- PocketBase:
pb_data/data.dbи папкаstorageс файлами — подробно в статье бэкап PocketBase; - PostgreSQL (Supabase, управляемая БД): дамп через
pg_dump, файлы Storage — отдельно; - Vercel: своего диска нет, данные во внешних сервисах.
Минимальная схема: бэкап по cron вне досягаемости агента, плюс ручная точка сохранения перед каждой миграцией.
# cron: консистентная копия SQLite и загрузка версии
sqlite3 /data/pb_data/data.db ".backup '/tmp/pocketbase.db'"
dbsend backup /tmp/pocketbase.db -d "$DBSEND_DATABASE_ID" -e sqlite -l "nightly-$(date +%F)"
И правила для агента в CLAUDE.md или AGENTS.md:
### Работа с базой данных
- Перед любой миграцией или массовым UPDATE/DELETE запусти:
`dbsend backup ./data.db -l "before-<что меняешь>"` (база задана в .dbsend.json)
- Не выполняй DROP, TRUNCATE, migrate reset без явного подтверждения в чате.
- Схему меняй только через миграции.
Агенту лучше давать API-ключ только на одну базу. Через MCP он может проверять статус бэкапов и сравнивать версии, но сам файл загружает CLI — настройка в статье бэкапы через MCP из Claude Code и Cursor. И раз в месяц восстанавливайте бэкап в отдельный файл и проверяйте его: как проверить, что бэкап рабочий.
Частые вопросы
Что такое вайбкодинг?
Метод разработки, при котором вы описываете задачу на естественном языке, а AI-инструмент (Cursor, Lovable, Claude Code) генерирует и меняет код. Термин ввёл Андрей Карпатый в 2025 году. Акцент — на продукте, а не на синтаксисе.
Cursor или Windsurf — что выбрать?
Оба редактора умеют многофайловые правки агентом и поддерживают несколько моделей. Попробуйте бесплатные тарифы на своём проекте и сравните, где агент меньше ошибается и где удобнее работать с контекстом.
Можно ли создать SaaS без опыта программирования?
Простой CRUD-сервис — да: Lovable и Bolt.new справляются. Но для надёжного production-продукта нужно понимать код: проверять, что сгенерировал ИИ, настраивать безопасность, оптимизировать запросы и настраивать бэкапы.
Какая AI-модель лучше всего для кодинга?
Лидеры меняются каждые несколько месяцев. Смотрите свежие результаты бенчмарков вроде SWE-bench и проверяйте модели на своих задачах — Cursor и Windsurf позволяют переключаться между провайдерами.
Как вайбкодить на русском языке?
Современные модели хорошо понимают русскоязычные промпты. Технические названия (функции, переменные, библиотеки) лучше оставлять на английском, бизнес-логику можно описывать по-русски.
Нужен ли бэкенд для вайбкодинга?
Не обязательно. PocketBase, Supabase или Firebase дают API, авторизацию, базу и хранилище без серверного кода. Server Actions и Route Handlers в Next.js позволяют писать бэкенд-логику в том же репозитории.
Как организовать командную работу при вайбкодинге?
Общий файл инструкций (CLAUDE.md/AGENTS.md) с архитектурными решениями, обязательное code review, TypeScript и линтер, тесты вместе с кодом. И отдельные ключи доступа к данным для каждого агента и разработчика.



