Към съдържанието
PN Scripts

Отворен код

Headless CMS или традиционна CMS: каква е разликата и кога коя да изберете

  • PN Scripts Team
  • 6 мин четене

Традиционната CMS съхранява съдържанието и същевременно изгражда публичните страници, всичко в едно приложение. Headless CMS само съхранява и управлява съдържанието и го предоставя чрез API, а отделен потребителски интерфейс, уебсайт, мобилно приложение или и двете, решава как да изглежда. Изберете традиционна CMS, когато имате един сайт и искате редакторите да публикуват с възможно най-малко движещи се части. Изберете headless, когато едно и също съдържание захранва няколко канала или когато екипът ви за потребителски интерфейс има нужда от пълен контрол върху уеб приложение по поръчка.

#Какво означава headless на практика

В традиционна CMS като WordPress, Drupal или CMS на Laravel една кодова база върши три неща: пази съдържанието в база данни, дава на редакторите административен панел и генерира HTML, който виждат посетителите. Темите и шаблоните живеят в същото приложение.

Headless CMS премахва последното. „Главата“ е слоят за представяне. Остават хранилището за съдържание, административният панел и API, обикновено REST или GraphQL. Публичният сайт е отделно приложение, често на JavaScript фреймуърк, което взема съдържанието от API-то и го показва. Мобилно приложение може да ползва същото API.

Много традиционни CMS също могат да предоставят API, а много headless решения имат режим за преглед на чернови. Разликата е в това къде се изграждат публичните страници и кой отговаря за този код.

#Предимства и недостатъци един до друг

Традиционна CMSHeadless CMS
Приложения за поддръжкаЕдноПоне две: API за съдържание и потребителски интерфейс
Публични странициГенерира ги CMS-ът чрез шаблониГенерира ги отделно приложение
Преглед преди публикуванеВграденТрябва да се изгради или настрои
Няколко канала (сайт, приложение, киоск)Възможно, но по-неудобноОсновната причина да го изберете
Свобода при интерфейсаОграничена от системата за темиВсеки фреймуърк, който екипът предпочита
Разширения за стандартни функцииОбикновено многоЧесто се пишат от вашия екип
Нужни уменияЕдна технологияСървърна част, интерфейс и договорът между тях

Какво печелите с headless

  • Един източник на съдържание за няколко канала. Описание на продукт или новина се пише веднъж и се показва на сайта, в мобилното приложение и навсякъде другаде, където се чете API-то.
  • Свободен избор на интерфейс. Уеб екипът може да работи с React, Vue или друг фреймуърк, без да се съобразява със система за теми.
  • Ясно разделение. API-то и интерфейсът се внедряват и мащабират поотделно, а промяна в дизайна не засяга хранилището за съдържание.

Какво ви струва headless

  • Повече за изграждане и поддръжка. Две приложения означават две внедрявания, два комплекта зависимости и API договор, който и двете страни трябва да спазват.
  • Преглед и удобство за редакторите. В традиционна CMS редакторът вижда страницата така, както ще изглежда. При headless прегледът на чернова в истинския интерфейс изисква допълнителна работа.
  • SEO се премества в интерфейса. Търсачките искат коректен HTML, заглавия, метаданни и карти на сайта. При headless ги генерира интерфейсът, обикновено чрез изобразяване на сървъра или статично генериране.
  • По-малко готови функции. Форми, менюта, пренасочвания и търсене, които традиционната CMS получава от разширение, често трябва да се напишат и от двете страни.

#Кога традиционната CMS е по-подходяща

  • Имате един сайт или блог и редакторите трябва да пишат, планират и публикуват без разработчик.
  • Екипът е малък и познава добре една технология. Едно приложение се хоства, архивира и обновява по-лесно.
  • Искате работещ сайт бързо и структурата на темите или шаблоните ви е достатъчна.
  • Съдържанието е основно страници и статии, които се показват само на този сайт.

Ако по-късно сайтът трябва да захранва и приложение, много традиционни CMS могат да добавят API до публичните страници. Не е нужно да решавате всичко от първия ден.

#Кога headless е по-подходящ

  • Едно и също съдържание се показва на сайт и в мобилно приложение или на няколко сайта.
  • Публичната част всъщност е уеб приложение с потребителски профили, табла и интерактивни инструменти, а съдържанието е само част от него.
  • Имате разработчици на потребителски интерфейс, които искат пълен контрол върху скоростта, дизайна и маршрутите.
  • Няколко екипа работят по различни части и документираното API им дава стабилна граница.

Преди да изберете headless, решете кой ще направи прегледа на чернови, картите на сайта, пренасочванията и метаданните и кой ще поддържа API-то документирано и с версии. Ако никой не отговаря за това, сайтът ще се поддържа по-трудно от традиционен. Важен е и езикът зад API-то; тук помага сравнението Laravel или Go за API.

#Два примера с отворен код: PN Press и NextPressKit

PN Scripts публикува в GitHub два проекта под лиценз MIT, които показват двата подхода. И двата са изходен код, който хоствате сами; PN Scripts не ги предлага като хоствана услуга.

PN Press е традиционна CMS за блог и фирмени новини. Работи на Laravel 13 с административен панел на Filament 5 на адрес /admin, където редакторите управляват публикации и категории на един екран: заглавие, URL slug, резюме, текст, статус, дата на публикуване и основно изображение. Достъпът е ограничен до ролите администратор и редактор чрез Spatie Permission. Същото приложение изгражда на сървъра публичния списък с публикации, страниците на статиите и архивите по категории като Blade страници с Tailwind CSS, а черновите никога не се показват публично. PN Press обслужва един сайт и съзнателно няма коментари, етикети, медийна библиотека извън основното изображение и multi-tenancy. Ако се колебаете между админ панел на Filament и написан от нулата, вижте статията Filament или собствен административен панел.

NextPressKit следва разделения подход. Състои се от две хранилища: уеб интерфейс на TanStack Start, React, TypeScript, Tailwind CSS и Shadcn UI и API на Go, Gin и PostgreSQL. API-то поддържа вход с JWT чрез HttpOnly бисквитки или Bearer токени, роли и права, публикации, страници, категории, етикети и качване на медийни файлове. Документирано е в OpenAPI, има Postman колекции за тестване, а модулите се включват и изключват от конфигурацията. Това е отправна точка за уеб приложение, в което съдържанието е част от продукта, например SaaS MVP или вътрешен инструмент с вход, права и управление на съдържание.

Двата проекта отразяват избора, описан в тази статия. PN Press е по-простият път, когато целта е сайт с блог. NextPressKit е за продукт, в който документираното API и отделният интерфейс оправдават допълнителните движещи се части.

#Как може да помогне PN Scripts

PN Scripts изгражда платформи за съдържание и в двата стила и може да адаптира всеки от двата проекта с отворен код към вашите нужди. В писмения обхват преди началото на работа е обяснено кой подход отговаря на вашето съдържание и канали. Подробностите и пълния набор технологии ще намерите на страницата на NextPressKit.

Още по темата

Още по темата

Коментари

Коментари

Напишете първия коментар.

Оставете коментар

Следваща стъпка

pnscripts.com/bg/contact

Пишете на екипа

Попитайте за статия или ни разкажете за проект, който искате да изградим. Отговаряме до един работен ден.

Пишете ни

Семейството PN Scripts

Другите сайтове на PN Scripts

Хостингът, игрите и блогът имат свои сайтове, поддържани от същата компания.

  • pnscripts.com

    PN Scripts

    Софтуерно инженерство

    Разработка на уеб и мобилни приложения, API и игри по поръчка, плюс нашите open-source продукти и плъгини.

  • games.pnscripts.com

    Игри

    Игри и игрови сървъри

    Мястото за игрите и игровите сървъри на PN Scripts. Каталогът засега е празен и ще се попълва, когато игрите и сървърите стартират.

  • hosting.pnscripts.com

    Хостинг

    Хостинг и инфраструктура

    Споделен хостинг, KVM VPS, dedicated сървъри и домейни от същата компания, която изработва проекта ви.

  • blog.pnscripts.com

    Блог

    Статии и бележки

    Ясни статии за хостинг, сървъри, домейни и сигурност, писани от хората, които работят с тях.

    Вие сте тук