Разработка сайта на CMS Directus

Разработка сайта на CMS Directus

Directus — headless CMS поверх существующей реляционной базы данных. Ключевое отличие: Directus не создаёт абстрактную схему данных — он работает напрямую с таблицами PostgreSQL/MySQL, которые вы определяете. Если в БД есть таблица products, Directus автоматически даёт к ней REST и GraphQL API, admin panel для CRUD.

Архитектура

Next.js / Nuxt / Mobile App
    ↕ REST API / GraphQL
Directus (Node.js)
    ↕
PostgreSQL / MySQL / SQLite / MS SQL

Directus — это слой поверх базы данных. Можно подключить к существующей БД без изменения схемы.

Установка

npx create-directus-project@latest my-project
# Выбрать: SQLite (для разработки) или PostgreSQL

cd my-project
npx directus start
# Admin: http://localhost:8055/admin

Или через Docker:

# docker-compose.yml
version: '3'
services:
  directus:
    image: directus/directus:latest
    ports:
      - "8055:8055"
    environment:
      SECRET: your-random-secret-key
      DB_CLIENT: pg
      DB_HOST: postgres
      DB_PORT: 5432
      DB_DATABASE: directus
      DB_USER: directus
      DB_PASSWORD: directus
      ADMIN_EMAIL: [email protected]
      ADMIN_PASSWORD: admin-password
    depends_on:
      - postgres

  postgres:
    image: postgres:15
    environment:
      POSTGRES_DB: directus
      POSTGRES_USER: directus
      POSTGRES_PASSWORD: directus
    volumes:
      - postgres_data:/var/lib/postgresql/data

Collections (таблицы)

В Directus admin через Settings → Data Model → Create Collection:

Collections (таблицы БД):
- articles (id, title, slug, content, status, author, published_at)
- categories (id, name, slug, description, parent_id)
- media (встроенная)
- users (встроенная через Users system collection)

Поля соответствуют колонкам таблицы. Directus поддерживает все стандартные типы PostgreSQL + специальные: uuid, hash, geometry, json.

REST API

# Получить список записей
GET /items/articles?fields=id,title,slug,published_at&filter[status][_eq]=published&sort=-published_at&limit=10

# Получить одну запись
GET /items/articles/123?fields=*,author.name,category.name

# Создать запись
POST /items/articles
{ "title": "New Article", "status": "draft" }

# Обновить
PATCH /items/articles/123
{ "status": "published" }

Аутентификация

# Получить токен
POST /auth/login
{ "email": "[email protected]", "password": "password" }
# Ответ: { "data": { "access_token": "...", "refresh_token": "...", "expires": 900000 } }

# Обновить токен
POST /auth/refresh
{ "refresh_token": "..." }

# Использование
GET /items/articles
Authorization: Bearer <access_token>

Типичный стек проекта

Интеграция с Next.js

// lib/directus.ts
import { createDirectus, rest, authentication, readItems, readItem } from '@directus/sdk'

const directus = createDirectus(process.env.DIRECTUS_URL!)
  .with(rest())
  .with(authentication())

// Статичный токен для серверных запросов
const staticToken = process.env.DIRECTUS_STATIC_TOKEN!

export async function getArticles(limit = 12) {
  return directus.request(
    readItems('articles', {
      fields: ['id', 'title', 'slug', 'excerpt', 'published_at', { thumbnail: ['id', 'filename_disk'] }],
      filter: { status: { _eq: 'published' } },
      sort: ['-published_at'],
      limit,
    })
  )
}

Flows (автоматизация)

Directus Flows — визуальный конструктор автоматизации (триггер → действия):

• При публикации статьи → отправить email
• По расписанию → очистить кэш
• При создании заказа → POST в CRM webhook

Это не требует кода — настраивается в admin panel.

Отличия от Strapi

Сроки

Базовый сайт с 4–6 коллекциями и Next.js фронтендом — 2–3 недели. Сложный проект с Extensions, Flows, мультиязычностью — 4–6 недель.