12 июня 2026 · 6 мин

Как этот сайт собирают агенты

Этот сайт не просто «сделан с помощью ИИ» в маркетинговом смысле. Его код в буквальном смысле пишут агенты. Пока одна сессия Claude Code строила эффекты первого экрана на three.js, вторая параллельно чинила сборку, выкатывала разделы и настраивала CI. Я ставил задачи и принимал работу.

Текст описывает процесс разработки в июне 2026 года. С тех пор сайт продолжает меняться.

Из чего собран сайт

Next.js 16 (App Router, Turbopack), React 19, Tailwind CSS 4, GSAP с ScrollTrigger, ScrollSmoother и SplitText, three.js через react-three-fiber для трехмерной фигуры на первом экране. Проекты в каталоге подтягиваются из GitHub API и обновляются раз в час. Ничего экзотического в стеке нет, интереснее устроен сам процесс.

Процесс

Каждая сессия проходит один и тот же цикл из четырех шагов.

Спека. Контекст хранится в CLAUDE.md и AGENTS.md прямо в репозитории. Там записаны соглашения, известные грабли и то, чего делать нельзя. Это полноценные инженерные документы, а не файлы для галочки.
Работа. Агент пишет код сам, мелкими шагами, и сверяется со спекой. Параллельные задачи разводятся по разным сессиям.
Проверка. От нее больше всего зависит качество. Прежде чем показать результат, агент обязан сам убедиться, что код работает. Он запускает продакшен-сборку, открывает страницу в браузере, прокручивает ее, проходит меню с клавиатуры, снимает скриншоты и метрики Lighthouse.
Память. Найденные ошибки и способы их исправить записываются в CLAUDE.md, чтобы следующая сессия на них не наступала.

Снаружи процесс страхует GitHub Actions. Линтер и сборка запускаются на каждый пуш.

Пять багов, которые поймала проверка

Все пять настоящие, они взяты из истории коммитов этого репозитория.

Сборка вообще не собиралась. В коде остались вызовы удаленного провайдера плавного скролла, и TypeScript падал. Это показал первый же запуск npm run build.
Three.js зря грузился на телефонах. В той версии 3D на мобильных не отображалось, но почти мегабайт кода все равно скачивался, потому что проверка устройства находилась внутри динамически загружаемого чанка. Проверку перенесли до импорта, и мобильный бандл похудел примерно на 1 МБ.
Заголовок ломался посреди слова. Слово «Эксперименты» при размере 9vw не помещалось в свою колонку, и SplitText переносил его по буквам без дефиса. Это заметили на скриншоте и перестроили сетку.
Якоря из мобильного меню не работали вовсе. Пока меню открыто, body заблокирован через overflow: hidden, и переход к якорю молча не срабатывал. Теперь прокрутка выполняется после закрытия меню.
CI падал из-за package-lock. npm не записывает в лок-файл бинарники для чужих платформ (npm/cli#4828), поэтому лок, собранный на macOS, не содержал Linux-сборок lightningcss. Помогло явное указание optionalDependencies.

Разные проверки ловят разные ошибки. Сборка и CI находят проблемы компиляции, а браузерные сценарии и скриншоты находят проблемы интерфейса.

Вывод

Агент пишет код быстрее меня, но скорость здесь не главное. Важнее, что цикл «спека → работа → проверка → память» позволяет проверять результат и не повторять уже известные ошибки.

Реализацию можно поручить агенту. Понимать задачу и принимать результат по-прежнему должен я.