Налаштування Contentful Space та Content Model

Налаштування Contentful Space та Content Model

Space у Contentful — це ізольований робочий простір з власними типами контенту, записами та середовищами. Правильна структура Content Model визначає масштабованість проекту.

Створення Space

В app.contentful.com → Add Space. Безплатний план: 1 space, 25 000 записів, 2 локалі, 2 користувача.

Content Model через GUI

Settings → Content Model → Add Content Type:

Blog Post (blogPost)
├── title: Short text (required, unique)
├── slug: Short text (unique, regex: ^[a-z0-9-]+$)
├── excerpt: Short text (max: 500)
├── content: Rich Text
├── heroImage: Media (image)
├── publishedAt: Date & Time
├── author: Reference → Author (1:1)
├── categories: References → Category (many)
└── seoTitle: Short text (max: 60, field-level locale)

Content Model через CLI

npm install -g contentful-cli
contentful login
contentful space export --space-id YOUR_SPACE_ID --export-dir ./backup

# Імпортувати модель до нового space
contentful space import --space-id NEW_SPACE_ID --content-file ./backup/export.json

Середовища

Production та staging середовища в одному space:

master (production) ← CDA_TOKEN_PRODUCTION
staging             ← CDA_TOKEN_STAGING

# Створити staging середовище
contentful space environment create --name staging --environment-id staging

# Клонувати модель із master
contentful space environment create --name staging \
  --environment-id staging --source master

В SDK:

// Для staging
createClient({
  space: SPACE_ID,
  accessToken: STAGING_TOKEN,
  environment: 'staging',
})

API токени

Settings → API Keys → Add API Key:

• Content Delivery API (CDA) — публічний, для фронтенду
• Preview API — для чернеток та Draft Mode
• Content Management API (CMA) — серверний, ніколи в браузері

Локалізація

Settings → Locales → Add Locale. Усі поля за замовчуванням перекладаються. Можна вимкнути для конкретного поля.

// Запит з локаллю
const entries = await client.getEntries({
  content_type: 'blogPost',
  locale: 'uk',
})

// Всі локалі одночасно
const entry = await client.getEntry(id, { locale: '*' })
// entry.fields.title = { 'ru': '...', 'en': '...', 'uk': '...' }

Content Model через Contentful CLI + JSON

# Експортувати модель
contentful space export --space-id xxx --skip-content --export-dir ./model

# Файл model/contentful-export-xxx.json містить contentTypes[]
# Редагувати та імпортувати до іншого space
contentful space import --space-id yyy --content-file ./model/contentful-export-xxx.json

Це дозволяє версіонувати модель у git та розгортати через CI.

TypeScript типи через codegen

npm install -D cf-content-types-generator
npx cf-content-types-generator \
  --spaceId YOUR_SPACE_ID \
  --token YOUR_CMA_TOKEN \
  --out ./src/types/contentful.d.ts

Генерує TypeScript-інтерфейси для всіх Content Types — повна типізація API-відповідей.

Терміни

Налаштування Space з 4–6 Content Types, локалями, середовищами та API-токенами — 1 день.