Headless cms

В эпоху глобальной цифровизации выигрывает тот, кто быстрее других осваивает новые каналы взаимодействия с аудиторией и предлагает своим клиентам более удобные цифровые решения.

Чтобы добиться успеха, бизнес открывает представительства в Сети, запускает мобильные приложения, позиционируется в социальных сетях, использует умные гаджеты и устройства интернета вещей. Важно как можно шире представить себя на рынке, используя все доступные способы. А еще необходимо быть гибким, быстро и легко мигрируя на новые платформы.

Традиционный подход заключается в том, что для каждой платформы разрабатывается собственная архитектура, готовится контент, настраивается интерфейс. Разработка и поддержка в такой схеме требуют значительных ресурсов. Это ограничивает возможности компаний в плане освоения цифровых каналов.

Новое поколение CMS решает проблему управления контентом с использованием различных платформ. Теперь содержимое создается, хранится и редактируется независимо от технических решений, используемых для его представления на клиентском оборудовании (браузере, смартфоне, умных часах).

Headless CMS тело без головы

Логика традиционных CMS объединяет бэкенд- и фронтенд-части одной системы. Контент в данном случае оказывается связан с конкретными технологиями, архитектурой и шаблонами клиент-серверного приложения.

Headless CMS принципиально иная система управления. Как правило, она отвечает только за универсальное содержимое, которое может использоваться на любых платформах. Бэкенд (тело) при таком подходе не связан с фронтендом (головой).

Логика Headless CMS такова, что к телу при необходимости можно приставлять разные головы. Это позволяет использовать один бэкенд для управления сайтом (или сайтами) и мобильным приложением, а также автоматизировать распространение контента по всем доступным площадкам и устройствам.

В результате минимизируются ресурсы, затрачиваемые на веб-разработку. А управление разными платформами осуществляется централизованно из одного интерфейса, что удобно. При этом содержимое гибко настраивается для каждого отдельного канала.

Как это работает

Как уже было сказано, Headless CMS предполагает управление только контентом независимо от интерфейса, в котором он будет использоваться (представляться конечному пользователю).

Система управления строится с нуля и используется, в первую очередь, как хранилище контента и набора инструментов. Она обеспечивает административный интерфейс для создателей контента, их совместной работы над содержимым. Если предусмотрена возможность оставлять комментарии, заявки, создавать пользовательские анкеты или задавать настройки аккаунтов, эти данные также могут храниться в системе, модерироваться и редактироваться персоналом.

Содержимое системы хранится в поддерживаемой ею базе данных (PostgreSQL, MongoDB, SQLite, MySQL и MariaDB в Strapi). Обмен данными чаще всего происходит в универсальном формате JSON, что позволяет подстраиваться под любой новый фронтенд. Передача осуществляется через внешний API: RESTful или GraphQL.

Клиентское приложение отвечает за взаимодействие с пользователем (дизайн, интерактивность, сбор данных). Для манипуляций с данными используется API.

Преимущества Headless CMS

Главная ценность подхода, реализованного в Headless CMS омниканальная готовность. Контент в универсальном формате можно использовать на сайте, в мобильном приложении, в интерфейсе различных цифровых устройств. Это расширяет возможности бизнеса, позволяет гибко использовать разные решения (интегрируя их по очереди или сразу задействовав все необходимые).

Снижение затрат на разработку второе важное преимущество. При определенных условиях Headless CMS дешевле в установке и настройке. Разработчикам не требуется осваивать систему управления от и до, достаточно разбираться в административном интерфейсе и API.

Ускорение реализации новых проектов тоже немаловажный плюс для бизнеса. Благодаря гибкости использования контента, в Headless CMS процесс запуска сайта или приложения занимает меньше времени. Кроме того, индустриальные стандарты RESTful и GraphQL обеспечивают быстрый старт при развертывании нового проекта: разработчикам не требуется закладывать архитектурные основы и осваивать тулинг вокруг этих технологий.

Для пользователей административной панели важноудобство работы в системе. Централизованное управление облегчает взаимодействие с разными платформами. Можно добавлять и редактировать контент, управлять настройками в одном привычном административном интерфейсе.

Для бизнеса, оперативно реагирующего на изменения, большое значение имеетпростая масштабируемостьсистемы управления контентом. Статически сгенерированный контент от CMS легко поддается масштабированию через CDN.

Содержимое легко переносится в новые интерфейсы. Например, для реализации приложения для iOS, при наличии web- и Android-версий, не требуется создавать новый бэкенд к существующей схеме просто добавляется еще одно клиентское приложение.

При этом разработчики на любом языке программирования (Ruby, PHP, Java, Swift) могут использовать API при манипуляциях с системой, решая таким образом проблему несовместимости разных языков в одном продукте. Это дает возможность задействовать новейшие технологии и креативно подходить к процессу разработки.

Для Headless CMS характернаповышенная безопасность. Поскольку с пользовательской стороны доступны только статически сгенерированные файлы, а обработка запросов значительно упрощена, сломать этот процесс сложнее и риски атак сокращаются.

Есть ли недостатки у Headless CMS?

Переход к логике Headless CMS предполагает знакомство с ее принципами и технологиями, однако разработчику достаточно иметь базовый уровень знаний сетевых технологий.

Конечно, требуется определенный опыт, чтобы оптимизировать готовый бэкенд для одновременного подключения разных платформ. Зато не нужно каждый раз выстраивать API, а это плюс.

Headless CMS обеспечивает только бэкенд, поэтому фронтенд-архитектуру необходимо реализовывать с помощью дополнительных ресурсов. Но существуют продукты вроде Gatsby, Nuxt, VuePress, Hugo и Gridsome, которые обеспечивают упрощенную интеграцию с CMS.

Виды Headless CMS

Существует множество CMS, поддерживающих логику Jamstack. Суть подхода заключается в предварительном рендеринге файлов и их передаче непосредственно с CDN, минуя веб-сервер.

Все такие CMS представлены на сайте headlesscms.org. Большинство из них являются open source решениями.

Headless CMS могут предполагать самостоятельное развертывание на сервере или выгрузку на CDN-сервис.
Некоторые системы работают через клауд-провайдеров.
Многие поддерживают создание модели и последующее заполнение ее контентом.
Еще один критерий выбора: использование GraphQL или REST API (или оба вида в одном продукте).

Почему будущее за Headless CMS

Новаторский подход, реализованный в Headless CMS, учитывает реалии сегодняшнего дня, когда время диктует как можно более быстрое внедрение новых технологий и расширение цифровых каналов взаимодействия с аудиторией. Принцип разделения собственно контентной части и клиентского интерфейса позволяет ускорять разработку и масштабироваться с экономией ресурсов. А управление разными платформами становится более удобным и эффективным.

С дальнейшим развитием цифровых продуктов Headless CMS, вероятно, будут все более предпочтительны, нежели традиционные WordPress или Joomla. Есть все основания полагать, что будущее именно за безголовыми системами.

Существует большое количество (всего порядка 50) Headless CMS. Это системы управления, в которых реализован новый принцип разделения двух слоев данных и представления (логика Jamstack).

Headless CMS отвечают только за бэкенд-часть (данные), и могут взаимодействовать с любыми платформами представления (сайтами, приложениями). Благодаря этому одну систему можно использовать для разных пользовательских интерфейсов.

Какие бывают Headless CMS

Все системы управления, работающие по логике Jamstack, представлены на сайте headlesscms.org. Они разделены, прежде всего, на открытые и закрытые open source и closed source решения.

По способу развертывания, разные HCMS предполагают установку локально или через облачные сервисы.

По способу передачи данных, системы могут поддерживать REST API, GraphQL или оба синтаксиса.

Headless CMS предполагают создание контентной сущности на основе моделей, которые могут создавать разработчики. Практически во всех случаях процесс создания возможен через пользовательский интерфейс.

Многие HCMS поддерживают управление проектами, изображениями, файлами, данными и доступами пользователей.

Почему Strapi

В списке Headless CMS с открытым исходным кодом Strapi недаром занимает первое место. Это решение пользуется большой популярностью и имеет свыше 28 тысяч звезд на GitHub.

Система предназначается для профессиональных разработчиков. Однако для работы с ней не требуется слишком глубоких и разносторонних познаний в области программирования. В этом главная ценность Strapi она позволяет максимально быстро и с минимальными ресурсами создавать API для работы с данными.

Основные особенности

Strapi представляет собой фреймворк для управления контентом, работающий на Node.js. Это open source-проект, полностью бесплатный. Система разворачивается локально на собственном сервере компании, что обеспечивает безопасность данных.

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

Главные особенности и преимущества Strapi:

• Открытый исходный код.Система разработана энтузиастами и поддерживается сотнями участников GitHub, которые развивают ее в соответствии с новыми требованиями и технологиями. Она всегда будет доступна и бесплатна.
• Широкие и гибкие настройки.Панель администратора, как и API, легко настраивается. Функционал расширяется за счет пользовательских плагинов в считанные секунды.
• RESTful или GraphQL.CMS поддерживает передачу данных посредством и REST, и GraphQL. Это расширяет возможности взаимодействия с разными клиентами, мобильными приложения, IoT-устройствами.
• Локальное размещение.Размещение на собственном сервере владельца системы гарантирует конфиденциальность и обеспечивает повышенный уровень защиты данных (в том числе в соответствии с европейским стандартом GDPR).
• Один язык.Система использует JavaScript, что позволяет работать с одним языком как в CMS, так и во фронтенде.
• Настройки доступа.В системе реализован контроль доступа с учетом разных уровней и ролей пользователей (администраторов).

Применение Strapi

Система имеет множество вариантов применения. Она может использоваться для статических сайтов, мобильных приложений, корпоративных ресурсов, электронной коммерции.

На Strapi создаются ультра-быстрые современные сайты и мобильные приложения. Повышенная производительность достигается при использовании Headless CMS в связке со статическим генератором сайтов и обслуживании через CDN.

Релевантные части контента загружаются в тот момент, когда пользователь делает запрос. Повторная загрузка содержимого осуществляется только после его обновления. Благодаря этому сайт доступен по всему миру без ожидания на стороне сервера.

Strapi поддерживает любые статические генераторы сайтов и различные фреймворки для создания пользовательских интерфейсов. Самые популярные из них: Gatsby, React, Vue.js, Nuxt.js, Next.js, Angular.

Как использовать Strapi

Чтобы разработать API с помощью Strapi, предпочтительнее использовать PostgreSQL, MongoDB, MySQL или MariaDB. Установка происходит с использованием npm.

Дальнейшая последовательность действий:

• Создается директория для нового проекта.
• Внутри директории выполняется команда для создания нового API.
• Запускается сервер на Node.js.
• Регистрируется первый пользователь.
• Создается тип контента (Content Type структуры данных в Strapi, эквивалент моделей).
• Добавляются материалы в базу данных.
• Настраиваются роли пользователей (администраторов, редакторов).

После этого можно взаимодействовать со Strapi через любимый API-протокол для генерации статического контента и/или использовать API-вызовы на регулярной основе, как и к любому бэкенду.

Далее выводится контент, настраивается отображение содержимого, создается страница автора. Впоследствии можно добавить категории материалов, возможность комментирования.

Алгоритм подходит для создания блогов, бизнес-сайтов, интернет-магазинов.

Обслуживание моделей через UI

Еще одна важная особенность Strapi возможность обслуживания моделей данных через пользовательский интерфейс.

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

В Strapi также можно действовать через программную среду, описывая модели данных. Но можно использовать и административный интерфейс, добавляя и редактируя необходимые поля базы данных на лету, сразу в продакшн-системе.

Например, вот как удобно можно указать связь двух моделей в базе данных с помощью UI:

Здесь же задаются все привычные настройки для модели: фильтрация значений по регулярному выражению, обязательность необходимых полей, проверка уникальности, длина заполняемого поля и т.д.

Почему мы считаем, что Strapi лучше других Headless CMS

Мы используем бесплатную стабильную версию Strapi, которая позволяет создавать супер-быстрые статические сайты и экономит время разработки.

Система имеет удобную административную панель, легко масштабируется с помощью плагинов. Для работы с ней не требуются углубленные знания в веб-разработке.

Управление контентом осуществляется централизованно. А поскольку все технические решения скрыты на стороне сервера, система менее уязвима для атак.