Git-based Headless CMS: сайт на Decap CMS без БД та бекенду

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>

Процес роботи

Що входить в роботу та терміни

• Розробка бекенду: конфігурація 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.