NC
Все примеры
Обложка статьи «Сайт-визитка за вечер: Next.js + деплой на VPS» — пример автоматизации с ИИ, категория «Сайты», NeiroCursor
Сайты

Сайт-визитка за вечер: Next.js + деплой на VPS

Обновлено: Mon Jul 06 2026 00:00:00 GMT+0000 (Coordinated Universal Time)

Как с помощью Cursor собрать лендинг на Next.js с SEO, формой заявки и деплоем на VPS через Docker за один вечер.

Цель проекта

Схема
Схема сборки лендинга за вечер
Идея → Next.js → SEO → Docker → VPS.

Одностраничный или многостраничный лендинг для услуг/продукта: hero, преимущества, FAQ, форма связи, SEO-метаданные и деплой на VPS.

Инструкция
Пошаговая инструкция по теме статьи
Пошаговый план действий — следуйте пунктам по порядку.

Шаг 1. Структура страниц

Попросите агента в Cursor:


Создай Next.js App Router лендинг: главная, about, контакты.

Server Components, metadata для SEO, один H1 на страницу, русский UI.

Рекомендуемая структура:


src/app/

  page.tsx          — главная

  about/page.tsx

  layout.tsx        — metadata, шрифты

  sitemap.ts

public/

  images/

Шаг 2. Контент и SEO

Сравнение
SSG vs SSR для визитки
Для визитки чаще достаточно SSG и metadata.

| Элемент | Рекомендация |

|---------|--------------|

| Title | 50–60 символов, ключевое слово |

| Description | 150–160 символов |

| H1 | один на страницу |

| Open Graph | title, description, image 1200×630 |

Добавьте generateMetadata или статический metadata в каждый route.

Шаг 3. Форма и аналитика

  • Форма: Server Action или API route + валидация (без PII в логах).

  • Яндекс.Метрика / GA — через env NEXT_PUBLIC_*.

  • Rate limit на публичную форму.

Шаг 4. Docker и деплой


docker compose -f docker-compose.prod.yml up -d --build

Подробный гайд: Деплой на VPS Beget.

Шаг 5. Проверка перед запуском

Советы
Чеклист перед публикацией лендинга
Lighthouse, HTTPS, sitemap.
  • Lighthouse: performance, SEO, accessibility

  • Мобильная вёрстка

  • HTTPS и canonical URL

  • robots.txt и sitemap.xml

Связанные материалы

Ключевые выводы

Лендинг за вечер реален с Cursor: структура → Next.js + SEO → Docker → VPS. Агент ускоряет вёрстку и metadata, но тексты и юридические блоки проверяйте вручную.

FAQ

Нужен ли CMS для визитки?

Для 3–5 статичных страниц достаточно MDX или hardcoded контента в Next.js.

Как не испортить SEO?

Один H1, уникальные title/description, canonical, sitemap и осмысленные alt у изображений.

Cursor заменяет дизайнера?

Нет, но ускоряет вёрстку по описанию и референсам. Финальный UX и бренд — ваша зона ответственности.