Найкращі headless CMS для створення інтернет-магазину. Огляд Strapi, Sanity та Contentful Commerce Layer

Привіт, мене звати Стас, я працюю в DigitalSuits і займаюсь розробкою різних електронних комерційних продуктів вже більш як 5 років.

У цій статті я хочу розповісти вам про headless CMS і як вони можуть покращити роботу бізнесу. Вони дають можливість легко спілкуватися з клієнтами і не потребують багато зусиль. Я також розкажу, як використовувати їхні можливості щоб збільшити ефективність бізнесу.

Сподіваюся, стаття буде корисною допоможе відповісти на всі запитання щодо headless CMS. Це дуже важливо, оскільки вони можуть стати ключовим фактором успіху і ефективним способом зв’язку з клієнтами. Розгляньмо разом можливості headless CMS.

При розробці e-commerce сайтів важливо вибрати відповідну систему управління контентом (CMS), яка відповідатиме вашим потребам. Для цього потрібно врахувати такі бізнес-фактори, як ціна та вартість, а також такі технічні аспекти, як характеристики сервера та підтримка API.

Вибір CMS для e-commerce розробки потребує ретельних досліджень та аналіз відгуків експертів. Тут я розгляну три headless CMS для e-commerce розробки, які відібрав на основі досвіду нашої компанії. Це допоможе визначитись, яка з них найкраще підійде саме для вашого сайту та бізнес-моделі.

Визначення headless CMS

Для початку розберімося із тим, для чого потрібна headless CMS як базова платформа сайту. Headless CMS для e-commerce дозволяють подолати кілька типових обмежень програмного забезпечення, таких як трудомісткий процес змін, повільні оновлення персоналізації та високі витрати на розробку. Вони забезпечують альтернативний підхід до веброзробки й мають кілька переваг саме для онлайн-магазинів.

Отже, що таке headless CMS? Ця концепція стосується архітектури програмного забезпечення — вона додає зручності в роботу розробників, розділяючи бекенд від фронтенд частини. На відміну від традиційної CMS, headless CMS дозволяє розробникам зосередитися на створенні та вдосконаленні власних модулів, не займаючись дизайном інтерфейсу користувачів.

Переваги headless CMS для розробників та бізнесу

Основними перевагами headless CMS є можливість швидкого внесення змін, створення персоналізації та налаштування, а також зниження витрат на ІТ-рішення. Інші переваги headless CMS порівняно з традиційними CMS включають:

  1. Відсутність обмежень для розробки інтерфейсу користувача.
  2. Безмежна кастомізація, гнучкість, розставлення пріоритетів та SEO-оптимізація.
  3. Багатоканальний досвід взаємодії.
  4. Висока масштабованість і швидкість розробки.
  1. Довгострокова економія коштів.

Нижче наведена таблиця порівняння трьох провідних платформ headless CMS у 2022 році, а далі я розгляну кожну з них окремо: Strapi, Sanity та Contentful Commerce Layer.

Критерій

Strapi

Sanity

Contentful Commerce Layer

Вартість

Безкоштовний Community план
Bronze план $9 на місяць Silver план $29 на місяць

Для Gold плану ціна надається за запитом

Безкоштовний план

Team план $99 на місяць
Business план $949 на місяць

Для Enterprise плану ціна надається за запитом

Безкоштовний Community план
Team план $489 на місяць

Для Premium плану ціна надається за запитом

Підтримка

Самостійний хостинг. Хмарне сховище незабаром

Самостійний хостинг або на платформі Sanity

Самообслуговування або технічна підтримка

Параметри єдиного входу (SSO)

Доступна тільки для плану Gold

Доступна для Business плану та Enterprise плану

Доступна тільки для плану Premium

GraphQL API

+

+

+

Кількість користувачів

3 адміністратори в Community плані Необмежена кількість адміністраторів в інших планах

Адміністратори: кількість не обмежена для всіх планів
Користувачі:

3 в безплатному плані

10 в Team плані

20 в Business плані

Згідно з налаштуваннями в плані Enterprise

5 користувачів в безкоштовному плані

25 користувачів в Team плані

3000+ користувачів в Premium плані

SLAs

Доступна тільки в плані Gold

Доступна тільки в плані Enterprise

Доступна тільки в плані Premium

Локалізація

Необмежена

За допомогою плагіну інтернаціоналізації документів

2 в безплатному плані
7-10 в Team плані
Згідно з налаштуваннями в плані Premium

Strapi

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

Цю систему використовують такі відомі бренди, як Toyota, IBM та Walmart.

Основні функції Strapi

Конструктор контенту. Strapi дозволяє моделювати контент будь-якого типу, починаючи від постів в блозі, кейс-стаді або сторінок в зручний спосіб без залучення розробників.

Це надає можливість користувачам створювати колекції та окремі сторінки, заповнювати контент у полях, використовувати повторювані компоненти, швидко будувати кастомізовані сторінки з динамічними зонами та робити перелінковки.

Медіатека. цей вбудований плагін дозволяє керувати всіма типами медіафайлів в одному місці. Він підтримує різні формати, легко сортує та фільтрує медіаактиви і надає швидкий попередній перегляд для зручності. Для редакторів додатковий файловий менеджмент включає автоматичну оптимізацію розміру, редагування в реальному часі, адаптивні формати та просту заміну медіафайлів.

Ролі та дозволи. Доступ на основі ролей контролює права на публікацію та редагування для різних команд, що робить управління контентом ще зручнішим. Цей інструмент спрощує адміністративну роботу, забезпечує високий рівень приватності та конфіденційності, а також підвищує ефективність командної співпраці. Ви зможете керувати правами доступу за допомогою користувацьких ролей, пов’язаних з вашими внутрішніми потребами, і налаштовувати їх відповідно до вашої діяльності.

Інтернаціоналізація. Плагін i18n дозволяє створювати персоналізовані повідомлення кількома мовами. Чітка навігація між локаціями, зручне редагування та гнучкість в адаптації структури кожної локації дозволяють спілкуватися мовою клієнтів і налагоджувати безперешкодно співпрацю з повною безпекою.

Для e-commerce потреб Strapi надає можливість збільшити конверсійність, оптимізувати управління товарами, інтегрувати інші платформи та сервіси для покращення досвіду користувачів, в тому числі керування доступом на основі ролей (RBAC), одночасний вхід одразу в кілька облікових записів (SSO) та підтримку для підприємств. З цією headless CMS ви отримуєте новий спосіб створення сайтів та застосунків, де контент централізовано зібраний в одному місці.

Sanity

Sanity допомагає створювати платформи для уніфікованого контенту. Пропозиція включає Content Lake для інтеграції структурованого контенту між організаціями, Sanity Studio для спільної роботи та кастомізації контенту, а також Developer Experience з відкритим і гнучким інструментарієм для розробників.

Багато компаній, включаючи Nike, Figma та Cloudfare, вже успішно перейшли на використання простих інструментів для реалізації співпраці в режимі реального часу.

Ключові особливості

Структурований контент. Headless CMS розглядає контент як фрагменти даних, які можна розмістити на будь-яких цифрових платформах, починаючи від вебсторінок, і закінчуючи застосунками. Ці фрагменти є машинозчитуваними, що означає, що вони пристосовані для пошукових систем, сприяють стійкій архітектурі та дозволяють АІ читати їх, щоб виявляти закономірності та пропонувати рішення.

Робота з відгуками. Інструмент для спільної роботи, який дозволяє командам надсилати миттєві відгуки, аналогічні функціоналу Google Docs, але без необхідності використання останнього. Функція змін до рецензій показує повну історію внесених змін до документа, дозволяє налаштовувати структуру даних з використанням власних компонентів вводу та включає API історії для зручної обробки запитів.

Обробник зображень. Sanity надає можливість виконувати трансформацію зображень (зміна розміру та обрізання) на запит користувача, без необхідності залучення фронтенду. Це досягається завдяки автоматичному кешуванню змін CMS для користувачів.

Sanity дозволяє ефективно працювати з якістю контенту та швидко доставляти його користувачам завдяки чіткій структурі, API та різноманітним сервісам. Це створює позитивний досвід для покупців і забезпечує єдиний підхід до управління продуктом та контентом. Sanity також пропонує конвеєр зображень, блоки контенту, адаптивний дизайн та легку масштабованість для ефективного управління усім цим.

Contentful Commerce Layer

Комерційний API, який забезпечує безпеку покупок в цифрових середовищах. Цей сервіс — визнаний лідер у створенні e-commercce вебсайтів та мобільних застосунків, який вже допомагає відомим брендам, таким як Chilly’s, Rapha та Brioni.

Завдяки гнучкості та швидкості, він дозволяє легко розробляти мобільні застосунки, інтегруватися з касовими терміналами та ефективно організовувати продажі в магазинах.

З Contentful є можливість додавати до сайту прості у використанні інструменти корпоративного рівня, що значно спрощує роботу веброзробників та адміністраторів сайтів.

Основні можливості Contentful Commerce Layer

Повнотекстовий пошук продуктів. З Contentful Commerce Layer можна додавати фільтри, які допомагають уточнити результати пошуку. Крім того, ви можете завантажити колекцію ресурсів та робити певне сортування результатів, використовуючи повнотекстову базу даних вашого продукту.

Попередній перегляд товарів. Система надає детальний попередній перегляд ваших товарів, завдяки чому відвідувачі зручно та швидко взаємодіють з вашим сайтом. За допомогою системи детального контролю доступу ви можете керувати дозволами та правами доступу для ваших команд, підвищуючи операційну ефективність та оптимізуючи саме управління контентом.

Посилання на SKU або списки SKU. Commerce Layer від Contentful — інструмент, який забезпечує зручну роботу з переліком товарів та кодами SKU. Якщо ви маєте сторінку з переліком товарів та кодами SKU, то завдяки Commerce Layer можете легко отримати код SKU для кожного товару на сторінці, а також виконувати фільтрацію товарів за їхнім кодом.

Commerce Layer дозволяє змінювати ціни без необхідності втручатися в бекенд вашого магазину. Це робить процес оновлення цін на товари простішим та ефективнішим. Що, своєю чергою, є великим плюсом для бізнесу, який хоче заощадити час та ресурси, щоб зосередитися на розвитку та збільшенні прибутку.

Побудова зв’язків та розподіл ринків. Ця CMS дає можливість створювати багатомовні сайти з мультивалютними цінами, розподіленими запасами, локалізованими платіжними системами та спеціальними пропозиціями. Комерційний пакет також дозволяє створювати пакети товарів або набори певних товарів, обмежених максимум 5 позиціями списку SKU в кожному пакеті.

Однією з головних переваг Contentful є детальна документація, яка дозволяє користувачам працювати з кожним окремим елементом, як розробнику. Це означає, що власники онлайн-магазинів можуть вільно налаштовувати свій сайт, додавати нові функції та змінювати наявні, без необхідності звертатися до програмістів.

Крім того, Contentful забезпечує надійність та безпеку даних. Платформа зберігає контент на серверах Amazon Web Services, що гарантує його безпеку та доступність. Додатково Contentful пропонує широкі можливості з налаштування прав доступу до даних, що мінімізує можливі проблеми з безпекою.

Можна сказати, що сьогодні Contentful є однією з найпрогресивніших та найфункціональніших платформ на ринку, з якою можна ефективно управляти контентом та забезпечувати безпеку даних.

Завершальні думки

Особливі переваги headless CMS, на які варто звернути увагу, включають покращений SEO, більшу гнучкість, швидші сайти, підвищення операційної ефективності та кращу співпрацю з контент-командою. Також, ви можете легко розробляти багатоканальні магазини і таким чином залучати більше клієнтів та збільшувати продажі.

Основні характеристики трьох розглянутих headless CMS — Strapi, Sanity та Contentful — схожі між собою. Вони пропонують безкоштовні тарифні плани та різні варіанти платних тарифів, самостійний хостинг та командну підтримку, а також підтримують GraphQL API у всіх планах. Однак функції SSO та SLA доступні лише у найдорожчих тарифах.

Отже, обираючи між Strapi, Sanity та Contentful Commerce Layer, варто пам’ятати, що всі вони пропонують основні функції headless CMS, але з різним фокусом:

  • Strapi дозволяє необмежену кількість локацій навіть у безплатному плані, що зручно для магазинів, які продають всюдисвітно. Це самостійно розгорнута CMS, тому дані, що зберігаються, можуть бути захищені індивідуально, відповідно до вимог клієнта.
  • Sanity також пропонує інтернаціоналізацію, але її основним зручним інструментом є функція Review Changes, яка полегшує спільну роботу над контентом для кількох команд.
  • Своєю чергою, Contentful Commerce Layer пропонує кілька інструментів управління контентом, але власник інтернет-магазину, який ними керує, повинен мати базові знання з кодування та розуміти що таке SKU.

Сподіваюсь, що стаття не лише була корисною, але і захопливою! Тепер ви знаєте, як саме headless CMS можуть покращити роботу.

👍ПодобаєтьсяСподобалось8
До обраногоВ обраному4
LinkedIn
Дозволені теги: blockquote, a, pre, code, ul, ol, li, b, i, del.
Ctrl + Enter
Дозволені теги: blockquote, a, pre, code, ul, ol, li, b, i, del.
Ctrl + Enter

1. Дуже дякую за технічну статтю. А не черговий пост про ЗП, кризу, оффери і т.д.

2.

headless CMS

Пояснення що таке

headless CMS

ніяке абсолютно!
Можна пояснити нормально з технічної точки зору, але копіпастом маркетингови матеріалів?

Я б радив переглянути Directus і потім зробити нові висновки щодо вище згаданих CMS..
Як на мене Directus — це одне із найкращих рішень на даний момент, також дуже хорошим варіантом вважаю Storyblok, але це дещо різні речі.

Всі вищезгадані CMS не дуже зручні в розробці, їх досить важко підтримувати, особливо коли проект розростається. Мав досвід із кожною, тому і не рекомендую

а які саме проблеми виникали з Sanity та Contentful з точки зору підтримки?

В моєму випадку найгірший був досвід із Strapi, і тією «безмежною» кількістю плагінів які він надавав бо не всі добре працювали, приходилось витрачати досить багато часу щоб досягти необхідного функціоналу, і Directus в моєму випадку вирішив всі ці проблеми, бо весь необхідний мені функціонал надавався одразу з «коробки» і в код не приходилось залазити взгалі, в той час як з іншими headless cms потрібно повозитись деякий час.

У випадку із Sanity не дуже сподобалось описування схем кодом, та ще декілька моментів кастомізації. Це моя суб’єктивна думка — мені в таких випадках подобаються готові рішення де не потрібно(або мінімально) залазити в код для того щоб додати якісь незначні зміни. Сама зміна коду вже додає необхідність деплойменту, синхронізації змін і перевірки що нічого не впало в момент цього оновлення що само собою вже не дуже добре і тільки додає ризиків.

Також не підійшла система планів у всіх 3-х CMS, досить дивно коли потрібно маючи self-hosted версію доплачувати гроші за те щоб додати нових юзерів чи вікдрити можливість більш глибшої кастомізації пермішинів.. (в Directus це безплатно з під коробки)

Можна із цього приводу довго дискутувати якщо прийдеться, у кожного сервісу завжди знайдеться свій користувач. Як на мене найкраще використовувати тільки ті рішення з якими легко працювати і які дійсно спрощують життя а не ускладнюють

Мені навпаки подобається описання схеми кодом, бо зручніше можна організувати контент моделі і перевикористати спільні елементи + контроль за змінами схеми більш чіткий. Може для невеликих проектів без декількох енвайроментів і буде дійсно швидше й простіше все натикати мишею, але в статті розмова була за екомерс проекти. Тут трохи інша історія, особливо коли проект динамічно розвивається.

Розумію цей момент, тут все досить суб’єктивно виходить, бо кожен обирає що йому більше подобається. Комусь хочеться більше колупатись в коді, а комусь в GUI і це нормально.

Якщо говорити про велечину проекту і шерінг на різні енвайрменти то немає різниці як генерується схема (руками чи кодом), важливий тільки той момент щоб цю схему можна було легко пошарити між енвайрментами (в Directus на це є зручний CLI через який можна робити це досить легко).

Щодо eCommerce проектів то як на мене із ними все найпростіше, бо воно всі йдуть під копірку і вибір CMS на початку ролі не грає, тільки із ростом проекту ви починаєте бачити недоліки, нехватку/відсутність якогось функціоналу, неможливість змінити те що вам потрібно і тд.

Інша справа коли ви використовуєте headless CMS на інших типах проектів, і тут все стає цікавіше, коли заходить розмова про кастомізацію різних речей — наприклад UI, створення своїх кастомних сторінок, компонентів, лаяутів, генерація CRUD або кастомної бізнес логіки на базі вашої CMS, робота із вебхуками, агрегація даних і відображення їх на чартах, і купа іншого.

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

не певен що зрозумів ідею про «еком-проекти під-копірку», і чому вибір продукту не грає ролі, але можливо у Вас трохи інший досвід з єкомерсом ніж в мене. Зазвичай вибір продуктів дозволяє (або не дозволяє) реалізовувати ті чи інші ідеї, і якщо «тільки з ростом проекту» починати бачити недоліки, то я б це назвав lack of discovery. В нормальному екомерс-проекті є й кастомні сторінки, і різні лейаути і саме для цього і додають CMS.

Скоріше за все ви мене не правильно зрозуміли, але зійдемось на тому що в нас різний досвід

Окрім strapi, існує рішення, що більше спеціалізоване для commerce: medusa medusajs.com.

А в MedusaJS є якісь можливості контент-менеджменту, як в хедлес ЦМС? Якщо у Вас був досвід з медузою, було б цікаво почути відгук

Не маю досвіду використання medusa. Згідно із документацією, medusa може бути двосторонньо звʼязаною із strapi docs.medusajs.com/plugins/cms/strapi

Як з налаштуванням під SEO?

Створюєте набір полів SEO (умовні три поля «назва», «опис», «світлина для соцмереж»), призначаєте цей набір потрібним типам даних (наприклад множинному типу «стаття» чи одинаковому типу «головна сторінка»), заповнюєте ці поля у екземплярах типів даних (статтях і на головній сторінці), а у фронтенді значення тих полів рендерите в meta-тегах.

Можна трохи спростити життя використанням SEO-плагінів, наприклад в strapi market.strapi.io/...​lugins/@strapi-plugin-seo, але загальна картина не змінюється.

Тобто кастомізації, кастомні інтерфейси та гнучкість розробки в інших CMS немає?

Як на мене, то трохи не дороблена стаття, бо на поставлені питання на початку статті текст не відповідає. З контентфул взагалі вийшло кумедно — є Сontentful CMS і є CommerceLayer як екомерс-платформа, але чомусь у статті їх зліпили до купи. Я б трохи переробив, почавши з того чи взагалі потрібна окрема CMS для екомерс-проектів, коли вона потрібна, і яка є специфіка вибору.

Ще є враження, що продакшен досвіду з цими продуктами автор не має, а переводить просто опис на сайті на українську (що в цілому-то не дуже й погано). Бо інакше не зовсім зрозуміло, наприклад, чому в описі Sanity не вказано що це можливо єдина CMS котра дозволяє описувати структури даних (схему) за допомогою коду, а не тицяння в браузері.

Станіслав, ми тут з другом читаємо і ніяк не можемо збагнути чому ні слова про Storyblok www.storyblok.com ?

Це ж ТОПова CMS! G2, Forrester, Gartner, вже висловили свою думку, а Ви ні. 🤨

а чим вона краще за описані варіанти? Довіри до Гартнера і ко вже давно нема)

якщо коротко — ціною і функціоналом.
Вартість контентфула вже стала легендарною. Я маю на увазі коли люди впираються в ліміти свого плану і треба апгрейдити до ентерпрайза. + вони чарджать за незавжди передбачувані кретерії.

В Сторіблок такого немаєю Зате є класний візуальний редактор, навідміну від Контентфула.
www.storyblok.com/...​tp/contentful-alternative

Відсутність обмежень для розробки інтерфейсу користувача.
Безмежна кастомізація, гнучкість, розставлення пріоритетів та SEO-оптимізація.
Багатоканальний досвід взаємодії.
Висока масштабованість і швидкість розробки.
Довгострокова економія коштів.

А що Вам заважає робити те саме на звичайних CMS? SEO-оптимізація — заявляється як перевага headless CMS? 2023 рука-лице

це Ви про які такі звичайні?

Ті, що автор називає «традиційними». Як на мене, то стаття більше для Бізнес Молодості, ніж для IT.

Підписатись на коментарі