Установка и настройка Payload CMS

Наша компания занимается разработкой, поддержкой и обслуживанием сайтов любой сложности. От простых одностраничных сайтов до масштабных кластерных систем построенных на микро сервисах. Опыт разработчиков подтвержден сертификатами от вендоров.

Разработка и обслуживание любых видов сайтов:

Информационные сайты или веб-приложения
Сайты визитки, landing page, корпоративные сайты, онлайн каталоги, квиз, промо-сайты, блоги, новостные ресурсы, информационные порталы, форумы, агрегаторы
Сайты или веб-приложения электронной коммерции
Интернет-магазины, B2B-порталы, маркетплейсы, онлайн-обменники, кэшбэк-сайты, биржи, дропшиппинг-платформы, парсеры товаров
Веб-приложения для управления бизнес-процессами
CRM-системы, ERP-системы, корпоративные порталы, системы управления производством, парсеры информации
Сайты или веб-приложения электронных услуг
Доски объявлений, онлайн-школы, онлайн-кинотеатры, конструкторы сайтов, порталы предоставления электронных услуг, видеохостинги, тематические порталы

Это лишь некоторые из технических типов сайтов, с которыми мы работаем, и каждый из них может иметь свои специфические особенности и функциональность, а также быть адаптированным под конкретные потребности и цели клиента

Предлагаемые услуги
Показано 1 из 1 услугВсе 2065 услуг
Установка и настройка Payload CMS
Простая
~1 рабочий день
Часто задаваемые вопросы

Наши компетенции:

Этапы разработки

Последние работы

  • image_website-b2b-advance_0.png
    Разработка сайта компании B2B ADVANCE
    1262
  • image_web-applications_feedme_466_0.webp
    Разработка веб-приложения для компании FEEDME
    1171
  • image_websites_belfingroup_462_0.webp
    Разработка веб-сайта для компании БЕЛФИНГРУПП
    874
  • image_ecommerce_furnoro_435_0.webp
    Разработка интернет магазина для компании FURNORO
    1094
  • image_crm_enviok_479_0.webp
    Разработка веб-приложения для компании Enviok
    831
  • image_bitrix-bitrix-24-1c_fixper_448_0.png
    Разработка веб-сайта для компании ФИКСПЕР
    851

Установка и настройка Payload CMS

Payload CMS устанавливается как npm-пакет в Next.js проект. С версии 2.x рекомендован монорепозиторный подход — CMS и фронтенд в одном приложении.

Требования

  • Node.js 18.20.2+ или 20.9.0+
  • PostgreSQL 11+ или MongoDB 4.2+
  • npm 9+ / yarn 3+ / pnpm 8+

Установка через create-payload-app

npx create-payload-app@latest my-project

Интерактивный мастер спросит:

  • Template: blank, website, ecommerce, blog — выбрать подходящий
  • Database: MongoDB или PostgreSQL
cd my-project
cp .env.example .env

.env:

DATABASE_URI=postgresql://user:password@localhost:5432/payload_db
PAYLOAD_SECRET=super-secret-key-min-32-chars
NEXT_PUBLIC_SERVER_URL=http://localhost:3000
npm run dev
# CMS admin: http://localhost:3000/admin
# При первом запуске создать администратора

Структура проекта (Next.js монолит)

my-project/
├── app/
│   ├── (frontend)/          # Публичный фронтенд
│   └── (payload)/           # Admin panel
│       └── admin/[[...segments]]/page.tsx
├── collections/             # Типы контента
├── globals/                 # Глобальные настройки
├── payload.config.ts        # Главная конфигурация
├── payload-types.ts         # Автогенерируемые типы
└── next.config.js

Базовая конфигурация

// payload.config.ts
import { buildConfig } from 'payload/config'
import { postgresAdapter } from '@payloadcms/db-postgres'
import { lexicalEditor } from '@payloadcms/richtext-lexical'
import { s3Storage } from '@payloadcms/storage-s3'
import path from 'path'

export default buildConfig({
  serverURL: process.env.NEXT_PUBLIC_SERVER_URL || '',
  admin: {
    user: 'users',
  },
  editor: lexicalEditor({}),
  collections: [
    // Импортировать коллекции
  ],
  db: postgresAdapter({
    pool: { connectionString: process.env.DATABASE_URI || '' },
  }),
  plugins: [
    s3Storage({
      collections: { media: true },
      bucket: process.env.S3_BUCKET!,
      config: {
        region: process.env.S3_REGION,
        credentials: {
          accessKeyId: process.env.S3_ACCESS_KEY!,
          secretAccessKey: process.env.S3_SECRET_KEY!,
        },
      },
    }),
  ],
  typescript: {
    outputFile: path.resolve(__dirname, 'payload-types.ts'),
  },
})

Production деплой

# Build
npm run build

# Start
npm start

# Docker
FROM node:20-alpine
WORKDIR /app
COPY package*.json ./
RUN npm ci --omit=dev
COPY . .
RUN npm run build
EXPOSE 3000
CMD ["npm", "start"]

Сроки

Базовая установка с PostgreSQL и S3 для медиа — 2–4 часа. Настройка под конкретный проект с первыми коллекциями — 1 день.