AI-разработка: от вайбкода до своих рук
Вы уже разработчик
Полный цикл на одном мини-проекте: идея → просьба → дифф → тест → снимок → публикация. И честная карта, куда расти дальше.
Вы уже разработчик
В начале курса вы написали агенту просьбу и получили страницу, которую боялись трогать. Семь уроков спустя у многих остаётся одно и то же ощущение: «это всё была подготовка, а настоящая разработка начнётся потом — когда я выучу язык и стану писать код сам». Это ощущение мешает, потому что оно неверно. Сегодня посмотрим, почему, — и проверим на деле.
Цикл, а не клавиатура
Снаружи разработка выглядит как печать кода. Человек в наушниках, чёрный экран, строки бегут. Из-за этой картинки кажется, что вайбкодинг — обходной путь, а «по-настоящему» будет тогда, когда строки станете набирать вы.
Изнутри разработка выглядит иначе. Это цикл ответственности:
цель → границы → изменение → проверка → снимок → выпуск
Сформулировать, что нужно. Очертить, чего трогать нельзя. Внести изменение. Убедиться, что оно делает то, что задумано, и не ломает остальное. Зафиксировать состояние, к которому можно вернуться. Показать результат миру. И снова: следующая цель.
Каждый шаг этого цикла вы уже проходили — не в теории, а руками:
- цель — бриф агенту из урока про первый проект;
- границы — «этот файл не трогай» из урока про порядок и границы доверия из урока про уверенные ошибки;
- изменение — код писал агент, а дифф читали вы, как в уроке про непрочитанный код;
- проверка — чтение ошибок из урока про поломки и тесты из урока про доверие;
- снимок — коммит, то есть сохранённое состояние проекта, к которому можно откатиться;
- выпуск — публикация страницы, которую вы делали ещё во втором уроке.
Кто именно набирает строки внутри шага «изменение» — деталь реализации. В больших командах код тоже часто приходит «извне»: от коллеги, из готовой библиотеки, теперь — от агента. Разработчиком человека делает не клавиатура, а то, что рамки цикла держит он.
Взгляните на схему из самого первого урока ещё раз. Тогда она объясняла, что агент делает внутри одного шага. Теперь видно, что весь маршрут вокруг — ваш:
Слова про цикл легко принять и забыть. Есть только одна честная проверка: пройти его целиком, от идеи до публикации, без подсказок на каждом шаге. Этим и займёмся.
Выпускной проект: одна возможность за 60–90 минут
Возьмём страницу из урока «Первый проект за вечер». Если она не сохранилась — не беда: попросите агента собрать её заново по вашему старому брифу. В первый раз на неё ушёл вечер. Засеките, сколько уйдёт теперь, — это само по себе неплохой замер прогресса.
Шаг 0. Выберите одну возможность
- Счётчик посещений. Страница показывает, сколько раз её открывали в этом браузере.
- Тёмная тема. Кнопка переключает светлое и тёмное оформление, выбор запоминается между визитами.
- Гостевая книга. Поле для сообщения и список оставленных записей; записи переживают перезагрузку страницы.
Именно одну. Вторая возможность — это второй проход цикла, его можно сделать завтра.
Шаг 1. Бриф
По той же формуле, что во втором уроке: что добавить, как выглядит готовое, чего не трогать. Например, для счётчика:
Добавь на страницу счётчик посещений.
Готово, когда: вверху страницы видна строка «Вы здесь N-й раз»,
число растёт при каждом открытии страницы
и не сбрасывается после перезагрузки.
Не трогай: остальной текст, цвета и раскладку страницы.
Строка «не трогай» — не формальность. Без неё агент охотно «улучшит» заодно и то, что вас устраивало.
Шаг 2. Снимок ДО
Прежде чем агент прикоснётся к коду, сделаем коммит — снимок текущего состояния проекта:
git add .
git commit -m "before: страница до счётчика"
Теперь любой результат агента обратим. Можно разрешить ему что угодно: худший исход — одна команда отката.
Шаг 3. Агент работает — вы читаете дифф
Отправьте бриф. В каком инструменте — не принципиально: Claude Code, Cursor, Copilot — интерфейсы разные, механика одна. Когда агент отчитается, не спешите открывать страницу. Сначала дифф — список изменений между «было» и «стало»:
git diff
Три вопроса к диффу: изменились ли только те файлы, которые вы ожидали; понятен ли смысл каждого добавленного куска; не исчезло ли что-то, об удалении чего вы не просили. Непонятный кусок — повод не для тревоги, а для вопроса агенту: «объясни, зачем эта строка». Отвечать на такие вопросы — часть его работы.
Шаг 4. Два теста
Один тест на основной сценарий, один — на каверзный случай:
- счётчик: открыли страницу — число выросло; перезагрузили — не сбросилось в ноль;
- тема: нажали кнопку — цвета сменились; перезагрузили — выбор не забылся;
- гостевая книга: оставили запись — она в списке; отправили пустое сообщение — страница не сломалась и мусор в список не попал.
Если в уроке про тесты вы просили агента оформлять проверки скриптом — попросите и здесь. Если нет, честная ручная проверка обоих сценариев тоже считается: главное, что вы проверяете заявленное поведение, а не верите отчёту «всё работает».
Шаг 5. Снимок ПОСЛЕ и публикация
Тесты прошли — фиксируем:
git add .
git commit -m "feat: счётчик посещений"
И публикуем тем же способом, каким вы выкладывали страницу во втором уроке. Финальный штрих: откройте опубликованную версию в браузере и прогоните оба теста ещё раз. Опубликовано — не то же самое, что работает у вас локально.
Чеклист «сделано»
- Бриф написан до старта и содержит «готово, когда» и «не трогай»
- Снимок ДО существует
- Дифф прочитан; на каждый непонятный кусок получен ответ агента
- Оба теста пройдены, включая каверзный
- Снимок ПОСЛЕ сделан, у него внятное сообщение
- Опубликованная страница открыта в браузере и проверена там
Пока вы шли по шагам, что-то наверняка произошло незаметно: рука сама потянулась к диффу, «всё работает» от агента вы машинально перевели как «надо проверить». В этой незаметности легко пропустить главный результат курса — назовём его вслух.
Что теперь работает на автомате
- Красный столбец текста в терминале вас не пугает: вы находите в stack trace — распечатке пути ошибки — строку с сутью и файл с номером, как в уроке «Почему сломалось».
- Изменения агента вы смотрите диффом до того, как радоваться, и знаете, что откат стоит одну команду, — привычка из урока «Код, который ты не читал».
- Фразу «готово, всё работает» вы читаете как «ещё не проверено» и подтверждаете тестом — навык из урока «Проверяем, а не верим».
- Проект у вас разложен так, что агент не блуждает: понятные файлы и записанные инструкции, как в уроке «Порядок в проекте».
- Уверенный тон ответа сам по себе вас не убеждает: где заканчивается доверие, вы решили ещё в уроке «Когда AI ошибается уверенно».
Автоматизм — это фундамент. А дальше на нём можно строить разное, и тут дороги расходятся.
Куда дальше: три дороги
Вглубь систем
Ваша страница живёт на одном сервере и обслуживает одного посетителя за раз. Настоящие продукты выдерживают тысячи посетителей одновременно, и для этого их собирают из частей: базы данных, очереди, кеши, балансировщики. Как эти части складываются в работающую систему — про это трек «System Design Fundamentals». Он тоже построен на живых схемах: те же движущиеся пакеты, что вы видели здесь, только систем побольше.
В сеть
Каждый раз, когда вы публиковали страницу, за кадром происходило то, что мы ни разу не разобрали: браузер и сервер о чём-то договаривались, данные ехали через десятки промежуточных машин. Как программы вообще общаются между компьютерами — про это трек «Компьютерные сети». После него слова «сервер недоступен» перестанут быть магией — так же, как в этом курсе перестали быть магией сообщения об ошибках.
Больше кода своими руками
Бросать агента не нужно. Но можно постепенно забирать себе часть шага «изменение». Правило простое: если в диффе изменение на одну строку — внесите его руками, а агента попросите проверить. Поменять текст, число, цвет. Через какое-то время рука поднимется на маленькую функцию — напишите её по-своему и посмотрите, что скажут тесты. Код перестаёт быть чужим языком не от чтения учебника, а от таких мелких правок, у каждой из которых есть страховка: снимок и тест.
Разница, которая осталась
Разница между вайбкодером и разработчиком — не в том, кто печатает код. Она в том, кто отвечает за результат: кто решил, что именно делать, кто очертил границы, кто заметил поломку, кто проверил и кто поставил своё имя под снимком. Посмотрите на чеклист выпускного проекта: все шесть пунктов — про ответственность, и все шесть сегодня закрыли вы.
У цикла нет последнего шага: за выпуском приходит следующая цель. Ваша, скорее всего, уже вертится в голове. Запишите её брифом — остальное вы умеете.