Anyone remember how easy it was to make a GUI program with VB back in the early 2000s? Or what made Dreamweaver the number 1 IDE? Or why 95% of websites used to be built on Wordpress. It was easy to make FRONTEND UIs. All these web frameworks are focused on making life easier for developers but are only easy to use for experts.
I think we have really taken a step backwards in most cases. Dreamweaver is dead and nodejs and all these frameworks force CLIs on us that nobody can ever remember the commands for. A single admin form with buttons would save me thousands of $ a year on just the time I have to look up CLI commands.
I was thinking that a lot of what makes Frappe and ERPNext so great is being able to quickly build lists and data models without writing a lot of code. However those who need these types of features the most are still missing the final pieces which would allow them to complete the circle. This is a problem solved by Wordpress which simplifies building sidebars and page templates with add ons such as DIVI. That is why Divid and Elementor ar 2 of the most popular plugins on the web.
My suggestion would be to implement a simple Page builder, Component builder, and Template builder addition to build custom components just as you can data models in Frappe. The difference is that here instead of building a frontend you would also use these to build backend features.
-
The Component builder lets you build content blocks by including code files and a system of linking events and actions with the data models you can already build in Frappe. This would be where all the heavy lifting is done.
-
The Template builder would let you define the layout using grid or flex box
-
The Page builder would let you drag and drop your component blocks, set a template, define a navigation position etc. much like a post or page in wordpress does.
-
You would first create your page template by drag and dropping a few layout boxes together.
-
Then you create a data model for the page/component which retrieves all the dynamic data you need.
-
Then using the HTML editor that is already implemented you design your component. Each element such as a content item, input box, image, etc would have a little settings icon appear onHover/mouseOver which is used to add actions and events. This addition would allow you to apply event handlers from a list of drop downs. Such as onLoad, onClick, onTimer etc and specify a target and the action such as submitting or loading some data.
-
The last step would be to create a page and add your components to it.
You will see in my example below that this is a very simple way to create powerful interactive apps without needing a developer to write code or templates or even worse work with some CLI 
Depending on what methods are integrated this would allow almost anyone to write apps or integrate 3rd party libraries. Many libraries such as charts only need a few variables pulled from a DB and with a code include component and a data query it would be possible to add custom components to a dashboard as well.
EXAMPLE: Creating a simple persistent/chat component.
Data Models: - user1 and user2 are the participants
- Create a query to get the /user1/chat/user2-#.json files (limited to 3) from a directory
- Create a query to get a list of all online users
- Create a query to store a message and time stamp to the newest $user2-#.json in the $user1/chat directory.
- Create a query to store a message and time stamp to the newest $user1-#.json in the $user2/chat directory.
Component Model: - Create a component with 2 columns a text area, text input field, and a button in the content div.
- Add a text list field with an onLoad event to list all online users query in the sidebar div.
- Add a onClick event to the username item setting $user2=$username.
- Add an onChange event to trigger the action to update the text area.
- Add an onClick on the button and onKeypress event to the text input to append the contents to the newest $user2.json and in the $user1/chat and $user2/chat directories.
- Add an additional event to create a new user2-#.json /user1-#.json if size > someValue.
Page: - Create a page and assign the template to it.
- Add your component to the page
- Add the page to the navigation.
This is probably not the most efficient way to implement a chat but this would only need a file io and no DB storage and by adding some conditionals could be improved and could add additional features such as converting links or mentions.
Now imagine the possibilities if instead of inserting just some text field you could include an OpenGl widget and use socket.io or webrtc interfaces to add a voice or video chat component. You could add file sharing components or just a file backup system. Project management and other business logic components might not be useful to everyone so they are unlikely to be created when there is so much coding that is required.
To be really useful you would need
- Data interfaces and Protocols built in for importing data into a component.
- Conditionals and built in functions for data manipulation and display.
- Events and Actions.
- Code and script include blocks and widgets in addition to form elements.
- Loops that you can wrap around widgets and blocks.
A lot of these things are already in Frappes framework and only need some dedicated developers to tie it all together to make it happen. I would be willing to help but my knowledge of Frappe is too limited to do it on my own in any reasonable amount of time.