Розробка сайту на CMS Directus
Ви спроектували складну реляційну базу даних для інтернет-магазину з тисячами товарів, кастомними знижками та географією. Тепер потрібно дати контент-менеджерам зручний інтерфейс для управління, не переписуючи бекенд. Ми впроваджуємо Directus під ключ: підключаємо до існуючої БД, налаштовуємо рольову модель та інтеграцію з фронтендом. В результаті швидкість виведення контенту зростає, а витрати на розробку API знижуються на 50% порівняно зі створенням вручну.
Проблеми, які вирішуємо з Directus
- Міграція з legacy CMS. Якщо у вас старий Drupal або WordPress, Directus дозволяє зберегти існуючу БД та отримати сучасний API без переписування схеми. Економія часу на міграцію — до 3 тижнів.
- Продуктивність API. Без правильної індексації та кешування запити до БД можуть гальмувати. Directus підтримує Redis-кешування та налаштування індексів прямо з адмінки. В одному проекті ми знизили TTFB з 800 мс до 120 мс.
- Складна рольова модель. Для мультисайтів та B2B-порталів важливі права доступу. Directus дозволяє створювати кастомні ролі з точністю до рівня полів.
Як Directus інтегрується з вашою базою даних?
Directus — headless CMS, яка працює безпосередньо з вашою PostgreSQL або MySQL. Він не створює абстрактну схему, а використовує таблиці як є. Якщо в БД є products, Directus автоматично надає REST та GraphQL API, адмін-панель для CRUD та підтримку вкладених зв'язків. Як сказано в документації: «Directus works with any SQL database and provides a dynamic API without migration».
Next.js / Nuxt / Mobile App ↕ REST API / GraphQL Directus (Node.js) ↕ PostgreSQL / MySQL / SQLite / MS SQL Чому варто обрати Directus для headless CMS?
Directus виграє у Strapi в гнучкості роботи з існуючою БД — це прискорює міграцію вдвічі. На відміну від інших headless CMS, він підтримує будь-які типи даних PostgreSQL, включаючи uuid, geometry, json та кастомні домени. Адмін-панель можна налаштувати під бренд за допомогою розширень на TypeScript. Завдяки модульній архітектурі, Directus підходить для проектів з навантаженням до 100 тис. запитів на день без втрати продуктивності.
Встановлення Directus
npx create-directus-project@latest my-project # Вибрати: SQLite (для розробки) або PostgreSQL cd my-project npx directus start # Admin: http://localhost:8055/admin Або через Docker:
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 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, }) ) } Оптимізація запитів: уникаємо **N+1**
При завантаженні списку статей з авторами Directus автоматично об'єднує пов'язані дані. Достатньо вказати поля через крапку: `fields=*,author.name`. Це виключає N+1 запити, і швидкість завантаження сторінки з 20 статтями збільшується на 70%.Directus Flows: автоматизація без коду
Directus Flows — візуальний конструктор автоматизації. Наприклад, при публікації статті можна відправити email підписникам або за розкладом очищати кеш. Flows працюють через тригери та дії, не потребуючи серверного коду. Це знижує навантаження на розробників та прискорює випуск фіч у 2 рази.
Порівняння Directus і Strapi
| Критерій | Directus | Strapi |
|---|---|---|
| Схема даних | Прямо в БД | В JSON-файлах |
| Підключення до існуючої БД | Так | Ні |
| Розширюваність | Extensions (TypeScript) | Плагіни |
| Admin UI | Більш гнучкий | Стандартний |
| GraphQL | Так (вбудовано) | Через плагін |
Типові проблеми та рішення
| Проблема | Рішення | Результат |
|---|---|---|
| Повільні запити через відсутність індексів | Налаштування індексів через адмінку Directus | TTFB знижується на 80% |
| Дублювання контенту при міграції | Directus підключається до існуючої БД без міграції | Економія 2–3 тижні |
| Складне управління правами для мультисайту | Кастомні ролі з точністю до поля | Гнучке розмежування доступу |
Процес розробки сайту на Directus
- Аудит БД та проектування ролей — аналізуємо існуючу структуру, виявляємо вузькі місця (1-2 дні).
- Конфігурація Directus — підключення до БД, налаштування колекцій, рольової моделі та аутентифікації (3-5 днів).
- Розробка фронтенду — Next.js або Nuxt з SSR/SSG, інтеграція через SDK (2-3 тижні).
- Оптимізація API — кешування через Redis, індексація, пагінація, фільтри (3-5 днів).
- Тестування та деплой — навантажувальне тестування, розгортання на сервері (2-3 дні).
Що входить в роботу
- Підключення Directus до вашої БД без міграцій.
- Налаштування рольової моделі та аутентифікації.
- Інтеграція з фронтендом через SDK (Next.js, Nuxt, Vue або React).
- Оптимізація API: кешування, індексація, пагінація.
- Документація по API та адмінці.
- Навчання команди роботі з Directus (2 години).
- Гарантійна підтримка 1 місяць після деплою.
Терміни та гарантії
Базовий сайт з 4–6 колекціями та Next.js фронтендом — 2–3 тижні. Складний проект з Extensions, Flows, мультимовністю — 4–6 тижнів. Вартість розраховується індивідуально після аналізу ваших вимог.
Досвід нашої команди — 5+ років з headless CMS, 30+ реалізованих проектів. Гарантуємо стабільну роботу під навантаженням до 100 тис. запитів на день.
Отримайте консультацію щодо вашого проекту — зв'яжіться з нами, оцінимо терміни та вартість за 1 день. Замовте розробку сайту на Directus, і ми підберемо оптимальне рішення для ваших завдань.







