2 years ago, we completely replatformed Payload from an Express + React Router SPA to the Next.js App Router + RSCs.
Today, we’ve taken that a step further with framework adapters.
Payload now runs natively on both Next.js and TanStack Start.
We're pumped to announce Payload 4.0 is now available in beta, and it includes the following goodies …
◾️ Cleaner, more capable admin UI based on @figma's design system
◾️ Hierarchies as a core primitive for folders, tags, nested content structures and tree-based organization
◾️ @tan_stack support via our new framework adapter pattern
◾️ Entirely renovated & powerful MCP plugin
But we're not done yet. Stay tuned for more coming this week. In the meantime, let it rip:
npx create-payload-app@beta
Over the past 10+ months we replatformed the entirety of @payloadcms from an Express + React Router SPA to the Next.js App Router + RSCs, and tomorrow we get to finally show it off
The @payloadcms admin panel is no longer tied to Next.js 😱
With our new "framework adapter pattern", you'll be able to lift and shift onto other RSC frameworks, e.g. TanStack Start.
Next.js stays first-class, but this marks the start of an exciting new chapter.
ICYMI: You can now group by distinct fields in @payloadcms.
Suupper useful when querying large datasets.
Credit to @r1tsuu__ for the findDistinct API!
I've always wanted to fix this.
You can now toggle Live Preview in @payloadcms without losing your changes.
Sooo much better!
This is a true full circle moment for me.
My career started in design, not engineering.
During that time I’ve used every design tool out there—including Figma.
For me, learning to write code meant no design handoff. I could preserve my own design intent.
For years I was building the very software that I was designing.
That is why I put my heart and soul into Payload. To me it was always more than an application framework...it was a dev tool for backend design.
But it really only solved this problem for those like me. Developers were far more efficient, but designers would still largely work in isolation.
This is why I’m so excited to be joining Figma.
Together we can build a tool where everyone collaborates seamlessly for the entirety of the product lifecycle.
Looking back, I never imagined that I'd write more lines of code than I would edit vector graphics. But for me, design and code were never very separate to begin with.
Now they’re closer than ever.
We are so back 🔥
BIG DAY. @payloadcms has joined @figma!
We're about to take things up a notch.
So proud of what we've built, and I know where we're going... can't wait to share more.
Just merged a major performance improvement to @payloadcms that changes how we render server components within arrays and blocks.
Now, we precisely render only the rows that change instead of the entire field.
Response sizes are up to 96% smaller and requests are 75% faster!
Just released: the ability to save filters and share them across your team.
This was one of the most frequently requested features of @payloadcms.
Just added a progress bar to @payloadcms and it feels so much faster to navigate.
React Suspense is great, but it meant rendering skeleton UI for full page transitions.
This way users still get immediate visual feedback, plus the resulting page renders in its entirety.
Code-first is the new no-code
Something not talked about enough.
@payloadcms being fully configured with code means you’re really able to have AI scaffold a lot for you.
Tell Cursor the collection you want and the fields you need and you’re set.
I first started learning @reactjs about 7 years ago and @nextjs shortly after. These are two open-source projects that I greatly admire, and now @payloadcms is outpacing both of them on @github. But this is only the beginning—we have big things planned for 2025. Buckle up.
Another update for our Rising Stars: @payloadcms is now tagged as a backend / fullstack solution and has claimed the top spot in the category. Congratulations!
We are so back
Introducing Payload 3.0: The first-ever CMS that installs directly into your @nextjs app folder.
Get started with one line: pnpx create-payload-app
Over the past 10+ months we replatformed the entirety of @payloadcms from an Express + React Router SPA to the Next.js App Router + RSCs, and tomorrow we get to finally show it off