HEADLESS CMS – LISTA POPULARNYCH TECHNOLOGII

By 28 marca 20207 listopada, 2020Web Development

Czym jest headless CMS?

Headless Content Management System (“Bezgłowy” System Zarządzania Treścią) to technologia tworzenia aplikacji internetowych skierowana do programistów front-end. Headless CMS może działać w oparciu o interfejs API lub aktualizacje w Git.

Wykorzystanie tego rozwiązania daje mnóstwo korzyści, a także pozwala tworzyć dużo nowocześniejsze, szybsze i bardziej zaawansowane aplikacje, niż w przypadku standardowych CMS takich jak: WordPress, Joomla, Drupal itp. Dodatkowo witryny z użyciem Headless CMS są łatwo skalowalne i bardzo bezpieczne ze względu na oddzielnie warstwy front-end i back-end.

Szczególną uwagę warto zwrócić na wykorzystanie Headless CMS w projektach JAM Stack.

Headless CMS, Headless Content Management System (“Bezgłowy” System Zarządzania Treścią)

Sprawdź listę 10 technologii headless CMS, które są obecnie używane przez największe społeczności programistów.

Oczywiście nie są to wszystkie dostępne na rynku rozwiązania, a rozwój tej technologii jest bardzo dynamiczny. Nieustannie pojawiają się nowi usługodawcy oferujący Headless CMSy w modelu Saas lub open source wspieranych przez wielotysięczne społeczności programistów.
Netlify

1. Netlify CMS

Netlify to CMS do generatorów stron statycznych dostępny na licencji open source. Dzięki wykorzystaniu Netlify nawet osoby "nietechniczne" mogą tworzyć szybsze i bardziej elastyczne witryny, o dużo większym potencjale skalowalności. Zawartość projektu zbudowanego przy użyciu Netlify headless CMS jest przechowywana w repozytorium Git razem z kodem. Umożliwia to łatwiejszą kontrolę nad wersjami i programowanie przez kilka osób jednego projektu.

Używając React.js możemy rozbudować Netlify CMS i budować customowe komponenty dla aplikacji typu single-page, a także wykorzystywać możliwości złożonych interfejsów API.

2. Strapi

Strapi to wicelider jeżeli chodzi gwiazdki wśród headless CMSów na GitHubie. Bezpłatna technologia open source. Projekt przy użyciu Strapi jest kodowany w całości w JavaScript i łatwy do skonfigurowania w popularnych frameworkach React, Vue, Angular.

Wykorzystując Strapi sam decydujesz czy wybierasz relacyjną czy nierelacyjną bazę danych. Pliki możesz udostępniać przez zewnętrznych dostawców np.: AWS S3, Cloudfare, Cloudinary i inne lub bezpośrednio na wskazanym serwerze.

Czy mówiąc Ci coś zwroty React, Gatsby, Nuxt? Jeżeli tak, to na pewno headless CMS Strapi Ci się spodoba. Dodając do tego systemy płatności typu Stripe, możesz tworzyć bardzo szybkie i skalowalne projekty ecommerce. Jednocześnie część rozwiązań pomoże Ci zaoszczędzić wielu godzin pisania kodu. Po to między innymi powstają wszystkie headless CMSy.

3. Sanity

Nasz działający rynkowo projekt oparty o Sanity headless CMS znajduje się po linkiem: realpolandtours.com. Przez system zarządzania treścią generowane są w nim kluczowe komponenty strony dotyczące np.: oferty, cennika i terminów wycieczek.

Sanity to na pewno spora oszczędność kosztów utrzymania aplikacji. W przypadku przesiadki z WordPress na Sanity i React różnica w działaniu aplikacji na wielu polach jest bardzo istotna. Głównie szybkość ładowania jest nieporównywalna.

Sanity.io i większość technologii opartych o headless to także zmiana w procesie developmentu aplikacji. Zmieniając standardowy CMS na Sanity lub inny "bezgłowy" CMS musisz mieć świadomość, że jeżeli jesteś osobą nietechniczną to prawdopodobnie zawsze będziesz potrzebował programisty do serwisowania i rozbudowy projektu.

4. Jekyll Admin

Jekyll to popularny generator stron statycznych, którego możesz używać z wieloma headlessami. Jekyll Admin to dedykowana do tej funkcjonalności wtyczka, generująca interfejs graficzny w stylu CMS.

Projekt stworzony przy użyciu Jeckyll Admin podzielony jest na dwie warstwy: zbudowane przy użyciu języka Ruby HTTP API obsługujące operacje w Jeckyll, drugą częścią jest powstały w oparciu o to API front-end w Java Script.

Wtyczka Jekyll Admin na pewno przypadnie do gustu developerom korzystającym z generatora stron statycznych w tej technologii. Społeczność wspierająca plugin na GitHub jest coraz większa, co zapewnia stałe raportowanie błędów i rozwój o kolejne funkcjonalności.

5. Contentful

Contentful to headless CMS współpracujący ze wszystkimi generatorami stron statycznych. Oprogramowanie jest płatne w pełnej wersji. Twórcy oferują rozbudowane demo, które umożliwia sprawdzenie możliwości całego "kombajnu" do zarządzania treścią, jakim niewątpliwie jest Contentful. Ceny licencji kształtują się od $39/msc w wersji dla programistów, po prawie $900/msc w wersji dla firm i dużych zespołów developerów.

Niewątpliwie największą zaletą Contentful headless CMS jest zintegrowanie wielu narzędzi publikowania treści w jednym miejscu. Użycie Contentful skraca nie tylko procesy programowania w przedsiębiorstwie. To co kiedyś zajmowało dni i wymagało pracy zespołu progamistów, po wdrożeniu tego headlessa może zajmować kilka minut i być dostępne w kilku kliknięciach.

W kategorii narzędzi headless CMS w modelu Sass, które przyspieszają tworzenie elastycznych i skalowalnych rozwiązań Contentful jest w tym momencie rynkowym liderem. Ten "bezgłowy" CMS wykorzystują w swoich projektach między innym PayPal czy Nike, a twórcy chwalą się statystykami pokazującymi 5-cio krotnym przyspieszeniem czy 60% wzrostem konwersji w aplikacjach z wykorzystanie Contentful.

6. Ghost

Ghost headless CMS zajmuje pierwsze miejsce na rynku, jeżeli chodzi o wielkość GitHubowej społeczności developerów wspierających rozwój tej technologii. Ponad 30 tysięcy gwiazdek i kilka tysięcy nowo powstałych witryn tygodniowo wspieranych przez Ghost - te statystyki robią wrażenie i potwierdzają przydatność technologi. Wśród użytkowników Ghosta znajdziemy biznesy NASA, Apple czy dynamicznie rozwijający się biznes wyszukiwarki DuckDuckGo.

Najpopularniejszy na świecie headless Node.js CMS działa w modelu open source, a liczba dostępnych na wyciągnięcie ręki konfiguracji z zewnętrznymi platformami jest ogromna. Znajdziesz tu zarówno najpopularniejsze generatory stron statycznych, jak i rozbudowane silniki do Marketing Automation. Ghost headless możesz używać z domyślnym panelem administracyjnym i front-endem lub zamienić go na własny JAM Stack.

W 2019 roku liczba instalacji Ghosta przekroczyła 2 miliony, ten wynik udało się osiągnąć w 6 lat. Zmieniając tradycyjne CMS na headless Ghost różnica w wydajności aplikacji będzie kolosalna. W przypadku zmiany z WordPress witryna będzie nawet kilkanaście razy szybsza, nie wspominając o bezpieczeństwie i skalowalności. Zajrzyj po szczegóły kilkając w linki poniżej, może już wkrótce i Ty będziesz zarządzał treścią z użyciem headless CMS Ghost?

Keystone 5 headless cms

7. Keystone 5

Keystone5 to najnowsza odsłona KeystoneJS, czyli skalowalnej i elastycznej platformy open source do tworzenia aplikacji z wykorzystaniem NodeJS. Twórcy Keystone 5 headless CMS kładą nacisk na możliwie największą elastyczność architektury opartej o API GraphQL, a nie tworzenie kolejnych projektów przy użyciu gotowych szablonów. Na pewno zwiększa to możliwości kreatywnego wykorzystania technologi i lepszego dopasowania projektu do wymagań.

KeystoneJS to także idealny back-end w kompozycji z dobrze znanymi frameworkami React, Vue czy Angular, a także generatorami statycznych witryn typu Gatsby lub Next.js. Z jego wykorzystaniem stworzysz zaawansowany witryny www., statyczne projekty czy aplikacje mobilne.

Także w przechowywaniu danych Keystone daje programistom dowolność oferując adaptery do rozmaitych rodzajów baz danych i opracowując kolejne. Pierwszy projekt możesz stworzyć bardzo szybko używając Keystone CLI. Dodatkowo twórcy opracowali całą gamę samouczków ułatwiającym rozpoczęcie programowania z użyciem KeystoneJS mniej zaawansowanym użytkownikom.

8. Prismic

Na stronie twórców Prismic znajdziecie wśród firm używających tej technologii między innymi logotypy Google, Netflixa czy Digital Ocean. Bardzo dobrze headless Prismic opisuje, również cytat z tej storny:

...basically we've built a tool that lets you choose your technology, framework, and language and then easily manage your content.

W Prismic możesz wybierać między frameworkami: Node.js, React.js, Next.js, Gatsby, Vue.js, Nuxt.js, a także co ciekawe wybrać wersję non-developer. Tam znajdziesz między innymi listę freelancerów i agencji doświadczonych w projektach z użyciem headless Prismic, gdzie możesz wybrać rekomendowanego przez usługodawcę wykonawcę.

Wersja dla developerów to także mnóstwo case studies w połączeniu Prismic i Twoim ulubionym frameworkiem. Oficjalna liczba firm wykorzystujących tę technologią to ponad 4000.

9. Prose

Przedostatni w zestawieniu healess CMSów to Prose. To rozwiązanie jest dedykowane generatorowi stron statycznych Jekyll i nie obsługuje innych generatorów.

Prose to edytor/interfejs treści dla GitHub, stworzony w celu zarządzania zawartością stron internetowych. Możesz użyć go, aby dodawać, edytować i usuwać pliki, a zmiany zapiszą się bezpośrednio w repozytorium GitHub.

Używając Prose możesz hostować swój projekt na własnym serwerze GitHub Webhook lub bezpłatnie hostować na GitHub Pages. Konfigurując projekt w Jekyll warto zainteresować się tym headlessem, w szczególności, jeżeli strona będzie wymagać ciągłej edycji przez osoby nietechniczne. W takim wypadku włączenie do "stacka" Prose pomoże Ci zaoszczędzić pisania wielu linijek kodu.

10. GraphCMS

Nasze zestawienie wybranych technologii headless CMS zamyka GraphCMS, czyli kolejne rozwiązanie typu Software as a service. Ten system do zarządzania treścią wykorzystują między innymi tacy giganci jak Unilever czy Tchibo. Usługodawca deklaruje, że na GraphCMS pracuje łącznie ponad 30 tys. zespołów różnej wielkości.

GraphCMS to przede wszystkim potężne API GraphQL dla programistów i płynna praca edytora dla twórców treści. Twórcy określaną nawet swój interfejs API jako najbardziej elastyczny interfejs API treści w branży CMS, który usprawnij obieg pracy zespołów programistycznych i redakcyjnych i ożywi twoje projekty.

Oczywiści formuła Saas powoduje, że GraphCMS jest narzędziem płatnym. Wysokość miesięcznego abonamentu zależy od ilości sesji wygenerowanych w danym miesiącu. Do 5 tys. sesji zapłacisz $39, ale już w przypadku 75 tys. będzie to $399. Rozwój w oparciu o ten headless CMS będzie na pewno droższy, niż w przypadku oprogramowania na wolnych licencjach.

Podsumowanie

Decydując się na wykorzystanie technologi headless CMS w swoim projekcie na pewno zyskasz na wielu polach:

  • Skrócisz czas kodowania, co przełoży się na wyższą rentowność projektu. Jeżeli jesteś freelancerem i kodujesz samodzielnie jest to zapewne dla Ciebie bardzo istotne,

  • Udostępniasz content edytorom łatwy dostęp do zarządzania treścią, jednocześnie nie ograniczając potencjału do skalowania projektu.

  • W porównaniu do standardowych CMS zwiększasz nieporównywalnie wydajność aplikacji pod kątem szybkości ładowania i wygody korzystania przez użytkowników.

  • W przypadku najpopularniejszych headlessów uzyskujesz dostęp do wsparcia ze strony wielotysięcznych społeczności programistów i setek case study z działających projektów.

Oczywiście każdy z headless CMSów ma też swoje wady. Jedne ograniczają programistę pod kątem zewnętrznych technologi, a inne są po prostu drogie. Jednak najważniejszą wadą CMS headlessów jest według mnie uzależnianie się w jakiś sposób od usługodawcy. Szczególnie w przypadku aplikacji w modelu Saas warto mieć gotową statyczną wersję strony. Istnieje możliwość wycofania się dostawcy usługi z rynku, co będzie się wiązało z przerwaniem działania również Waszego projektu. Część firm tworzących headless CMSy to typowe start-upy, więc tym bardziej należy o tym pamiętać.

Tomasz Kozon

Autor Tomasz Kozon

Zajmuję się projektowaniem aplikacji i serwisów internetowych. Posiadam wiedzę i doświadczenie z zakresu: programowania (JS, PHP, CSS, HTML), Marketing Automation, WebDev, kampanii w Social Media, SEO, SEM, kampanii mailingowych i copywrittingu. Obecnie kieruję spółką Boring Owl i organizacją non-profit. Rozwijam start-upy, programuję i zarządzam projektami zintegrowanych kampanii marketingu w wielu kanałach on-line.

Więcej wpisów od Tomasz Kozon