jowilf / starlette-admin

Fast, beautiful and extensible administrative interface framework for Starlette & FastApi applications
https://jowilf.github.io/starlette-admin/
MIT License
528 stars 55 forks source link

Enhancement: Consider htmx #300

Closed sglebs closed 7 months ago

sglebs commented 9 months ago

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 commented 8 months ago

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 commented 8 months ago

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 commented 8 months ago

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 commented 8 months ago

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 commented 8 months ago

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?