Hi,<p>I am a backend developer, that from time to time need to write some code on the frontend side (ReactJS). From my limited experience, I find that most of the work on the UI side is limited to fetching data from the server, handling multiple views for single-page application and writing custom component-specific logic (that is pretty well encapsulated in re-usable React components). In majority of cases, I don't even need to write new React components, but rather I re-use some that were already written by someone and just need to integrate them by writing glue-code to pass the data and handle events.<p>I wonder why nobody tried (successfully) to automate these items by creating a graphic editor. My idea would be to:<p>1. In GUI, we would select an area on the screen where new React component would be added (from a list of already available components). For the selected component, we would write a GraphQL query telling component how to fetch data that would be rendered.<p>2. Based on this, codegen would generate JavaScript with HTML. At this stage I assume we would have fully functional application (able to fetch data from the server via GraphQL).<p>3. Then we would have some ComputerVision/AI component, that would generate random CSS for the generated webpage. Next based on the screenshot and CV analysis, we would be able to do sth-like-gradient-descent approach, to get CSS, so that webpage looks very similar to what user specified in the GUI.<p>I would like to get some feedback from experienced frontend developers, why there is hardly any automation in writing web UIs. Off-course for complicated parts, developers would still need to write React components, that would take data via GraphQL.
Because your HTML generating AI framework would not be able to deal with Mandy from upper management that wants that one button to have a rounded edge in the upper right corner just like the button she saw on Bloomberg, her favorite website, they make a ton of money so there should be no reason Mandy can't have a button with a rounded edge in the upper right corner, except that your framework can't deal with questionable input from humans at which point you will try to override it with CSS and another thing and another thing and before you know it you'll have a colleague come up to your desk complaining about the fact the codebase has 4 years worth of overriding CSS spaghetti and wondering if switching to ThatOneFramework^tm he read about on hackernews the other day will solve the issue of backend/frontend integration.