Ожидаемый результат: AI сгенерирует шаблоны Next.js, скрипты для парсинга Markdown и маршрутизации, а также стили CSS для создания адаптивного блога, что позволит начинающему вайб-кодеру запустить блог без знания JavaScript.

Портфолио с динамическим подключением API

Описание задачи: Создать сайт-портфолио, который динамически получает данные о проектах через REST API. Сайт должен быть построен с использованием Gatsby, а дизайн – современным и интерактивным.

Профессиональный промпт: «Разработай сайт-портфолио на JAMstack с использованием Gatsby. Сайт должен загружать информацию о проектах через внешний REST API (например, список работ с описаниями, изображениями и ссылками) и генерировать страницы для каждого проекта. Главная страница должна содержать краткий список проектов с фильтрами по типу работ. Обеспечь адаптивный дизайн с современными анимациями при наведении и плавными переходами между разделами.»

Ожидаемый результат: AI создаст конфигурацию Gatsby для интеграции с API, шаблоны страниц для портфолио, а также стили и скрипты для фильтрации и анимаций. Это позволит даже новичку получить готовый сайт-портфолио без необходимости изучения сложного кода.

Лендинг для маркетинговой кампании с интеграцией форм

Описание задачи: Создать одностраничный лендинг для продвижения нового продукта. Лендинг должен генерироваться статически, содержать информацию о продукте, видео-презентацию и форму обратной связи, интегрированную с внешним сервисом (например, Formspree).

Профессиональный промпт: «Сгенерируй одностраничный лендинг на JAMstack с использованием Next.js. Страница должна содержать яркий баннер с названием и описанием продукта, секцию с видео-презентацией и блок с преимуществами. В нижней части размести форму обратной связи, которая отправляет данные через API внешнего сервиса (например, Formspree). Дизайн лендинга должен быть современным, с использованием анимаций при прокрутке и адаптивной версткой для мобильных устройств.»

Ожидаемый результат: AI создаст статический сайт на Next.js с шаблонами для лендинга, интеграцией формы обратной связи через внешний API и современными стилями CSS. Промпт позволит запустить лендинг без глубоких технических знаний.

Документационный сайт с поисковой функциональностью

Описание задачи: Создать документационный сайт, где пользователи могут быстро найти нужную информацию. Сайт должен генерироваться статически (например, с помощью Gatsby), а поиск реализовываться через интеграцию с API поискового движка (например, Algolia).

Профессиональный промпт: «Разработай документационный сайт на JAMstack с использованием Gatsby. Сайт должен генерировать страницы для разделов документации из Markdown-файлов. Добавь поисковый модуль, интегрированный с Algolia API, чтобы пользователи могли быстро находить нужные статьи. Дизайн должен быть минималистичным и удобным для чтения, с чёткой иерархией заголовков и адаптивной версткой для мобильных устройств.»

Ожидаемый результат: AI сгенерирует конфигурацию Gatsby для статической генерации страниц из Markdown, шаблоны для документации и интеграцию с Algolia для поиска. Это позволит начинающему вайб-кодеру создать удобный документационный сайт без написания сложного кода.

Интернет-магазин с поддержкой динамической каталогизации

Описание задачи: Создать простой интернет-магазин, где информация о товарах загружается через внешний API, а страницы генерируются статически для быстродействия. Использовать Next.js для создания сайта с динамическим подключением данных о продуктах, фильтрами и страницей деталей товара.