HTML -> gomponents converter tool

[maragudk]

HTML -> gomponents converter tool

[markuswustenberg]

Hi @erikd234 . I've thought about doing a converter from HTML to gomponents, but haven't tried it yet. I think that could be an interesting little project!

What I usually do when I am in this situation is to put the relevant HTML in files next to your .go component files, embed them with go:embed, and then use g.Raw to render them directly. The resulting overall component sometimes looks a bit odd, but it works just fine. Then you can selectively replace HTML with gomponents where needed.

Would that work for you?

[markuswustenberg]

Note to self: there's an HTML parser: https://pkg.go.dev/golang.org/x/net/html

[PiotrKowalski]

Hi.

I started using Gomponents with Tailwind and I started hating rewriting HTML classes into Gomponents code.
So I wrote a small helper tool. Also, I plan to add exposed api for sending files to server and returning responses via endpoint. Later I will also add CLI tool

http://htg.piotrkowalski.me/
It runs on my local computer so may not be 24/7, feel free to use it. I dont handle most of gomponents elements and attributes now. Right now, I mostly take the html node data and uppercase the first letter. The custom HTML to gomponents can be easily added. WIll do it if I come accross some problem myself.

You can check source code here
https://github.com/PiotrKowalski/html-to-gomponents

[markuswustenberg]

@PiotrKowalski , that is so super cool! :D Could you host it somewhere that can take some traffic? Then I'll link to it from the gomponents website.

[PiotrKowalski]

@markuswustenberg
Thanks for the acknowledgment

I will look into it, but for ~one week I wont be able to do anything more in this matter.
And also, it is like 0.0.1 version. I need to add more gomponents structs there. For example, I am not able to create g.Attr() node automatically right now.
This converter handles like 80% of manual labour, remaining 20% needs to be done manually by dev for now.

WIll look into hosting next week

[markuswustenberg]

@PiotrKowalski no stress, it comes up when it comes up. 😊 Let me know!

[PiotrKowalski]

Hi @markuswustenberg
I made little fixes on my tool. It should generate g.Attr and g.El for weird edge cases.
Also, I put this tool on gcloud with whole cicd pipeline.
You can get a link in the description of repository
https://html-to-gomponents-4r3ru275tq-ew.a.run.app/
For now I will keep it that way. Later I will move to better domain

[markuswustenberg]

@PiotrKowalski excellent, thank you for the update!