Искра
Оглавление

Вайбкодинг: от идеи до продакшена

Глава 0418 темоколо 21 часа

Для тех, кто хочет довести макет до работающего продукта. Лендинг, веб-приложение с базой и сайт на своём домене, собранные агентом.

Старт без терминала

  1. 19Технический фундамент веб-приложения для дизайнераЭта тема не учит писать код. Она учит словарю, без которого разговор с агентом в темах «Вайбкодинг: сайты» и «Вайбкодинг: интерфейсы» звучит как шум. …6 мин чтения + 30 мин на задание
  2. 20Дизайн-мышление до кода: разговорные UI-инструментыМежду «просто картинкой» из темы «Генерация изображений» и полноценным кликабельным прототипом из темы «Вайбкодинг: сайты» есть промежуточная ступень.…7 мин чтения + 40 мин на задание
  3. 21Вайбкодинг: сайты — лендинги и порталыВайбкодинг — это разработка через естественный язык. Ты описываешь словами, что должно получиться, а ИИ-агент сам пишет, правит и запускает код и пока…13 мин чтения + 2 часа на задание
  4. 22Библиотеки и ресурсы для вайбкодингаИИ-агент из тем «Вайбкодинг: сайты» и «Вайбкодинг: интерфейсы» пишет код быстро, но по умолчанию часто изобретает своё. Рисует иконку из примитивов вм…8 мин чтения + 30 мин на задание

Сборка продукта: терминал, данные, ИИ внутри

  1. 23CLI и терминальные ИИ-агентыМногие дизайнеры никогда не открывали терминал (командную строку) и воспринимают его как «территорию разработчиков». Это нормально. Но именно в термин…10 мин чтения + 45 мин на задание
  2. 24Терминальные агенты: настройка под себя — правила, скиллы, хуки, сабагентыТема «CLI и терминальные ИИ-агенты» заканчивается на том, что агент установлен и выполняет задачи. Эта тема — следующий слой: как перестать объяснять …9 мин чтения + 40 мин на задание
  3. 25Вайбкодинг: интерфейсы — веб-продукты и приложенияТема «Вайбкодинг: сайты» доводит прототип до живой ссылки. Но сайт и полноценный продукт различаются по устройству, а не по красоте. У продукта есть а…17 мин чтения + 2,5 часа на задание
  4. 26Вайбкодинг: арт и инструменты — генеративная графика и интерактивные конструкторыТема «Вайбкодинг: сайты» доставляет контент, тема «Вайбкодинг: интерфейсы» управляет данными и логикой. Но иногда результат вайбкодинга — сам интеракт…13 мин чтения + 2 часа на задание
  5. 27ИИ как функция внутри прототипаВсе темы про вайбкодинг до этого момента были про ИИ в руках у того, кто строит продукт. Агент пишет код, а готовый продукт может быть каким угодно, х…8 мин чтения + 1,5 часа на задание
  6. 28Боты и ИИ-ассистенты как продуктВсё, что было в темах «Вайбкодинг: сайты» и «Вайбкодинг: интерфейсы», собирает сайты и приложения: продукты, к которым пользователь сам приходит по ад…6 мин чтения + 30 мин на задание

Качество, безопасность и масштаб

  1. 29Чтение и отладка кода агентаАгент из тем «Вайбкодинг: сайты» и «Вайбкодинг: интерфейсы» пишет код быстро, но не безошибочно. Рано или поздно что-то ломается: страница не открывае…6 мин чтения + 30 мин на задание
  2. 30Рефакторинг и производительность вайбкодинг-проектаТема «Чтение и отладка кода агента» — про то, что делать, когда что-то откровенно сломалось. Эта тема про соседнюю ситуацию. Проект работает и выгляди…7 мин чтения + 40 мин на задание
  3. 31Дизайн-система в коде: из Figma, с нуля или готоваяАгент собирает интерфейс из того, что видит в репозитории. Если дизайн-системы там нет, он берёт её из памяти модели: те же отступы, те же градиенты и…11 мин чтения + 1 час на задание
  4. 32AI-first дизайн-системыДо сих пор дизайн-системы строились для человека. Разработчик открывает документацию, читает описание компонента, смотрит примеры в Storybook, копируе…12 мин чтения + 40 мин на задание
  5. 33Продакшн-процессы и передача результатовУдачная генерация — это ещё не результат. Результат — когда её можно повторить, отдать в продакшен и передать коллеге, не объясняя каждый раз заново «…11 мин чтения + 30 мин на задание
  6. 34Безопасность вайбкодинг-проектаАгент из тем «Вайбкодинг: сайты» и «Вайбкодинг: интерфейсы» доводит прототип до реального продукта быстрее, чем когда-либо. Но скорость сборки не озна…7 мин чтения + 40 мин на задание
  7. 35Автоматизация процессов с ИИТема «ИИ как функция внутри прототипа» — про то, как ИИ работает внутри продукта для его конечного пользователя. Эта тема про другую, часто более прак…7 мин чтения + 40 мин на задание
  8. 36Своя обвязка: harness, конвейеры и графы вокруг вайбкодингаЭто продвинутая тема. Если ты ещё не собрал ни одного проекта с терминальным агентом (тема «CLI и терминальные ИИ-агенты»), сначала сделай это. Всё, ч…14 мин чтения + 2,5 часа на задание