GopherJS + Vue.js, hello world

Larry Clapp

unread,

Nov 25, 2015, 1:38:37 PM11/25/15

to GopherJS

I discovered GopherJS and vue.js a few days ago. Thought I'd share a "hello world" using both.

app.go:

package main

import (
  "github.com/gopherjs/gopherjs/js"
  "time"
)

func main() {
  Vue := js.Global.Get("Vue") 
  vm := Vue.New(js.M{
    "el": "#app",
    "data": js.M{
      "msg": "hello world",
      "counter": 0,
    },
  })
  
  ch := make(chan int)
  go func() {
    i := 0
    for {
      ch <- i
      i++
    }
  }()
  
  go func() {
    for i := range ch {
      vm.Set("counter", i)
      time.Sleep(time.Second)
    }
  }()
}

index.html:

<html>
  <body id="app">
    <div>{{msg}} {{counter}}</div>
    <script src="vendor/vue.js"></script>
    <script src="app.js"></script>
  </body>
</html>

Requires vue.js in ./vendor, obviously. And gopherjs, of course.

Nicolas Grilly

unread,

Nov 26, 2015, 8:41:25 AM11/26/15

to GopherJS

Nice! Thanks for sharing!

Rusco

unread,

Nov 26, 2015, 9:05:07 AM11/26/15

to GopherJS

I would say: déjà "vue": https://github.com/rusco/vue :-)

Based on on older version of vue.js

Larry Clapp

unread,

Nov 26, 2015, 10:38:48 AM11/26/15

to GopherJS

Ha! Thanks!

I searched this group for other mentions of vue.js and didn't find any.

Larry Clapp

unread,

Nov 26, 2015, 12:51:36 PM11/26/15

to GopherJS

Folks interested in Vue might also be interested in: https://github.com/Archs/js, and in particular, this: https://github.com/Archs/js/tree/master/examples/vue.

-- L

Reply all

Reply to author

Forward