payload-cms

name	payload-cms
description	Payload CMS: TypeScript-first headless CMS, collection schemas, access control, hooks, REST+GraphQL APIs, Next.js App Router integration

Payload CMS Skill

When to activate

• Building a Next.js app that needs a content management system
• Setting up typed content collections (blog posts, products, pages)
• Implementing field-level access control (admin only, author can edit own)
• Using Payload's hooks to trigger side effects on document changes
• Migrating from a SaaS CMS (Contentful, Sanity) to a self-hosted solution

When NOT to use

• Simple static sites with markdown files — use Astro + content collections
• Non-TypeScript projects — Payload is TypeScript-first
• When you need a visual drag-and-drop page builder — use Webflow or Builder.io

Instructions

Installation (with Next.js)

npx create-payload-app@latest my-app
# Template: Website / E-commerce / Blank
# Database: MongoDB / PostgreSQL
# TypeScript: Yes (default)

Collection schema

// collections/Posts.ts
import type { CollectionConfig } from 'payload'

export const Posts: CollectionConfig = {
  slug: 'posts',
  admin: {
    : ,
    : [, , , ],
  },
  : {
    :    ,          
    : isAuthenticated,      
    : isAuthorOrAdmin,      
    : isAdmin,              
  },
  : [
    { : ,   : ,     :  },
    { : ,    : ,     : , : { :  } },
    { : , : , :  },
    {
      : ,
      : ,
      : [, ],
      : ,
      : { :  },
    },
    {
      : ,
      : ,
      : ,
      : { :  },
    },
    {
      : ,
      : ,
      : ,
    },
    {
      : ,
      : ,
      : [{ : , :  }],
    },
    {
      : ,
      : ,
      : [
        { : ,       :  },
        { : , :  },
      ],
    },
  ],
  : ,
}