Utopia, a visual design tool for React, with code as the source of truth
121–130 of 175 posts
Re: Utopia, a visual design tool for React, with code as the source of truth
#122To me this editor gets it right in the sense that we don’t need to get rid of code as the “nocode” movement is trying. Instead we need to make coding more enjoyable and figure out ways to make it more interactive. One specific thing Utopia addresses to me is the need for the code and the actual thing to be treated more as one single interactable component and not two separate things. Instead we're treating the thing…
Honestly, this isn't the reason. The reason for the nocode movement is that businesses are sick of constantly trying to find technology talent for big salaries, and want to DIY. I cast no judgement on whether that's going to be a disaster or not, or for whom.
Re: Utopia, a visual design tool for React, with code as the source of truth
#123Earlier quoted context omitted.
Delphi gang here! Encountered Delphi as a kid by accident, and playing with that first form was a life changing event for me: realizing that I can make something new, real, tangible, that I'm in control. Coming from a non-tech family/background, this was big for me, I don't think I'd have gone into tech if not for it.
As a kid (and adult) you need to see some immediate tangible result of your virtual labor.
Re: Utopia, a visual design tool for React, with code as the source of truth
#124Looks nice! It seems that any "logic" (conditionals, iterators, etc) in the components will prevent the component (and their children) from being inspectable. Is the intent to keep it "no-code" in this respect (i.e. effectively a visual JSX editor), or will you be adding the ability to inspect more "dynamic" components to make it useful for app development?
Our goal isn't a no-code tool, but rather an editor that provides the tools for both developers and designers. We're iteratively improving the level of complexity of code that we can fully parse and expose to the rest of the editor, so you can expect these kinds of cases to become fewer and far between over time. If you do have specific cases that you come across and are interested in following the development or jus…
I've been working on a React/JSX wrapper for OpenJSCAD (a solid CAD library), where the "viewer" (that shows the rendered model) offers simple interactivity that is decoupeled from the code. It would be amazing if that could be extended to allow for editing the code when you interact with parts of the model in the viewer (as you would do in traditional CAD programs).
Re: Utopia, a visual design tool for React, with code as the source of truth
#125Re: Utopia, a visual design tool for React, with code as the source of truth
#126Re: Utopia, a visual design tool for React, with code as the source of truth
#127Re: Utopia, a visual design tool for React, with code as the source of truth
#128Earlier quoted context omitted.
Right. We gave a lot of thought (and iterations...) to why those tools felt like they are holding developers back instead of making them faster, and why were they ultimately abandoned. We believe the answer is that one-way code generation is a trap: if you export code from a tool which cannot be edited by a human and then read back into the tool, it is going to end up being edited by a human anyways, but the tool wil…
I think tools like Dreamweaver and FrontPage ultimately failed due to many factors. By respecting the existing code you address one. Other is that CSS can be shared between unrelated elements and cascading. FP and Dw worked pretty well for HTML where the looks of the elements were determined by their properties. Once CSS showed up they tried to adjust by encoding same things in inline styles of the elements. There wa…
Wrt the VS Code plugin, it was an idea we were toying with. Ultimately we decided to go with a standalone editor because we didn't want to limit our market and run the risks involved with coupling our existence to them. That being said, a VS Code plugin is absolutely in our future and something we would want.
You're absolutely right that by targeting React we are mitigating some of those issues you've mentioned, but they are still issues that we still need to address, so we do need to adjust or introduce further tooling. All of these things are on our roadmap, but we're a small team so it's a case of prioritising, which is where comments like this come in to play as they help us add weight to those priorities.
We've got a long way to go, but thoughtful and constructive comments like these help us immensely along the way :)
Re: Utopia, a visual design tool for React, with code as the source of truth
#129Product designer here. I just spent the past few hours fine-tuning some visual details in our Figma component library. Now I need to file tickets for each change and work with our frontend developers to make sure the updated Figma details get properly mapped over to React. I've grown numb to the friction, but I think this Utopia demo just reset my pain tolerance. Going back to manually mapping designs from Figma mock…
Re: Utopia, a visual design tool for React, with code as the source of truth
#130Earlier quoted context omitted.
I think tools like Dreamweaver and FrontPage ultimately failed due to many factors. By respecting the existing code you address one. Other is that CSS can be shared between unrelated elements and cascading. FP and Dw worked pretty well for HTML where the looks of the elements were determined by their properties. Once CSS showed up they tried to adjust by encoding same things in inline styles of the elements. There wa…
Thank you for taking the time to write this! Wrt the VS Code plugin, it was an idea we were toying with. Ultimately we decided to go with a standalone editor because we didn't want to limit our market and run the risks involved with coupling our existence to them. That being said, a VS Code plugin is absolutely in our future and something we would want. You're absolutely right that by targeting React we are mitigatin…