Convert HTML to Dash

Hello!
I’ve been using dash for a while now and it is becoming one of my go to library for many usecases.
I have used html and css a bit before coming to dash and so, I felt at home with the dash layout since it’s html, but written in python.

But here are some issues I have been facing.

  • I cannot copy paste html examples from web, especially when using some external css libraries
  • Larger layouts were becoming too skewed to the right when written in python
  • I felt, writing layout in html is still better, but i’d like to use the interactivity that dash provides.

So I have been trying to write a package (GitHub - idling-mind/html2dash: Convert an html layout to an equivalent dash layout) which tires to solve this. The idea is to write the layout still in html. Also, along with regular html tags, you can use dash specific tags also. For eg: you could use <Badge>hello</Badge> to render a badge from from dash_mantine_components.

Details are in the repo’s readme. Also there is an example where I tried to copy paste the html from Tabler Dashboard UI Kit - Bootstrap Admin Panel to see if it rendered properly. (more or less! svgs and some input tags did not render, i switched some with other dash tags)

I’d like to know from the community if this is a worthwhile pursuit? Does this make your life easier? or is it better to write the layout in python itself?

1 Like

hi @idling-mind
This is cool. I like the thought process behind this repo. Personally, I don’t think I would use it since the layouts I create are not too long and I got into Dash for the specific reason of not wanting to write html.

That said, I can definitely see people using this library if their layouts are very long or if they already know html and feel stronger with that language.

I look forward to reading what other community members think.

Thanks @adamschroeder for your comment. Yeah, I myself won’t use it for smaller layouts.