Enhancement: Consider htmx

[sglebs]

Is your feature request related to a problem? Please describe.

Nowadays there is an abuse of JS in pages, making maintenance more costly. htmx is a very simple and creative way to make web stuff simple and fun again: https://htmx.org/ . It would be neat if starlet-admin could be customized in simpler ways using htmx.

Describe the solution you'd like

Having htmx pre-included would allow starlet-admin to be more easily customized without JS expertise. Having the framework itself use it to simplify things would encourage users.

Describe alternatives you've considered

Doing the include by hand myself, in the templates.

Additional context
This is more of a suggestion to facilitate development to core starlet-admin devs and also for people who use it.

[hasansezertasan]

I am not sure if I understand your request correctly. Are you suggesting "dump whole js and use htmx instead, for the entire project" or "add a paramater like include_htmx to the admin class and if it's True, include htmx in any page?"

As far as I know, HTMX doesn't help you with customizing, but automates http requests with tags and place the response to the target which DataTables already does it for us.

By the way, Starlette-Admin is still customizable. You can use CustomView like any other Admin Panel.

As far as I can see, Starlette-Admin is not a mature package (against Django Admin, Flask Admin and Flask App Builder), which htmx also is. Starlette-Admin has some dependencies which includes Tabler (Bootstrap 5 with it), JQuery, DataTables (Which is awesome!), and they empower the module itself (@jowilf let me know if I'm incorrect). They all require some JavaScript knowledge but not for the users, for the developers and maintainers of the module. Users still can use HTMX which I'm planning to do so for experimental purposes.

An Admin Panel focuses on providing views with CRUDL (Create, Read, Update, Delete and List) functions, I don't think it doesn't matter how it does and what it uses as long as it gets job done in an effecient way. FastAPI Amis Admin uses Python based HTML Components and Flask Admin uses wtforms for the forms with Jinja2 Templates.

In the end, even if we use HTMX, we are still going to write some JavaScript. It's really hard to avoid JavaScript for frontend development. There are solutions like PyScript) which allows us to write python in the frontend (with Pyodide and WASM), htmx but I don't think relying on technologies that are not mature is the best way to do it. I hope in the future these technologies will improve and we can create customised solutions with only python...

@jowilf I would like you to read it and tell me if/where I'm wrong.

[sglebs]

It was just a suggestion to give you and the users potentially more productivity when customizing views with extra widgets etc (e.g. file upload).

[hasansezertasan]

Before taking a look at starlette-admin and how it works, I was considering building my own admin panel generator with htmx and pythonic html components (like FastAPI Amis Admin or Reflex). But it requires a lot of work. The way datatables handles tables is really neat, the way htmx handles http requests is really neat but I'm developing JSON APIs for most of the time and not playing with frontend. In the end I started using Starlette-Admin which is quite extensible and uses Tabler, so I can develope my components/widgets with it without extra dependencies.

In addition, creating widgets with Tabler is much easier as I can tell. But I'm not sure if HTMX helps us to build or customize Widgets. I can't see a reason to switching to HTMX completely and I can't see a reason not to use HTMX in the CustomViews. Also Starlette-Admin doesn't focused on Widgets but presenting data in a good way.

Can you share an example that demonstrates your point and how htmx makes it easier?

[sglebs]

I was thinking of building extra screens for my context, one in particular to upload a file and handle it. Then I saw the file upload in html and thought how neat/simple it is.

[hasansezertasan]

Starlette Admin already has a great file upload utility, if that's the deal. You can use SQLAlchemy File in your models to enable it.

Edit: I was playing with HTMX, it's only 14 KB and today I opened #373 Starlette Admin already renders most of the components/fields in the server side so something like htmx_row_action could be easily added here. HTMX is getting more popular every day, at least we can write a documentation about "htmx integration". What do you think about it?

[hasansezertasan]

After a while, I realized that my speaking style was not very positive. I believe it's because of my English, I'm not a native speaker. I'm sorry if I upset your mood @sglebs. 🙏

I believe HTMX would be a great deal in terms of the use of resources and I do believe that we should discuss this further. 🚀

Let me start. We still can use HTMX with Javascript and we don't need to get rid of DataTablesJS, right? 👍

[sglebs]

No worries, I have also been misinterpreted for the same reason (English as a second language). No worries ;-)

I just want to be productive and quickly add functionality. HTMX looked interesting and may facilitate certain things/implementations. But no strong attachment to it ;-)

[hasansezertasan]

Thank your for being so understanding 😇

Well, with HTMX, we can easily implement #413 🙋‍♀️

We won't have to load same resources frequently like navbar, sidebar, css and js files, this will also reduce the amount of computing power used on server side rendering and finally the navigation from one page to another will be smoother. 🚀🚀🚀

[hasansezertasan]

I've been looking at the things that involve me and starlette-admin. It's been a long time since visiting here.

@sglebs, check it out: aminalaee/sqladmin#767