AI-разработка: от вайбкода до своих рук
Вайбкодинг без магии
Что на самом деле происходит, когда вы просите AI написать код: агент, его инструменты и цикл план-правка-проверка.
Вайбкодинг без магии
Вечер, когда всё получилось
Вы открыли AI-агента — Claude Code, Cursor, Copilot, интерфейсы разные, механика одна — и написали: «сделай мне сайт с моими рецептами». Пару минут по экрану бежал текст, затем агент отчитался: готово. Вы открыли страницу — и там действительно сайт. Заголовок, карточки рецептов, даже поиск, о котором вы не просили.
Это ощущение стоит запомнить: вы описали желание обычными словами — и получили работающую программу. Такой способ работать называют вайбкодингом, и стыдиться тут нечего: так сейчас начинают очень многие, в том числе будущие сильные инженеры. Загвоздка не в способе. Загвоздка проявляется на втором шаге.
Вы написали: «сделай красивее». Агент снова поработал — и сайт стал другим. Не лучше, не хуже — другим. Исчез поиск, карточки посинели, шрифт сменился. Вы попросили «верни как было» — и получили третий вариант, не похожий ни на первый, ни на второй.
В этот момент вайбкодинг из магии превращается в лотерею. Хорошая новость: чтобы вернуть себе руль, не нужно срочно учиться программировать. Нужно один раз увидеть, что происходит между вашим сообщением и появившимся кодом. Этим сейчас и займёмся.
Кто сидит по ту сторону чата
Сначала уберём главную иллюзию. Кажется, что агент «знает» ваш проект: помнит вчерашний сайт, держит в голове все файлы. Отсюда и вера, что ему можно сказать «сделай красивее» — он же в курсе, что было.
Он не в курсе. Устройство агента проще и честнее.
Внутри — языковая модель: программа, которая продолжает текст. Вы даёте ей текст просьбы — такую просьбу называют промптом (prompt) — и она дописывает продолжение: рассуждение, план, код. Сама по себе модель больше ничего не умеет: ни открыть файл, ни запустить программу.
Это умеет агент — обвязка вокруг модели, у которой есть инструменты. Основных три:
- прочитать файл — увидеть, какой код в проекте уже есть;
- записать файл — внести правку;
- выполнить команду — собрать проект, запустить его, прогнать проверку.
Модель решает, что делать; инструменты делают. Из их переписки и складывается работа агента.
Теперь главное. Агент не помнит ваш проект между разговорами. Каждый раз он заново читает нужные файлы, и всё, что он успел прочитать, называется контекстом. Контекст — это то, что модель видит прямо сейчас: ваша просьба, куски файлов, вывод команд. Чего в контексте нет — того для модели не существует, каким бы очевидным это ни было для вас.
Отсюда и третий вариант сайта в ответ на «верни как было»: это «было» существовало только в вашей памяти. В контекст агента оно не попало — и он снова угадывал.
Хорошо: агент умеет читать, писать и запускать. Но в каком порядке он это делает? Что за работа спрятана в тех двух минутах, пока по экрану бежит текст?
Две минуты между просьбой и «готово»
Разберём их на конкретной просьбе: «добавь кнопку, чтобы рецепты можно было отсортировать по времени готовки». Агент проходит цикл из шести шагов.
Понять просьбу. Модель разбирает текст: речь про список рецептов, нужна сортировка, нужна кнопка.
Осмотреться. Агент читает файлы проекта: где лежит список рецептов, какой файл рисует страницу, как устроены карточки. Это и есть заполнение контекста — чтение вместо памяти.
Составить план. Какие файлы менять и как: в данные добавить время готовки, на страницу — кнопку, к кнопке — сортировку.
Внести правку. Агент пишет в файлы. Каждую правку можно посмотреть как дифф (diff) — построчный список изменений: эти строки убрали, эти добавили. А сохранённый снимок проекта после правки называют коммитом (commit). Оба слова пока только для знакомства — им посвящён отдельный урок.
Запустить и проверить. Агент выполняет команду: собирает проект или поднимает dev server — локальный сервер разработки, который показывает сайт прямо на вашем компьютере, пока вы его делаете. Если что-то сломано, в ответ приходит сообщение об ошибке со stack trace — «следом вызовов», распечаткой того, где именно программа споткнулась. Тогда агент возвращается на шаг правки и пробует ещё раз.
Показать результат. Агент пересказывает, что сделал, и предлагает посмотреть.
Заметьте: это не специальный «режим для новичков». Ровно этот цикл — понять, осмотреться, спланировать, поправить, проверить — крутит в голове любой разработчик. Агент лишь проходит его быстрее и без жалоб.
Внизу страницы этот цикл собран в живую схему; кнопки дальше по тексту будут запускать на ней разные сценарии.
Осталась неувязка. Если цикл такой разумный — с планом и проверкой, — почему «сделай мне сайт» принесло поиск, о котором вы не просили, а «сделай красивее» снесло полработы? Посмотрим, что расплывчатая просьба делает с каждым шагом.
Просьба, которую нельзя проверить
«Сделай красивее» ломает цикл дважды.
Первый слом — на шаге плана. У слова «красивее» нет содержания: красивее для кого, в чём именно? Модель не может спланировать пустоту, поэтому заполняет её догадками — типичными решениями из миллионов чужих проектов, на которых она училась. Синие карточки появились не из вашей головы, а из «так часто делают».
Второй слом — на шаге проверки. Проверить можно только то, у чего есть критерий. «Работает сортировка по времени» — проверяется. «Стало красивее» — нет. Агент честно запускает проект, видит, что тот не падает, и ставит галочку «проверено». Но проверил он «код запускается», а не «получилось то, что вы хотели». Между этими двумя проверками зазор — в нём и живёт «не то».
Запустите первый сценарий на схеме внизу и следите за одним: агент нигде не останавливается — каждый пробел он уверенно закрывает догадкой и доводит до финиша не вашу задачу, а свою версию вашей задачи.
Есть и вторая неприятность, которая проявляется даже с точной просьбой. Вы могли её заметить сами: тот же вопрос, заданный завтра, даёт другой ответ.
Почему второй раз выходит по-другому
Языковая модель не ищет ответ в справочнике, где на каждый вопрос лежит одна правильная строчка. Она каждый раз собирает продолжение текста заново, и в этой сборке есть доля случайности. Житейская аналогия — человек, которого дважды попросили пересказать один фильм: смысл сойдётся, слова будут другими.
Для болтовни это безобидно. Для кода — нет: «другие слова» означают другие имена, другую структуру файлов, другие мелкие решения. Оба варианта могут работать — и при этом не совпадать.
Отсюда два практических следствия. Первое: удачный промпт — не заклинание; сохранить его полезно, но он не обязан дважды дать один и тот же код. Второе: у агента нет позиции «как правильно именно в вашем проекте» — если вариантов несколько, выбирать между ними придётся вам. Пока — на глаз; в уроке про тесты появится способ выбирать по-инженерному.
Итог пока тревожный: пробелы заполняются догадками, ответы плавают от запуска к запуску. Что в этой картине остаётся под вашим управлением? Ровно то, что нельзя делегировать.
Что остаётся у вас навсегда
Три вещи, которые не вычислит ни одна модель, потому что они находятся не в коде, а в вашей голове.
Цель
Зачем этот сайт существует. «Показать двадцать семейных рецептов родственникам» и «вести базу на тысячу записей с поиском по ингредиентам» — внешне похожие сайты с совершенно разным устройством. Пока цель не названа, агент строит усреднённый сайт ни для кого.
Границы
Что трогать нельзя. «Поиск не трогай», «цвета оставь как есть», «меняй только страницу списка». Границы защищают уже сделанное от следующей догадки.
Критерий «готово»
Как проверить результат за минуту. Не «стало лучше», а «на странице списка появилась кнопка „По времени готовки“; по клику рецепты выстраиваются от быстрых к долгим; остальное выглядит как раньше».
Соберём все три в одну просьбу и прогоним через тот же цикл. Запустите второй сценарий и сравните с первым: теперь у шага «план» есть рамки, у шага «проверка» — настоящий критерий вместо галочки «не упало».
И ещё одно следствие, самое недооценённое. Когда в точной просьбе всё-таки остаётся пробел, агенту есть обо что споткнуться — и вместо догадки он останавливается и спрашивает: «сортировать по возрастанию или по убыванию?» Вопрос от агента — лучший из возможных исходов: ответить на него — десять секунд, разгребать угаданное — вечер. Запустите третий сценарий и посмотрите на то место, где в первом была догадка: теперь там пауза и вопрос вам.
Вы уже видели механику
Подведём черту под этим вечером. Агент — это языковая модель плюс инструменты: читать файлы, писать файлы, запускать команды. Проект он не помнит — он читает его в контекст. Работает циклом: понять, осмотреться, спланировать, поправить, проверить, показать. Догадки в этом цикле берутся из пробелов вашей просьбы, а разброс ответов — из самого устройства генерации. Ваша несменяемая роль — цель, границы и критерий «готово».
Одного цикла на схеме мало, чтобы это стало навыком. Навык появляется на настоящей задаче — когда цель ваша, границы ваши и результат хочется показать живому человеку. В следующем уроке мы сделаем первый настоящий проект за один вечер: выберем идею по размеру, сформулируем просьбу по сегодняшним правилам и доведём цикл агента до страницы, которую не стыдно отправить другу.