Use and adapt puck

Use the documented interfaces and source layout for puck. The sections below retain the README’s examples and configuration details.

What is Puck?

Puck is a modular, open-source visual editor for React.js. You can use Puck to build custom drag-and-drop experiences with your own application and React components.

Because Puck is just a React component, it plays well with all React.js environments, including Next.js. You own your data and there’s no vendor lock-in.

Puck is also licensed under MIT, making it suitable for both internal systems and commercial applications.

Recipes

Use create-puck-app to quickly spin up a a pre-configured app based on our provided recipes:

1npx create-puck-app my-app

Available recipes include:

next: Next.js example, using App Router and static page generation
remix: Remix Run v2 example, using dynamic routes at root-level
react-router: React Router v7 app example, using dynamic routes to create pages at any level

Community

Discord server for discussions
awesome-puck community repo for plugins, custom fields & more

Commands in the root manifest

The captured package.json declares the following scripts. Run them from the directory containing that manifest.

Command	Script
`npm run build`	`turbo run build`
`npm run dev`	`rimraf packages/core/dist && turbo run dev --filter=demo`
`npm run lint`	`turbo run lint`
`npm run test`	`turbo run test`

Troubleshoot a local change

Reproduce the smallest example from the quick-start guide.
Compare required configuration and dependency versions with the README.
Check the linked issue tracker for the same error. Include the command, runtime version, and relevant error when reporting a problem; omit credentials.

Source and help

The catalog identifies the license as MIT. Read the repository license before redistributing source or assets.

This catalog entry is a fork. The README may describe upstream packages, domains, or release procedures; those destinations do not establish a separate release of this fork.

What is Puck?

Puck is a modular, open-source visual editor for React.js. You can use Puck to build custom drag-and-drop experiences with your own application and React components.

Because Puck is just a React component, it plays well with all React.js environments, including Next.js. You own your data and there’s no vendor lock-in.

Puck is also licensed under MIT, making it suitable for both internal systems and commercial applications.

Recipes

Use create-puck-app to quickly spin up a a pre-configured app based on our provided recipes:

1npx create-puck-app my-app

Available recipes include:

next: Next.js example, using App Router and static page generation

remix: Remix Run v2 example, using dynamic routes at root-level

react-router: React Router v7 app example, using dynamic routes to create pages at any level

Command

Script

npm run build

turbo run build

npm run dev

rimraf packages/core/dist && turbo run dev --filter=demo

npm run lint

turbo run lint

npm run test

turbo run test

Source and help

The catalog identifies the license as MIT. Read the repository license before redistributing source or assets.

This catalog entry is a fork. The README may describe upstream packages, domains, or release procedures; those destinations do not establish a separate release of this fork.