GopherJS で hyperapp.js.org っぽい事をするライブラリ作った
読了まで：約2分
それが
- https://github.com/nyarla/hyperdomo
これは何か
[[JavaScript]] の
[[React]] + [[Redux]] っぽい事を する alternative framework に、 https://hyperapp.js.org/
と
- https://github.com/nyarla/hypercode
と
使い方
README.md から
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>hyperdomo example</title>
</head>
<body>
<main></main>
<script src="./_examples.js"></script>
</body>
</html>
package main
import (
"errors"
"fmt"
"github.com/nyarla/hypercode/describers"
"github.com/nyarla/hyperdomo/app"
. "github.com/nyarla/hyperdomo/dsl"
)
type State struct {
value int64
}
func (s *State) Update(name string) error {
switch name {
case `up`:
s.value = s.value + 1
case `down`:
s.value = s.value - 1
default:
return errors.New(`invalid action name.`)
}
return nil
}
func (s *State) Widget() describers.Describer {
return W(func() describers.Describer {
text := fmt.Sprintf(`count: %d`, s.value)
return T(text)
})
}
func main() {
state := new(State)
view := H(`main`,
H(`p`, state.Widget()),
H(`button`, T(`UP`), E{`onclick`: `up`}),
H(`button`, T(`DOWN`), E{`onclick`: `down`}),
)
mainApp := new(app.Application)
mainApp.EntryPoint = `main`
mainApp.View = view
mainApp.Actions = app.Actions{
`up`: func() { state.Update(`up`) },
`down`: func() { state.Update(`down`) },
}
mainApp.Mount()
}
な
- https://github.com/nyarla/hyperdomo/tree/master/_examples
に
hyperdomo の良い点
- hyperscript-like な
DSL で Golang で Web Application を 書ける - State の
型を 自由に 設計出来る - JavaScript を
基本書かなくて 良いし、 また Isomorphic Goalng が 出来る
hyperdomo のイマイチな点
テストが書かれていない (特にブラウザ環境での)
生成する JavaScript の code がデカい (minified するといくらかマシ)
- そのため、
ファイル容量的には あんまり 効率が 良くない
hyperdomo を作るに至った経緯
もともと、
GAE/Go で
Static な Assets を 扱うのが 面倒で ござる ～
と
- https://github.com/nyarla/hypercode
と
あ、
これ、 もう ちょっと 加工すれば、 [GopherJS 向けの [[仮想 DOM]] っぽい [[ライブラリ]] 作れるんじゃね？ ]
と
それで、
morphdom の
Bindings を hyperdomo の 中で 作り、 それに golang.org/x/net/htmlから生成した HTML テキストを ベースに、 現在の DOM に patch を 当てる
みたいな
で、使うの？
一応、
以上
とり
