Headless CMS на Git: разработка сайта на 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: ru

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('ru-RU')}</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. Получите консультацию по вашему проекту.