Услуга

Headless CMS: контент через API, скорость — в статике

Next.js + Payload, Sanity или Strapi. JAMstack-подход: редактор редактирует контент, а сайт раздаёт статические страницы с edge-узлов. Когда это оправдано — и когда честно скажем, что оверкилл.

Чесна рамка

Headless CMS — правильный выбор для одних задач и оверкилл для других

Когда headless CMS — правильный выбор

  • Контент один, а «витрин» много: сайт, мобильное приложение, экран в зале, email-шаблон. API-first CMS раздаёт один и тот же контент всем каналам одновременно.
  • Нужна максимальная скорость: статические страницы на CDN, LCP < 1.0s, Lighthouse 95+. Для SEO-важных сайтов с большим трафиком — ощутимая разница.
  • Команда техническая и хочет полный контроль над стеком: TypeScript end-to-end, CI/CD, структуры данных, которые вы проектируете под себя.
  • Сложный контент со связями: продукты → категории → авторы → теги — реляционная модель, спроектированная под ваш контент.
  • Безопасность: админка на отдельном домене или за авторизацией, фронтенд — только статика, поверхность атаки минимальна.

Когда headless — оверкилл

  • Небольшой корпоративный сайт, где контент обновляет один человек раз в неделю — WordPress или Tilda быстрее в запуске и дешевле в поддержке.
  • Бюджет сжатый, сроки короткие: headless требует больше времени на архитектуру и больше технических компетенций.
  • Нет технической команды для поддержки: Payload и Next.js — это не «установил и забыл», нужен разработчик для обновлений и расширений.
  • Простой лендинг или сайт-визитка — на простом стеке даст тот же результат дешевле. Если ваш проект на грани — скажем на звонке, не продаём более сложный стек там, где он лишний.

Что входит в headless-проект

  • Архитектура Payload-коллекций под контентную модель клиента. TypeScript-типы — с первого дня.
  • Next.js фронтенд: SSG / ISR / SSR в зависимости от типа страницы. Edge-деплой: Vercel или Cloudflare.
  • Локализация uk + ru на уровне Payload (поле localized: true где нужно).
  • SEO-слой: meta, canonical, hreflang, og:image, schema.org — автоматически из коллекций. Sitemap и robots.txt генерируются при публикации.
  • Core Web Vitals: LCP < 1.5s, CLS < 0.05, INP < 150ms — измеряем перед релизом.
  • Миграция контента со старого сайта или WordPress (если нужно).
  • Админка Payload: вкладки, live preview, drafts, slug auto-generation — нетехнический редактор сможет без разработчика.
  • Документация для поддержки: Payload коллекции, хуки, деплой-процедура.
Наш headless-стек
  • Next.js 15
  • Payload CMS 3
  • Sanity
  • Strapi
  • TypeScript
  • Tailwind CSS
  • GSAP
  • PostgreSQL
  • Vercel
  • Cloudflare

Кейсы

Этот сайт — на Next.js + Payload. Вот ещё проекты на headless-стеке

Как мы работаем

Сначала архитектура, потом код — так мы строим headless-сайт

  1. Архитектурный звонок

    30 минут: разбираем задачу, решаем, headless ли тут правильный выбор. Если нет — говорим сразу и предлагаем более простой стек. На выходе: решение по стеку + ориентировочная вилка.

  2. Контентная архитектура

    Схема Payload-коллекций, связи между сущностями, поля локализации. TypeScript-типы — с первого дня. На выходе: ER-диаграмма + Payload schema draft + согласованная структура админки.

  3. Дизайн и фронтенд

    Макеты в Figma → Next.js компоненты → Storybook (опционально). Деплой на staging после каждого спринта. На выходе: финальные макеты + design system + фикс-прайс.

  4. Интеграции и контент

    Подключаем API (оплата, CRM, аналитика), мигрируем или наполняем контент через Payload admin. На выходе: полностью наполненный сайт на staging + все интеграции.

  5. Performance и запуск

    Lighthouse CI, проверка Core Web Vitals, edge-конфиг. Редиректы со старого сайта, GSC, аналитика. На выходе: живой сайт + Lighthouse ≥ 90 Mobile + документация + 30 дней поддержки.

Частые вопросы

Headless — вопросы об архитектуре и бюджете

Поговорим

За 30 минут с разработчиком выясните, оправдан ли headless

  • 30 минутОнлайн-встреча 1:1
  • Удобный форматВидео или звонок
  • Фокус на решенииПрактичные ответы
Где удобнее связаться?

Ваши данные защищены и не передаются третьим лицам.

Подробнее

Headless CMS и JAMstack на Next.js, Payload, Sanity или Strapi — когда это правильный выбор

Headless CMS — подход, где бэкенд (хранилище контента и API) отделён от фронтенда (того, что видит пользователь). Контент редактируется в админке, раздаётся через API, фронтенд на Next.js строит статические или динамические страницы. Отсюда два преимущества: скорость статики и то, что один и тот же контент раздаётся на сайт, мобильное приложение, экран в шоуруме.

Мы перешли на headless-стек для собственной разработки не потому что «это тренд», а потому что задачи так требовали. Этот сайт — apri-code.com — Next.js 15 + Payload CMS 3 + PostgreSQL. Скорость держим в рамках жёсткого перформанс-бюджета и меряем перед каждым релизом. Контент редактируется в Payload admin без единого HTML. Локализация uk + ru встроена на уровне полей. Это наш собственный production-стек.

Payload CMS — наш основной выбор для кастомных headless-проектов. Open-source, Node.js + TypeScript, встроенный в Next.js. По сравнению с Sanity — нет hosted lock-in и ежемесячных SaaS-платежей за контент-элементы. По сравнению со Strapi — типизация сквозная от схемы до фронтенда. Для проектов, где важен hosted real-time collaborative editor, Sanity — тоже правильный выбор. Для проектов со сложными ролями и несколькими командами — Strapi. Используем все три — в зависимости от задачи клиента.

JAMstack в 2026 — это не про статические сайты-визитки. Это про веб-приложения со сложной логикой, где публичные страницы отдаются как статика, а авторизованные зоны — как SSR или RSC. Headless CMS естественно вписывается в эту архитектуру: интернет-магазин со статическими страницами товаров и динамической корзиной, образовательная платформа со статическими материалами курса и динамическим личным кабинетом. Разработка веб-приложений →

Отдельно о SEO. Статические страницы на CDN стабильно держат LCP < 1.5s, а скорость — один из сигналов, которые Google учитывает в ранжировании. Для коммерческих страниц это преимущество, а не деталь. Наш SEO-слой встроен в стек: meta, canonical, hreflang, og:image, schema.org генерируются из Payload-коллекций автоматически при публикации.

Headless оправдывается не всегда. Маленький корпоративный сайт до 20 страниц — WordPress или более простой стек даст тот же результат дешевле и быстрее в запуске. Сжатый бюджет и сроки — headless требует больше архитектурного времени. Команда без технического разработчика для поддержки — Payload и Next.js это не «установил и забыл». Где headless не нужен — честно скажем и предложим другой стек. Поговорим о вашей задаче — за 30 минут станет понятно, headless ли тут правильный выбор. WordPress — когда проще →