150+ промптов для продвинутого вайб-кодинга - страница 7
Ожидаемый результат: 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 для создания сайта с динамическим подключением данных о продуктах, фильтрами и страницей деталей товара.
Профессиональный промпт: «Создай интернет-магазин на JAMstack с использованием Next.js. Главная страница должна выводить каталог товаров, данные о которых загружаются через внешний REST API. Обеспечь функциональность фильтрации товаров по категориям и ценовому диапазону. Каждая карточка товара должна вести на отдельную страницу с детальной информацией, включая изображения, описание и кнопку «Купить». Дизайн должен быть адаптивным и современным, с плавными анимациями переходов между страницами.»
Ожидаемый результат: AI сгенерирует проект Next.js, включающий API-запросы для получения данных о товарах, шаблоны для генерации статических страниц каталога и деталей товара, а также стили CSS для создания адаптивного дизайна. Промпт позволяет запустить интернет-магазин, не требуя глубоких знаний JavaScript.