<tmplx>

Write Go in HTML

• Full Go backend logic and HTML in the same file
• Reactive UIs driven by plain Go variables
• Reusable components written as regular HTML files

Demos

Counter

 <script type="text/tmplx">
  var counter int
</script>

<button tx-onclick="counter--">-</button>
<span> { counter } </span>
<button tx-onclick="counter++">+</button> 

To Do

 <script type="text/tmplx">
  var list []string = []string{}
  var item string = ""
  
  func add() {
    list = append(list, item)
    item = ""
  }
  
  func remove(i int) {
    list = append(list[0:i], list[i+1:]...)
  }
</script>

<label><input type="text" tx-value="item"></label>
<button tx-onclick="add()">Add</button>
<ol>
  <li 
    tx-for="i, l := range list"
    tx-key="l"
    tx-onclick="remove(i)">
    { l }
  </li>
</ol> 

Triangle

 <script type="text/tmplx">
  var counter int = 5
</script>

<div>
  <span> { counter } </span>
  <button tx-onclick="counter++">+</button>
</div>
<div tx-for="h := 0; h < counter; h++" tx-key="h">
  <span tx-for="s := 0; s < counter-h-1; s++" tx-key="s">_</span>
  <span tx-for="i := 0; i < h*2+1; i++" tx-key="i">*</span>
</div>