Вайбкодинг для новичков: от нуля до первого приложения
Вайбкодинг — это когда ты обычными словами описываешь, что хочешь получить, а ИИ пишет код. Ты смотришь результат, говоришь, что поправить, и так по кругу. Термин придумал исследователь ИИ Андрей Карпаты в феврале 2025 года. Ты тут продюсер, а ИИ — программист: продюсер не играет на каждом инструменте, но решает, каким будет трек. Твоя работа — придумать, что строим, проверить, что всё работает, и решить, что дальше.
Бесплатный курс по темеВайбкодинг: курс с нуляНачать курс →
Урок: вайбкодинг, что это и как делать сайты с ИИ
Что можно собрать и что для этого нужно
Лендинг (сайт из одной страницы), Telegram-бот, калькулятор, мини-игру, трекер привычек или портфолио. Для старта хватит браузера и бесплатного аккаунта в ИИ-инструменте. У бесплатных тарифов есть лимиты, но на первые проекты их обычно хватает.
Шаг 0: выбери тип инструмента
ИИ-инструменты для кода бывают трёх видов:
- Конструктор: описываешь словами и получаешь живой сайт прямо в браузере. Lovable, Bolt, v0, Replit. Самый быстрый старт, ничего не надо ставить, но контроля меньше. Идеально для прототипа и лендинга.
- Редактор с ИИ: проект открыт в виде файлов, а ИИ предлагает правки рядом. Cursor, Windsurf, VS Code с Copilot. Ты видишь каждое изменение и решаешь, принять его или нет.
- Агент: получает задачу и сам меняет файлы и запускает команды. Claude Code, Codex, Gemini CLI работают в терминале. Максимум силы, но без Git и проверки результата легко потерять рабочую версию.
Рабочий маршрут: первый прототип собери в конструкторе, перенеси код на GitHub, а дальше продолжай в редакторе или с агентом. Частая ошибка — каждый день прыгать на новый модный инструмент. Лучше один проект до конца, чем пять брошенных. Урок: конструктор, редактор или агент
Шаг 1: план на одну страницу
ИИ не читает мысли. Попросишь «трекер для зала» — получишь оплату, чат и рейтинг, хотя нужно было просто отмечать тренировки. Пять строк экономят часы: цель одним предложением, для кого, три главные функции, что не делаем сейчас и по каким признакам понять, что готово. Урок: сначала план
Шаг 2: опиши результат и проси по одной фиче
Не «сделай сайт», а что именно: «Одностраничный сайт для кофейни: меню, адрес, кнопка заказа в Telegram, тёмная тема, удобно на телефоне». Дальше проси одну функцию за раз: сначала каркас, потом меню, потом форму. Маленький шаг легко проверить и откатить. Если что-то сломалось, отдавай ИИ ошибку целиком, а не «не работает». Урок: как ставить задачу нейросети
Шаг 3: сохрани, откати, задеплой
Сохраняй каждую рабочую версию (история версий в инструменте или Git), чтобы откатиться, если новый шаг всё сломал. Деплой, то есть публикация проекта, чтобы он открывался у других по ссылке, — последний шаг, когда всё проверено. Сейчас это просто: один раз подключаешь репозиторий с GitHub к хостингу, и каждый push в главную ветку сам выкатывает новую версию. Урок: хостинг и деплой
Шаг 4: проверь сам
«Готово, всё работает!» от агента — не доказательство. Он мог не запускать код или сломать соседнюю страницу. Открой превью с телефона и с компьютера. Сначала обычный путь, потом странное: месяц без данных, очень длинное название, двойное нажатие на кнопку. Ломается обычно именно на странном. И попроси агента написать автотесты для каждой новой функции. Урок: не верь на слово
Почему у вайбкодинга плохая репутация: 4 ошибки
ИИ пишет код, который работает, но не всегда безопасен. Из-за этих четырёх ошибок и случается большинство страшилок:
1. Ключ в коде. API-ключ в коде страницы или в публичном репозитории быстро находят боты, которые сканируют GitHub, а за их запросы платишь ты. Секреты живут только на сервере. Ключ утёк? Сразу отзови его и создай новый. Урок: ключи и секреты
2. База без правил доступа. Любой скачает данные всех пользователей.
3. Админка, спрятанная удалением кнопки. Адрес /admin всё равно можно набрать руками. Проверка «это точно админ?» должна быть на сервере при каждом запросе.
4. Вера браузеру. Через инструменты разработчика (F12) пользователь может поменять любой запрос: цену, свой id, роль «админ». Сервер сам проверяет, кто спрашивает, и сам считает цены. Урок: безопасность приложения
И ещё деньги. Платные API для ИИ считают токены, и если весь класс задаёт сотни вопросов в ночь перед экзаменом, сумма уже заметная. Поставь лимит расходов и уведомление о тратах там, где сервис это позволяет. Урок: деньги и лимиты
Частые вопросы
Вайбкодинг — это плохо?
Сам по себе нет. Плохую славу ему делают проекты, которые выкатили без проверки: ключи в коде страницы, базы без правил доступа, проверка админа только в интерфейсе. Если тестировать каждую функцию и держать секреты на сервере, это быстрый и нормальный способ делать продукты.
Нужно ли уметь программировать, чтобы начать вайбкодинг?
Нет. Для первого проекта хватит браузера и бесплатного аккаунта в ИИ-инструменте. Но понимать, что происходит, полезно: так быстрее замечаешь, где ИИ ошибся. Поэтому в курсе Git, хостинг и API объяснены простыми словами.
Какой инструмент для вайбкодинга лучше для новичка?
На первый вечер — конструктор в браузере вроде Lovable, Bolt, v0 или Replit: он быстрее всех даёт живую страницу, и ничего не надо ставить. Когда прототип заработал, перенеси код на GitHub и продолжай в редакторе с ИИ или с агентом.