Payload CMS is all the hype nowadays in the React and Next.js development world. When I was searching for an open-sourced content management system (CMS) to build my next project. I never really thought I'd end up using Payload CMS in a production environment. I first found out about Payload CMS through reddit. It wasn't long until I began diving into the rabbit hole of comparing other CMS products to it and honestly I didn't like it at first.

So what is Payload CMS? Unlike a lot of other CMS *solutions* Payload CMS is directly installed and hosted on the frontend part of Next.js framework instead of being a separate CMS entity hosted elsewhere that is accessible via REST API and GraphQL. It's faster and won "Hype of the Year" on reddit. Seriously, if you search anything about CMS, some person probably wrote something along the lines of "OMG Payload so awesome bro.".

The bare-boney-ness UI didn't really stand out to me, alongside the seemingly daunting process of learning how to use it. Because, unlike most CMS solutions that are pretty much plug and play with all the bells and whistles ready for you to use, Payload CMS was shipped as a blank canvas. Now, what got me interested to Payload CMS was that according to the website it is a developer-first CMS solution that is native to Next.js. I'm an avid Next.js worshipper, I use it day in and day out and had developed at least 60% of my work using the framework. So if Payload CMS can make my life more efficient and easier than other CMS solutions, then I'm all for it.

From the Payload CMS official website. Showcasing the layout in white and dark mode.

Installation

The website was very clear on how to install it. I recommend that you do a clean installation instead of embedding it into an already made project. This is because I spent several hours troubleshooting routing problems. There doesn't seem to be much documentation or support when it comes to the latter option and I ended up using Claude to help me fix my routing issues. That already made me concerned about whether it was worth the effort in the first place.

Payload CMS doesn't come with a lot of features to start. To add plugins we'd need to install packages officially available on their website. Now I like the idea of having a barebone framework where you add only the features that you need. This inherently reduces file sizes and the benefits that come with it. The plugins I installed include the S3 storage adapter to enable the API for file storage, email adapters, and the rich text editor (Lexical editor). Installing these libraries weren't too much of a hassle but the instructions on the website assumed there wouldn't be any issues. However, I had to jump onto Youtube and Claude a couple of times because of version mismatches which broke the system and setup gaps which should really be in the documentation. After finding a solution to that (by literally forcing all plugin versions to the latest version) I was on my way to become a Payload CMS connoisseur.

There's a lot to like about it

There's a lot of things I enjoy when using Payload CMS. For example, the Local API made data-fetching very easy. With Payload CMS you're not accessing data from a CMS solution hosted elsewhere in the traditional sense. You are directly accessing the database. It's like removing the middle man. This, claimed by the developers of Payload CMS, is faster compared to other solutions like Directus which uses REST API SDK. I can't really confirm that at the moment but for now we'll take their word for it as it does seem faster. Though arguably it really depends on other factors such as where you host your database.

I like that Payload CMS drops you in the deep end and forces you to learn. I'm not kidding. Tinkering and experimenting around the library enabled me to better understand the system. That being said, some people would treat this as a negative. The collection system is impressive, it's much more efficient than having to click and select different fields to make a collection. In Payload CMS it's written directly into TypeScript, imported and updated almost instantaneously. Just be careful not to edit the collection fields in production as that may result in dropped data. Totally didn't experience that...

I give a thumbs up to relationships. In real life and in Payload CMS. I can see the amount of freedom this brings. Where each collection can be linked to another. As well as the ability to embed these relations inside the editor. I'd imagine myself embedding the price of a Banana on a post somewhere and I can keep it updated at one point instead of manually changing it on the text editor wherever I wrote about the pricing of it everytime. Banana prices goes up and down a lot you know!

Confused looking Fry from Futurama. Probably thinking about another Payload CMS error.

Sometimes it gives me a migraine

Only sometimes... one thing that really bothers me is how slow the page auto refreshes during development. Payload CMS compiles the website every time you change, navigate, or add something in the frontend. So you can guess the responsiveness is not something you'd expect to be amazing. I highly recommend using Turbopack that comes with Next.js as it speeds up compilation times by a lot. Still not as fast as without Payload CMS installed. Or maybe I just have a weak computer.

Payload CMS doesn't seem to like it when I try to add an error 404 page on the root of the document to cover not found errors on the website. I needed to create a root layout.tsx page for my not-found.tsx (404) page to work. However, because Payload CMS is also inside this route segment it throws a lot of undefined errors which until today I am struggling to solve. There are other bugs too, currently I am trying to fix a lexical editor error. My editors can't seem to embed hyperlinks. But it doesn't seem to throw an error. So where do we go from here?

Payload CMS doesn't have a native storage solution. You're on your own. There are good solutions such as Vercel Blob, Amazon S3 and Cloudflare R2 storage buckets. At the end of the day you'd need that setting up too, adding to the ever growing complexity of your project. Unlike Directus CMS where storage is defined in the system so it is all hosted in one central location. So the speed in accessing storage all depends on the storage host, not whether the Local API is faster than REST API.

So what's the verdict?

I get it. Payload CMS is hyped for a reason. It's a great framework and the Local API is a breath of fresh air. However, because it's still relatively new compared to other CMS solutions. It is a bit buggy. I see great potential in it but the documentations need to be more clear. I like that you can customise it anyway you like, but you're very much on your own if you get an error.

Also if you're still reading this far, I'll let you in on a little secret. This website is using Payload CMS.