OpenChakra is an open-source visual editor for React • Hacker News Board

pookeh wrote: post #43

I wish there was something like this for AntD... EDIT: Found something similar for AntD but it's only to create landing pages: https://landing.ant.design/edit/ EDIT 2: Found this also: https://www.xiaopiu.com/editor?type=project&id=5b977bf29c2a3...

While not quite the same thing, and a commercial tool, i've been using Ant for Figma [1] with a designer to prototype UIs before building them out. There are still some rough edges, but it works pretty well.

[1] -- https://www.antforfigma.com/

Re: OpenChakra is an open-source visual editor for React

#45

Post by vongomben » Thu, Feb 13, 2020, 2:10 PM UTC

moksly wrote: post #39

biermic wrote: post #35

I'm having trouble understanding for whom this is is built. Obviously not for me, but what's the problem that editor is solving?

I work in the public sector where hordes of MBA types have gotten into digitisation in recent years. I throughly believe we’ll see more and more tools that don’t require an actual developer, because there is just a huge market for it.

Yes. To what level then? I guess node-red is actually fulfilling that gap.

Re: OpenChakra is an open-source visual editor for React

#46

Post by malkia » Thu, Feb 13, 2020, 2:20 PM UTC

skrebbel wrote: post #6

malkia wrote: post #4

Other chakras :) - https://github.com/microsoft/ChakraCore and https://github.com/chakra-ui/chakra-ui ;)

You clearly didn't dive very deep before writing this comment, or you'd have noticed that this is a UI editor for your second link. The deprecated, maintenance-mode JS engine is unrelated though. Terrible.

Oh, you are right! I knew about ChakraCore for a long time, and out of curiousity searched for other projects like it. Sorry about it!

Re: OpenChakra is an open-source visual editor for React

#47

Post by nexuist » Thu, Feb 13, 2020, 2:30 PM UTC

Dirak wrote: post #3

As an engineer who works on design systems for a living, I have to say I'm thoroughly impressed with Chakra UI. Its implementation is refreshingly simple and support for generally overlooked things like color theming and responsiveness is generally really well done. Props to the devs for building this -- the care and attention to detail definitely shows.

The devs may have props, but how do they handle state?

Re: OpenChakra is an open-source visual editor for React

#48

Post by dkrvt » Thu, Feb 13, 2020, 2:37 PM UTC

statictype wrote: post #14

Is there any toolkit available that lets you build a UI editor like this? We would like to ship a UI editor with our product that lets you define simple UIs that serialize to json/xml but are hesitant because of the effort required and resources at hand.

You could try WordPress' block editor, Gutenberg [1]. Although not a toolkit it's an extremely customizable UI editor. From within the editor you can create "Reusable Blocks" that are instances of blocks ready to be reused.

[1] https://wordpress.org/gutenberg/

Re: OpenChakra is an open-source visual editor for React

#49

Post by sixQuarks » Thu, Feb 13, 2020, 2:42 PM UTC

biermic wrote: post #35

I'm having trouble understanding for whom this is is built. Obviously not for me, but what's the problem that editor is solving?

I too don't get who the target market is. To really take advantage of this editor, the user has to already be familiar with React. Why not just go the extra step and learn React?

And if the user is not familiar with React, I feel like this tool will be frustrating to use.

Re: OpenChakra is an open-source visual editor for React

#50

Post by btown » Thu, Feb 13, 2020, 2:54 PM UTC

nexuist wrote: post #47

Dirak wrote: post #3

As an engineer who works on design systems for a living, I have to say I'm thoroughly impressed with Chakra UI. Its implementation is refreshingly simple and support for generally overlooked things like color theming and responsiveness is generally really well done. Props to the devs for building this -- the care and attention to detail definitely shows.

The devs may have props, but how do they handle state?

useReducer? I hardly even know ‘er!