Live data from Hacker News

Show HN: A Visual IDE for React

dev.aspect.app

31–40 of 148 posts

Re: Show HN: A Visual IDE for React

#31
post #20

I'm a bit fed up with those "IDE" for web attempts. Every 9 Month or so , we get a new attempt at fixing Web Dev lack of Visual Feedback and productivity issues. The typical coder behind this type of project get "Mental Fatigue/ Coder Exhaust" after 6 Months as they generally ignore the complexity behind building such product and end up abandoning the project.... There is a google graveyard , but we should also build…

Do you also have concrete criticism of this project or just generic general complaints about the topic? Yes, there are many attempts trying to fix the problem, that designing requires coding and yes, that is a very, very hard problem to do right. But just shitting on something because you feel bitter about the topic (or whatever your motivation is) probably won't lead to anything interesting.

Well, is says that the website itself was build by the tool. Non-semantic tags, divs instead of links, buttons instead of links, a lot of inline styles (which is a bad practice), deep nesting. So inline styles will make caching css impossible, so high load times, not good for performance. Deep nesting makes the problem even worse. So the result is a slow bloated inaccessible code, but the result may look ok. If all you want is a pretty picture - than yeah, it is a great tool.

I prefer this approach - https://github.com/seek-oss/playroom Just create your components and add them to the sandbox and allow your designers to play with them.

Re: Show HN: A Visual IDE for React

#32

Hey, well done for getting something functional working and in the public eye. > I made this because building UIs in a lexical medium like code is super annoying. I have to pre-render what I’m making in my head I'd call the pre-rendering in your head a benefit, tbh. Also.. watching your vid, the property editor being "far away" from the selected item renders this tool much less useful to me than writing code. My eyes…

> I strongly dislike Tailwind and similar tools because they prevent this kind of coding/debugging

No they don't? I use the inspector all the time to figure out what values to set. Granted, I then translate those to Tailwind in my head, so there is an extra step compared to directly copying the style but that's a very small price to pay for all the advantages that I get from Tailwind.

Re: Show HN: A Visual IDE for React

#33

Look promising, but just logged in and poked around and couldn't figure out how to get elements on the canvas. Or do much of anything. Some of the interaction design seems quite odd and difficult to use (eg. all the sidebar accordions open on hover rather than on click. And clicking on elements in the "insert" dropdown doesn't insert them.). Apologies for jumping to critical feedback! Rough prototypes are rough for g…

I really appreciate the feedback, thanks! Talking to designer friends and updating UX as we speak, based on this.

Re: Show HN: A Visual IDE for React

#35
post #20

I'm a bit fed up with those "IDE" for web attempts. Every 9 Month or so , we get a new attempt at fixing Web Dev lack of Visual Feedback and productivity issues. The typical coder behind this type of project get "Mental Fatigue/ Coder Exhaust" after 6 Months as they generally ignore the complexity behind building such product and end up abandoning the project.... There is a google graveyard , but we should also build…

It's not just fatigue. I also have such a project. It allows you to build using bootstrap, but with expressions, loops, conditions and a data store. It would be pretty easy to make a Vue version of it. It's a structural editor though, but it offers a graphical preview with limited interaction. But it's not good enough for the general public, and I'm not going to finish it, only to see the project linger somewhere in a obscure corner of the internet, or –worse- attract some attention and get a bunch of idiots making demands and threats.

Re: Show HN: A Visual IDE for React

#36
No design principle, no explicit constraints on code base, no explicit supported scope.

Surely there is some kind of React component that won't work well with this, the unsuspecting will discover this too late.

Re: Show HN: A Visual IDE for React

#38

This isn't shown in the video, but does your editor comes with pre-set "styles" or is it something that you would import yourself ? My experience is that typing the code for components nesting inside components is not really the big hurdle when designing React views ; rather, it's getting the "layout" part of the css right. The big value in the video seems to be the simple fact that you have a "Form" parent component…

I set up super minimal preset styling, and yeah I think basic css import makes sense as a next feature. Hoping to avoid overly complex style inheritance.

I 100% agree, getting layout css right is the most annoying part of styling. I’m inspired by Apple’s stack views and Figma’s auto layout which make it a lot more intuitive so I think those can be the first “Aspect components” that will come out on next release.

Thanks for the feedback!

Re: Show HN: A Visual IDE for React

#40
First, congrats to your new project! Secondly, although it's not for react, but that's exactly the same reason why I have developed http://liveditor.com some years ago! The idea was that the css inspector/tweaker and the code editor should be combined together and working together seamlessly.

PS, I know the software might have some little issues but I'm going to update it soon ;)

Post reply on HN