build-crud-admin-page

Generate Next.js CRUD admin interfaces for PayloadCMS collections.

1|Updated Feb 13, 2026
One-click install
npx skills add https://github.com/vuthuonghai-steve/KLTN-By_Thuong_Hai-Steve --skill build-crud-admin-page
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: build-crud-admin-page
Source: https://github.com/vuthuonghai-steve/KLTN-By_Thuong_Hai-Steve/tree/main/.agent/skills/build-crud-admin-page
Command: npx skills add https://github.com/vuthuonghai-steve/KLTN-By_Thuong_Hai-Steve --skill build-crud-admin-page

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill automates the creation of comprehensive CRUD (Create, Read, Update, Delete) admin interfaces for PayloadCMS collections, streamlining the development of management screens.

Core Features & Use Cases

  • Automated Admin Screen Generation: Creates list and form views following the BouquetScreen pattern.
  • Flexible Field Handling: Supports defining specific fields or automatically reading from the schema.
  • Use Case: When a user requests a new admin screen for managing "product reviews" in PayloadCMS, this Skill can generate the necessary Next.js routes, React components for list and form views, and associated hooks and types.

Quick Start

Use the build-crud-admin-page skill to create an admin page for the 'users' collection.

Frequently Asked Questions about build-crud-admin-page

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I build a CRUD admin panel for PayloadCMS collections?

To build a CRUD admin panel for PayloadCMS, generate full-stack Next.js and React interfaces. This creates list views with filtering and pagination alongside form views for create, view, and edit modes.

What is the BouquetScreen architecture pattern for React admin interfaces?

BouquetScreen is an architecture pattern for structuring React admin interfaces. This Skill generates list and form views adhering to BouquetScreen to organize Next.js routes, components, and hooks for PayloadCMS collections.

How do I generate list and form views for a PayloadCMS collection schema?

Generate list and form views by defining specific fields or automatically reading them from the PayloadCMS schema. This outputs React components supporting create, view, and edit modes along with associated TypeScript types.

Can I use this to create a Next.js admin panel with filtering and pagination?

Yes, you can create a Next.js admin panel with filtering and pagination. This generates list views equipped with filtering and pagination capabilities, alongside form views for managing PayloadCMS collection data.

Do I need to manually define fields for a PayloadCMS CRUD interface?

You do not need to manually define fields for a PayloadCMS CRUD interface. This Skill supports flexible field handling by automatically reading fields directly from the collection schema or accepting explicitly defined ones.

What are the limitations of automated admin screen generation for PayloadCMS?

Automated admin screen generation for PayloadCMS is limited to producing list and form views following the BouquetScreen pattern using Next.js and React. It focuses on standard create, view, and edit modes without custom business logic.