Git-based Headless CMS: Decap CMS без БД та бекенду
Ви отримали задачу: сайт-блог або документація, але хостинг БД не передбачений, бюджет на бекенд нульовий. Рішення — Decap CMS (колишній Netlify CMS). Це git-based headless CMS: контент зберігається в репозиторії як Markdown та YAML-файли. Немає бази даних, немає окремого бекенду — тільки Git. Редактор працює в браузерному інтерфейсі, натискає «Зберегти», і за кулісами відбувається коміт в репозиторій, а CI/CD збирає оновлений сайт. Ми використовуємо цей підхід на десятках проєктів — від невеликих візиток до корпоративних порталів. Часто клієнти приходять зі скаргами: складність WordPress, дорогі хостинги БД, відсутність версіонування контенту. Decap CMS вирішує ці проблеми.
Чому обирають Decap CMS, а не інші headless CMS?
Decap CMS підходить для невеликих сайтів, де команда розробки готова до обмежень git-моделі: контент-менеджер не може оновити сторінку о 2-й ночі та побачити зміни через 10 секунд — спочатку пройде білд (1–3 хвилини на Netlify/Vercel). Зате немає хостингу БД, немає бекенду, нуль операційних витрат на інфраструктуру. Типовий стек: Next.js / Astro / Hugo + Decap CMS + Netlify/GitHub Pages.
| Критерій | Decap CMS | Strapi | Contentful |
|---|---|---|---|
| Хостинг | Статика (GitHub Pages, Netlify) | VPS або хмара | SaaS |
| База даних | Немає (Git) | PostgreSQL / SQLite | Власна |
| Ціна | Безкоштовно | Безкоштовно для self-hosted | Платна підписка |
| Версіонування | Git-коміти | Через плагіни | Вбудоване |
| Редактори | До 30-50 осіб | Будь-яке число | За ліцензією |
Decap CMS виграє в простоті та нульовій вартості інфраструктури. Якщо потрібні складні права доступу або API-first підхід — краще Strapi. Наш досвід: 50+ впроваджень headless CMS, 5 років на ринку — гарантуємо якість.
Які типи сайтів підходять для Decap CMS?
Це відмінний вибір для:
- Блогів та новинних сайтів з частотою публікації до 10 статей на день.
- Сайтів-візиток та лендінгів з мінімальним контентом.
- Документації (наприклад, на Docusaurus або GitBook).
- Корпоративних порталів для внутрішнього використання, де важлива безпека та аудит змін.
Не рекомендується для: інтернет-магазинів з частою зміною цін, медіа-сайтів з високим навантаженням, проєктів з десятками редакторів.
Як почати: покрокова інструкція для старту
- Виберіть генератор статики. Astro, Hugo або Next.js — будь-який підтримує Markdown-контент.
- Створіть admin-директорію в публічній папці вашого сайту з файлами
index.htmlтаconfig.yml. - Налаштуйте backend (GitHub, GitLab або Git Gateway) та колекції контенту.
- Запустіть CI/CD на Netlify або GitHub Actions, щоб сайт автоматично перезбирався після коміту.
- Додайте редакторів через OAuth та навчіть їх працювати з інтерфейсом.
Весь процес займає від 3 до 7 днів для простого блогу.
Налаштування OAuth для корпоративного GitHub
Decap CMS підтримує кілька бекендів аутентифікації:
- GitHub OAuth — через Netlify Identity або сторонній OAuth-проксі.
- GitLab — аналогічно.
- Git Gateway — Netlify-специфічний проксі, не вимагає прямого доступу до репозиторію.
Для не-Netlify хостингу — окремий OAuth-сервер:
backend: name: github repo: username/my-site base_url: https://your-oauth-server.com Мінімалістичний OAuth-проксі на Express розгортається на Railway або Fly.io за 30 хвилин.
Структура проєкту
my-site/ ├── public/ │ └── admin/ │ ├── index.html # Інтерфейс CMS │ └── config.yml # Конфігурація колекцій ├── content/ │ ├── posts/ │ │ ├── first-post.md │ │ └── second-post.md │ └── pages/ │ └── about.md ├── src/ │ └── ... # Код фронтенду └── astro.config.mjs Точка входу CMS — CDN-скрипт в public/admin/index.html. Жодних npm-пакетів для інтерфейсу — просто завантажуємо [email protected] з CDN.
Конфігурація колекцій
# public/admin/config.yml backend: name: github repo: username/my-site branch: main media_folder: public/images/uploads public_folder: /images/uploads locale: uk collections: - name: posts label: Статті folder: content/posts create: true slug: "{{year}}-{{month}}-{{day}}-{{slug}}" fields: - { label: Заголовок, name: title, widget: string } - { label: Дата публікації, name: date, widget: datetime } - { label: Обкладинка, name: cover, widget: image, required: false } - { label: Опис, name: description, widget: text, required: false } - { label: Теги, name: tags, widget: list, required: false } - { label: Контент, name: body, widget: markdown } - name: pages label: Сторінки files: - label: Про нас name: about file: content/pages/about.md fields: - { label: Заголовок, name: title, widget: string } - { label: Контент, name: body, widget: markdown } Читання контенту в Astro
// src/pages/blog/[slug].astro --- import { getCollection } from 'astro:content' export async function getStaticPaths() { const posts = await getCollection('posts') return posts.map(post => ({ params: { slug: post.slug }, props: { post }, })) } const { post } = Astro.props const { Content } = await post.render() --- <article> <h1>{post.data.title}</h1> <time>{post.data.date.toLocaleDateString('uk-UA')}</time> <Content /> </article> Процес роботи
| Етап | Що робимо | Результат |
|---|---|---|
| Аналітика | Вивчаємо вимоги, контент, дизайн | Технічне завдання |
| Проєктування | Обираємо стек, проєктуємо колекції | Архітектура проєкту |
| Реалізація | Налаштовуємо CMS, розробляємо компоненти | Робоче середовище |
| Тест | Перевіряємо збірку, аутентифікацію, редактор | Звіт тестування |
| Деплой | Налаштовуємо CI/CD, підключаємо домен | Готовий сайт |
Що входить в роботу та терміни
- Розробка бекенду: конфігурація Decap CMS, налаштування OAuth.
- Інтеграція з генератором статики (Astro, Next.js, Hugo).
- Налаштування CI/CD для автоматичної збірки та деплою.
- Навчання редакторів роботі з CMS.
- Документація щодо структури контенту та розгортання.
- Підтримка протягом 1 місяця після запуску.
Терміни: сайт-візитка або блог — 3–7 днів; корпоративний сайт з 5–8 типами сторінок, кастомними віджетами та налаштованим CI/CD — 2–3 тижні.
Замовте консультацію
Зв'яжіться з нами — розповімо, чи підходить Decap CMS для ваших завдань, прикинемо терміни та вартість. Ми займаємося веб-розробкою більше 5 років і реалізували понад 50 проєктів на headless CMS. Отримайте консультацію по вашому проєкту. Вартість робіт від 15 000 грн — економія до 70% порівняно з традиційними CMS.