base on Payload is the open-source, fullstack Next.js framework, giving you instant backend superpowers. Get a full TypeScript backend and admin panel instantly. Use Payload as a headless CMS or for building powerful applications. <a href="https://payloadcms.com"><img width="100%" src="https://l4wlsi8vxy8hre4v.public.blob.vercel-storage.com/github-banner-new-logo.jpg" alt="Payload headless CMS Admin panel built with React" /></a> <br /> <br /> <p align="left"> <a href="https://github.com/payloadcms/payload/actions"><img alt="GitHub Workflow Status" src="https://img.shields.io/github/actions/workflow/status/payloadcms/payload/main.yml?style=flat-square"></a> &nbsp; <a href="https://discord.gg/payload"><img alt="Discord" src="https://img.shields.io/discord/967097582721572934?label=Discord&color=7289da&style=flat-square" /></a> &nbsp; <a href="https://www.npmjs.com/package/payload"><img alt="npm" src="https://img.shields.io/npm/dw/payload?style=flat-square" /></a> &nbsp; <a href="https://github.com/payloadcms/payload/graphs/contributors"><img alt="npm" src="https://img.shields.io/github/contributors-anon/payloadcms/payload?color=yellow&style=flat-square" /></a> &nbsp; <a href="https://www.npmjs.com/package/payload"><img alt="npm" src="https://img.shields.io/npm/v/payload?style=flat-square" /></a> &nbsp; <a href="https://twitter.com/payloadcms"><img src="https://img.shields.io/badge/follow-payloadcms-1DA1F2?logo=twitter&style=flat-square" alt="Payload Twitter" /></a> </p> <hr/> <h4> <a target="_blank" href="https://payloadcms.com/docs/getting-started/what-is-payload" rel="dofollow"><strong>Explore the Docs</strong></a>&nbsp;·&nbsp;<a target="_blank" href="https://payloadcms.com/community-help" rel="dofollow"><strong>Community Help</strong></a>&nbsp;·&nbsp;<a target="_blank" href="https://github.com/payloadcms/payload/discussions/1539" rel="dofollow"><strong>Roadmap</strong></a>&nbsp;·&nbsp;<a target="_blank" href="https://www.g2.com/products/payload-cms/reviews#reviews" rel="dofollow"><strong>View G2 Reviews</strong></a> </h4> <hr/> > [!IMPORTANT] > 🎉 <strong>We've released 3.0!</strong> Star this repo or keep an eye on it to follow along. Payload is the first-ever Next.js native CMS that can install directly in your existing `/app` folder. It's the start of a new era for headless CMS. <h3>Benefits over a regular CMS</h3> <ul> <li>Deploy anywhere, including serverless on Vercel for free</li> <li>Combine your front+backend in the same <code>/app</code> folder if you want</li> <li>Don't sign up for yet another SaaS - Payload is open source</li> <li>Query your database in React Server Components</li> <li>Both admin and backend are 100% extensible</li> <li>No vendor lock-in</li> <li>Never touch ancient WP code again</li> <li>Build faster, never hit a roadblock</li> </ul> ## Quickstart Before beginning to work with Payload, make sure you have all of the [required software](https://payloadcms.com/docs/getting-started/installation). ```text pnpx create-payload-app@latest ``` **If you're new to Payload, you should start with the website template** (`pnpx create-payload-app@latest -t website`). It shows how to do _everything_ - including custom Rich Text blocks, on-demand revalidation, live preview, and more. It comes with a frontend built with Tailwind all in one `/app` folder. ## One-click templates Jumpstart your next project by starting with a pre-made template. These are production-ready, end-to-end solutions designed to get you to market as fast as possible. ### [🌐 Website](https://github.com/payloadcms/payload/tree/main/templates/website) Build any kind of website, blog, or portfolio from small to enterprise. Comes with a fully functional front-end built with RSCs and Tailwind. We're constantly adding more templates to our [Templates Directory](https://github.com/payloadcms/payload/tree/main/templates). If you maintain your own template, consider adding the `payload-template` topic to your GitHub repository for others to find. - [Official Templates](https://github.com/payloadcms/payload/tree/main/templates) - [Community Templates](https://github.com/topics/payload-template) ## ✨ Features - Completely free and open-source - Next.js native, built to run inside _your_ `/app` folder - Use server components to extend Payload UI - Query your database directly in server components, no need for REST / GraphQL - Fully TypeScript with automatic types for your data - [Auth out of the box](https://payloadcms.com/docs/authentication/overview) - [Versions and drafts](https://payloadcms.com/docs/versions/overview) - [Localization](https://payloadcms.com/docs/configuration/localization) - [Block-based layout builder](https://payloadcms.com/docs/fields/blocks) - [Customizable React admin](https://payloadcms.com/docs/admin/overview) - [Lexical rich text editor](https://payloadcms.com/docs/fields/rich-text) - [Conditional field logic](https://payloadcms.com/docs/fields/overview#conditional-logic) - Extremely granular [Access Control](https://payloadcms.com/docs/access-control/overview) - [Document and field-level hooks](https://payloadcms.com/docs/hooks/overview) for every action Payload provides - Intensely fast API - Highly secure thanks to HTTP-only cookies, CSRF protection, and more <a target="_blank" href="https://github.com/payloadcms/payload/discussions"><strong>Request Feature</strong></a> ## 🗒️ Documentation Check out the [Payload website](https://payloadcms.com/docs/getting-started/what-is-payload) to find in-depth documentation for everything that Payload offers. Migrating from v2 to v3? Check out the [3.0 Migration Guide](https://github.com/payloadcms/payload/blob/main/docs/migration-guide/overview.mdx) on how to do it. ## 🙋 Contributing If you want to add contributions to this repository, please follow the instructions in [contributing.md](./CONTRIBUTING.md). ## 📚 Examples The [Examples Directory](./examples) is a great resource for learning how to setup Payload in a variety of different ways, but you can also find great examples in our blog and throughout our social media. If you'd like to run the examples, you can either copy them to a folder outside this repo or run them directly by (1) navigating to the example's subfolder (`cd examples/your-example-folder`) and (2) using the `--ignore-workspace` flag to bypass workspace restrictions (e.g., `pnpm --ignore-workspace install` or `pnpm --ignore-workspace dev`). You can see more examples at: - [Examples Directory](./examples) - [Payload Blog](https://payloadcms.com/blog) - [Payload YouTube](https://www.youtube.com/@payloadcms) ## 🔌 Plugins Payload is highly extensible and allows you to install or distribute plugins that add or remove functionality. There are both officially-supported and community-supported plugins available. If you maintain your own plugin, consider adding the `payload-plugin` topic to your GitHub repository for others to find. - [Official Plugins](https://github.com/orgs/payloadcms/repositories?q=topic%3Apayload-plugin) - [Community Plugins](https://github.com/topics/payload-plugin) ## 🚨 Need help? There are lots of good conversations and resources in our Github Discussions board and our Discord Server. If you're struggling with something, chances are, someone's already solved what you're up against. :point_down: - [GitHub Discussions](https://github.com/payloadcms/payload/discussions) - [GitHub Issues](https://github.com/payloadcms/payload/issues) - [Discord](https://t.co/30APlsQUPB) - [Community Help](https://payloadcms.com/community-help) ## ⭐ Like what we're doing? Give us a star  ## 👏 Thanks to all our contributors <img align="left" src="https://contributors-img.web.app/image?repo=payloadcms/payload"/> ", Assign "at most 3 tags" to the expected json: {"id":"2886","tags":[]} "only from the tags list I provide: [{"id":77,"name":"3d"},{"id":89,"name":"agent"},{"id":17,"name":"ai"},{"id":54,"name":"algorithm"},{"id":24,"name":"api"},{"id":44,"name":"authentication"},{"id":3,"name":"aws"},{"id":27,"name":"backend"},{"id":60,"name":"benchmark"},{"id":72,"name":"best-practices"},{"id":39,"name":"bitcoin"},{"id":37,"name":"blockchain"},{"id":1,"name":"blog"},{"id":45,"name":"bundler"},{"id":58,"name":"cache"},{"id":21,"name":"chat"},{"id":49,"name":"cicd"},{"id":4,"name":"cli"},{"id":64,"name":"cloud-native"},{"id":48,"name":"cms"},{"id":61,"name":"compiler"},{"id":68,"name":"containerization"},{"id":92,"name":"crm"},{"id":34,"name":"data"},{"id":47,"name":"database"},{"id":8,"name":"declarative-gui "},{"id":9,"name":"deploy-tool"},{"id":53,"name":"desktop-app"},{"id":6,"name":"dev-exp-lib"},{"id":59,"name":"dev-tool"},{"id":13,"name":"ecommerce"},{"id":26,"name":"editor"},{"id":66,"name":"emulator"},{"id":62,"name":"filesystem"},{"id":80,"name":"finance"},{"id":15,"name":"firmware"},{"id":73,"name":"for-fun"},{"id":2,"name":"framework"},{"id":11,"name":"frontend"},{"id":22,"name":"game"},{"id":81,"name":"game-engine "},{"id":23,"name":"graphql"},{"id":84,"name":"gui"},{"id":91,"name":"http"},{"id":5,"name":"http-client"},{"id":51,"name":"iac"},{"id":30,"name":"ide"},{"id":78,"name":"iot"},{"id":40,"name":"json"},{"id":83,"name":"julian"},{"id":38,"name":"k8s"},{"id":31,"name":"language"},{"id":10,"name":"learning-resource"},{"id":33,"name":"lib"},{"id":41,"name":"linter"},{"id":28,"name":"lms"},{"id":16,"name":"logging"},{"id":76,"name":"low-code"},{"id":90,"name":"message-queue"},{"id":42,"name":"mobile-app"},{"id":18,"name":"monitoring"},{"id":36,"name":"networking"},{"id":7,"name":"node-version"},{"id":55,"name":"nosql"},{"id":57,"name":"observability"},{"id":46,"name":"orm"},{"id":52,"name":"os"},{"id":14,"name":"parser"},{"id":74,"name":"react"},{"id":82,"name":"real-time"},{"id":56,"name":"robot"},{"id":65,"name":"runtime"},{"id":32,"name":"sdk"},{"id":71,"name":"search"},{"id":63,"name":"secrets"},{"id":25,"name":"security"},{"id":85,"name":"server"},{"id":86,"name":"serverless"},{"id":70,"name":"storage"},{"id":75,"name":"system-design"},{"id":79,"name":"terminal"},{"id":29,"name":"testing"},{"id":12,"name":"ui"},{"id":50,"name":"ux"},{"id":88,"name":"video"},{"id":20,"name":"web-app"},{"id":35,"name":"web-server"},{"id":43,"name":"webassembly"},{"id":69,"name":"workflow"},{"id":87,"name":"yaml"}]" returns me the "expected json"