Posted at
OpalDay 5

Hyalite 2016

More than 1 year has passed since last update.

この記事はOpal Advent Calendar 2016の5日目の投稿として書いています。

今日はこのアドベントカレンダーですっかりおなじみになったHyaliteについて近況を報告しようと思います。

なんか自分のgemばかり紹介するアドベントカレンダーになってしまっていますが、他に書くひとがいないのでしょうがないですね。

明日のyharaさんの記事に期待しましょう。

Opalのいろいろなgemを紹介したりしたいのですが、台湾での発表の熱があるうちにこの辺りのことを書いておこうと思います。

ここまで書いて、旅行つかれにより寝落ちました。公開遅れてすいません。yharaさんの記事ももう公開されていますね (> <)

さてHyaliteのアップデートですが、とはいえそれほど大きなアップデートがあったわけではありません。



  • force_updateメソッドが追加されました。38d4119f


  • renderするだけのコンポーネントを簡単に書けるようになりました。610bf23f


  • classforといったプロパティはclassName,htmlForなどのようにキーワードと被らないような名前を使っていましたがそのままの名前でも使えるようになりました。0c4b0dd7


  • Hyalite::Component::ShortHandppメソッドを追加しました。(pメソッドは<p>タグを表すために使われているためKernel#pはシャドウされてしまっています。) cfc8b999


  • initial_statestateでDSL的に宣言できるようなり、stateの参照方法もメソッドとして呼びだせるようになりました。4e02842e


  • Hyalite::Component::ShortHandincludeしなくてもよくなりました。cf6e9276,6f4e2266

記述方法が多少短かく書けるようになったとかそんな感じです。

結果、READMEに書かれていたサンプルは以下のように書けるようになりました。

require 'hyalite'

require 'browser/interval'

class ExampleView
include Hyalite::Component

state :count, 0

def component_did_mount
every(5) do
@state.count += 1
end
end

def render
div({class: 'example'},
h2(nil, @props[:title]),
h3(nil, "count = #{@state.count}")
)
end
end

$document.ready do
Hyalite.render(Hyalite.create_element(ExampleView, {title: "Hyalite counter example"}), $document['.container'])
end