Chris Villa
@chrisvilla.bsky.social
Building @puckeditor.com and @measured.co
probably the coolest bit of tech I've ever built
November 11, 2025 at 12:16 PM
probably the coolest bit of tech I've ever built
what if you could infinitely extend your page builder for the perfect experience?
sneak peak of Puck's dedicated new plugin ui 👀
sneak peak of Puck's dedicated new plugin ui 👀
July 10, 2025 at 11:54 AM
what if you could infinitely extend your page builder for the perfect experience?
sneak peak of Puck's dedicated new plugin ui 👀
sneak peak of Puck's dedicated new plugin ui 👀
Overrides are probably one of Puck's most powerful features, letting you add custom UI to the Puck interface ⚡️
Say you have a long list of components and need to filter them. Puck doesn't come with search, but it's easy to add one using the "components" override.
Say you have a long list of components and need to filter them. Puck doesn't come with search, but it's easy to add one using the "components" override.
July 1, 2025 at 12:04 PM
Overrides are probably one of Puck's most powerful features, letting you add custom UI to the Puck interface ⚡️
Say you have a long list of components and need to filter them. Puck doesn't come with search, but it's easy to add one using the "components" override.
Say you have a long list of components and need to filter them. Puck doesn't come with search, but it's easy to add one using the "components" override.
🔍 Easily overlooked feature in Puck 0.19: the new `trigger` parameter to resolveData that provides context about why it was called.
This enables you to customise the behaviour of resolveData based on the context, like avoiding expensive async calls.
Neat!
Docs: puckeditor.com/docs/api-ref...
This enables you to customise the behaviour of resolveData based on the context, like avoiding expensive async calls.
Neat!
Docs: puckeditor.com/docs/api-ref...
June 26, 2025 at 11:21 AM
🔍 Easily overlooked feature in Puck 0.19: the new `trigger` parameter to resolveData that provides context about why it was called.
This enables you to customise the behaviour of resolveData based on the context, like avoiding expensive async calls.
Neat!
Docs: puckeditor.com/docs/api-ref...
This enables you to customise the behaviour of resolveData based on the context, like avoiding expensive async calls.
Neat!
Docs: puckeditor.com/docs/api-ref...
If you're implementing RBAC, then Puck's permissions API can help you lock things down! 🔒
For example, specifying `delete: false` will prevent the user from deleting components.
You can do this globally, per-component, or dynamically based on current props.
Docs: puckeditor.com/docs/integra...
For example, specifying `delete: false` will prevent the user from deleting components.
You can do this globally, per-component, or dynamically based on current props.
Docs: puckeditor.com/docs/integra...
June 25, 2025 at 11:09 AM
If you're implementing RBAC, then Puck's permissions API can help you lock things down! 🔒
For example, specifying `delete: false` will prevent the user from deleting components.
You can do this globally, per-component, or dynamically based on current props.
Docs: puckeditor.com/docs/integra...
For example, specifying `delete: false` will prevent the user from deleting components.
You can do this globally, per-component, or dynamically based on current props.
Docs: puckeditor.com/docs/integra...
Puck's new slots API is mind-blowingly powerful 🤯
The demo "template" component combines:
- a slot field for the content
- a custom field to select/save the slot data
- the resolveData API to load the slot data
Slot docs: puckeditor.com/docs/api-ref...
The demo "template" component combines:
- a slot field for the content
- a custom field to select/save the slot data
- the resolveData API to load the slot data
Slot docs: puckeditor.com/docs/api-ref...
June 24, 2025 at 5:42 PM
Puck's new slots API is mind-blowingly powerful 🤯
The demo "template" component combines:
- a slot field for the content
- a custom field to select/save the slot data
- the resolveData API to load the slot data
Slot docs: puckeditor.com/docs/api-ref...
The demo "template" component combines:
- a slot field for the content
- a custom field to select/save the slot data
- the resolveData API to load the slot data
Slot docs: puckeditor.com/docs/api-ref...
If you need to customise action bar in Puck, you can use the `actionBar` override!
Combine this with the <ActionBar> component to extend the interface with custom actions and other behaviours.
Combine this with the <ActionBar> component to extend the interface with custom actions and other behaviours.
June 19, 2025 at 2:26 PM
If you need to customise action bar in Puck, you can use the `actionBar` override!
Combine this with the <ActionBar> component to extend the interface with custom actions and other behaviours.
Combine this with the <ActionBar> component to extend the interface with custom actions and other behaviours.
One of my favourite new features in Puck 0.19 is the useGetPuck hook.
It lets you access the internal Puck API without triggering a re-render. Great for performance!
It lets you access the internal Puck API without triggering a re-render. Great for performance!
June 18, 2025 at 4:40 PM
One of my favourite new features in Puck 0.19 is the useGetPuck hook.
It lets you access the internal Puck API without triggering a re-render. Great for performance!
It lets you access the internal Puck API without triggering a re-render. Great for performance!
Little demo showing Puck changing the fields based on whether the parent uses CSS Grid.
Notice how the grid fields are removed from the layout section when moving the card.
You can achieve this using the "parent" param provided to the resolveFields API.
Docs: puckeditor.com/docs/api-ref...
Notice how the grid fields are removed from the layout section when moving the card.
You can achieve this using the "parent" param provided to the resolveFields API.
Docs: puckeditor.com/docs/api-ref...
June 18, 2025 at 11:19 AM
Little demo showing Puck changing the fields based on whether the parent uses CSS Grid.
Notice how the grid fields are removed from the layout section when moving the card.
You can achieve this using the "parent" param provided to the resolveFields API.
Docs: puckeditor.com/docs/api-ref...
Notice how the grid fields are removed from the layout section when moving the card.
You can achieve this using the "parent" param provided to the resolveFields API.
Docs: puckeditor.com/docs/api-ref...
Mind blown by the 10x performance improvement in Puck 0.19. I knew it would be good, but this far exceeds my expectation!
June 5, 2025 at 12:11 PM
Mind blown by the 10x performance improvement in Puck 0.19. I knew it would be good, but this far exceeds my expectation!
Back in Sept 2023, I announced Puck on Hacker News and went from 6 to 1.7k stars in 24 hours.
Now approaching 7k, I'm on a mission to hit 10k!
I can’t do this alone. If you love Puck please:
Upvote on HN: news.ycombinator.com/item?id=4411...
Star the repo: github.com/puckeditor/p...
Thank you! 🙏
Now approaching 7k, I'm on a mission to hit 10k!
I can’t do this alone. If you love Puck please:
Upvote on HN: news.ycombinator.com/item?id=4411...
Star the repo: github.com/puckeditor/p...
Thank you! 🙏
May 28, 2025 at 2:38 PM
Back in Sept 2023, I announced Puck on Hacker News and went from 6 to 1.7k stars in 24 hours.
Now approaching 7k, I'm on a mission to hit 10k!
I can’t do this alone. If you love Puck please:
Upvote on HN: news.ycombinator.com/item?id=4411...
Star the repo: github.com/puckeditor/p...
Thank you! 🙏
Now approaching 7k, I'm on a mission to hit 10k!
I can’t do this alone. If you love Puck please:
Upvote on HN: news.ycombinator.com/item?id=4411...
Star the repo: github.com/puckeditor/p...
Thank you! 🙏
Just merged Puck's massive (7,000 line change) Zustand state migration, eliminating almost all unnecessary re-renders.
Selectors also coming soon to `usePuck`, so your own Puck components can remain performant, too!
Selectors also coming soon to `usePuck`, so your own Puck components can remain performant, too!
March 19, 2025 at 1:20 PM
Just merged Puck's massive (7,000 line change) Zustand state migration, eliminating almost all unnecessary re-renders.
Selectors also coming soon to `usePuck`, so your own Puck components can remain performant, too!
Selectors also coming soon to `usePuck`, so your own Puck components can remain performant, too!
Wow, what a great early Christmas present! Puck is featured in React Status' Top Repos of the Year! 🎄
react.statuscode.com/issues/411
react.statuscode.com/issues/411
December 18, 2024 at 7:24 PM
Wow, what a great early Christmas present! Puck is featured in React Status' Top Repos of the Year! 🎄
react.statuscode.com/issues/411
react.statuscode.com/issues/411
IT'S ALIVE! Giving Puck's new drag-and-drop engine canary a whirl on the @measured.co site!
November 23, 2024 at 6:36 PM
IT'S ALIVE! Giving Puck's new drag-and-drop engine canary a whirl on the @measured.co site!
Getting to the bottom of traffic spike mysteries is always fun... @puckeditor.com is currently featured on the madewithreactjs.com homepage! 📈
November 15, 2024 at 9:20 AM
Getting to the bottom of traffic spike mysteries is always fun... @puckeditor.com is currently featured on the madewithreactjs.com homepage! 📈
Well isn't that virtual lanyard just the cutest 😍
Got my in-person ticket for @nextjs.org conf!
Hit me up if you want to talk @puckeditor.com ✌️
Got my in-person ticket for @nextjs.org conf!
Hit me up if you want to talk @puckeditor.com ✌️
September 19, 2024 at 8:30 PM
Well isn't that virtual lanyard just the cutest 😍
Got my in-person ticket for @nextjs.org conf!
Hit me up if you want to talk @puckeditor.com ✌️
Got my in-person ticket for @nextjs.org conf!
Hit me up if you want to talk @puckeditor.com ✌️
Didn’t realise how much I missed this city
September 13, 2024 at 9:34 PM
Didn’t realise how much I missed this city
how does this happen
September 12, 2024 at 5:45 PM
how does this happen
_sigh_ time to pop the standing desk
September 10, 2024 at 11:19 AM
_sigh_ time to pop the standing desk
Fun little debug mode I built as part of @puckeditor.com's new DND engine.
Red lines show possible candidates. Green lines show mostly likely candidates.
It chooses a candidate based on midpoint and direction.
This is an inline CSS grid example. All completely inline - no wrapping elements.
Red lines show possible candidates. Green lines show mostly likely candidates.
It chooses a candidate based on midpoint and direction.
This is an inline CSS grid example. All completely inline - no wrapping elements.
September 3, 2024 at 3:59 PM
Fun little debug mode I built as part of @puckeditor.com's new DND engine.
Red lines show possible candidates. Green lines show mostly likely candidates.
It chooses a candidate based on midpoint and direction.
This is an inline CSS grid example. All completely inline - no wrapping elements.
Red lines show possible candidates. Green lines show mostly likely candidates.
It chooses a candidate based on midpoint and direction.
This is an inline CSS grid example. All completely inline - no wrapping elements.
Every day we get a little closer to launching viewport switching for @puckeditor.com with full iframe support! ✨
February 29, 2024 at 2:26 PM
Every day we get a little closer to launching viewport switching for @puckeditor.com with full iframe support! ✨
Another crazed attempt to keep the dog off the couch
August 13, 2023 at 9:45 PM
Another crazed attempt to keep the dog off the couch
