As you may recall, I recently made a quick prototype of a frontend framework in Go using WebAssembly. However, the next steps involved writing quite a bit of code to actually generate and reconsile DOM changes. After studying what Vecty did, I decided I should try and use Vecty myself and see how it goes. Instead of using Vecty as made for GopherJS, today I was going to get it working compiled to WebAssembly.
Luckily, it seems good old Brian Ketelsen got the ball rolling. He started a fork of Vecty that does exactly what I theorized you could do. We talked on Twitter and on stream for a bit and he showed me his markdown demo project based on his Vecty fork. Sure enough, I ran it and it worked. That was my whole plan for the day!
So I decided to stumble on to the next thing I wanted to try with Vecty: Reimplement my Vue.js style templating, but which spits out Vecty objects. This would let you replace building HTML and rendering components with all these function helpers.
Slowly but surely I worked through all the cases in this markdown demo example: string interpolation, attribute bindings, event handlers, and component elements. Unfortunately I didn't get to a point where the whole PageView component was rendered with a single template, but I just ran out of time.
Already this is really cool and feels really good. I'm going to keep working on this template system, which by the way is an optional drop-in library. No forking or modifying of Vecty was necessary. I'm going to keep building on Vecty for as long as I can.
Latest comments (6)
How about making a new extension like what VUE does, so you can write HTML without the '' ?
I don't understand, what do you mean?
I mean, vue have this file extension '.vue' where you can write raw HTML in it and it will be auto-compiled to javascript syntax with the help of webpack or browserify. So, why not make one too in GO? It will be much easier to see, than seeing the HTML wrapped with the single quote. Maybe like '.gox' or something?
Thanks.
Oh, yes. Actually a project that does JSX style Go exists (and uses .gox), but the reason I don't like this is that it's more complex and will pollute your files with .go and .gox files. This might be acceptable for JavaScript project, but I don't find it acceptable. What's more common in Go is to have separate template files, and that's easy to do here.
With Vecty if the HTML for a component is simple enough to not warrant a separate file then you can use the functional builder API that it currently comes with.
Check out
vuegwhich usesgo generateto achieve this.github.com/norunners/vueg
I developed somethings like Jsx for go with Gox name :
github.com/pejman-hkh/gdp/tree/mai...