Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Show HN: Puck – Open-source visual editor for React

github.com

Post reply on HN
Print view View original

51–60 of 105 posts

Re: Show HN: Puck – Open-source visual editor for React

#51

Post by chrisvxd »

chrisvxd wrote: post #50
nvegater wrote: post #42

This looks very nice ! How would you compare it with slatejs, tiptap or lexical ? Is this only for layouts but not for content ? (Would it be very hard to include some rich text and make it work like a cms with rich text editing?)

Thanks! It’s possibly I’m misunderstanding, but I believe Puck is a different problem space to the other solutions you’ve mentioned - Puck enables content teams to produce web pages using existing React components produced by their React developers in a fixed and predictable manor that keeps them within the brand guidelines. You can’t inject arbitrary blocks and can only interact with components that are defined by y…

It actually could be interesting to add tiptap for collaboration!

Re: Show HN: Puck – Open-source visual editor for React

#53

Post by mono_spaced »

MuffinFlavored wrote: post #45
chrisvxd wrote: post #32

Earlier quoted context omitted.

We don't natively support templating strings, but since it's rendered by React, you can always add that when integrating Puck. However you can use an adaptor if you need to pull data in via a third party API: https://github.com/measuredco/puck/tree/main/packages/adapto...

I was trying to give feedback on how you might make your product "more attractive"/increase value proposition to the type of person you are aiming to help this with: people who want to make a React UI through a GUI instead of in a text editor. I know how to pull data in via React/JavaScript "code". If I can do that, I'm technical enough to not need a GUI to help me make a UI... do I?

Not the OP, but our company Measured is building Puck as an open source project, so I'll try and answer.

Puck is targetted at content/CMS use cases, rather than general UI building. So the ability to establish guardrails in the editor experience is intentional. For best effect, we envisage Puck being used alongside a well-considered library of on-brand composable components. The aim is to enable non-developer editors/authors to freely update and build content, whilst keeping the UI consistent and on-brand.

This is a problem area we've encountered many times in our client work, hence why we wanted to scratch this itch.

Having said that, I do believe the Puck editor GUI _can_ be configured to work with remote data somewhat as you describe, using the adaptor linked above (but there's currently no demo for this feature).

Re: Show HN: Puck – Open-source visual editor for React

#54

Post by jameslk »

Nice, this looks pretty good.

It's always been my dream of having something like Retool, but using your own components and completely open source. Retool is a backend layer too, so that's partially what's missing to complete the picture. But if we had that as something like a framework, we'd start getting close to the days of drag-and-drop UIs.

Re: Show HN: Puck – Open-source visual editor for React

#55

Post by teddarific »

chrisvxd wrote: post #44
satvikpendem wrote: post #43

This is exactly what Framer did before pivoting to a website builder, it might be worth looking into them. How will you be different than them?

Framer is a design tool, but Puck is a content tool. We're focused on allowing content teams to create pages using existing on-brand components. Like a WYSIWYG with guard-rails. We built it because we couldn't find something that would let our clients' content teams produce content for their sites without 1) either going off-brand or 2) pestering their devs for layout changes.

Can you elaborate what you mean by "content" tool? Are your ideal users creating marketing sites, blog posts, or other?

In my experience, most of what content teams work with are some forms of CMS, and the design tools usually deal with layout and creating generic sites that work with the data structure inside the CMS.

Re: Show HN: Puck – Open-source visual editor for React

#56

Post by satvikpendem »

chrisvxd wrote: post #44
satvikpendem wrote: post #43

This is exactly what Framer did before pivoting to a website builder, it might be worth looking into them. How will you be different than them?

Framer is a design tool, but Puck is a content tool. We're focused on allowing content teams to create pages using existing on-brand components. Like a WYSIWYG with guard-rails. We built it because we couldn't find something that would let our clients' content teams produce content for their sites without 1) either going off-brand or 2) pestering their devs for layout changes.

Framer also has a CMS and you can import React components [1]. They pivoted because there wasn't much traction in that use case.

[1] https://www.framer.com/developers/#overview

Re: Show HN: Puck – Open-source visual editor for React

#58

Post by wbarber »

Exuma wrote: post #6

Awesome. I've literally been tasked with building something exactly like this, and it's a pain in the ass nothing exists like this for Vue so I have to do it from scratch. I plan to make it more like builder.io/demo however where CSS can be arbitrary, that way basic landing pages can be built. Do you have any tips of things you wish you did differently, or what was more painful than you expected, as well as anything…

Plasmic.app works with vue - why not just use that?
Post reply on HN