Riot.jsチュートリアルを実際に触ってみた

はじめに

Reactを学習する流れの中でRiot.jsが候補として出てきました。
今回はほぼ静的なサイトをコンポーネントを意識して書きたいとおもったのでRiotを使ってみたいと考えました。
そのためこちらのチュートリアルをやってみたのでその感想を書きます。

Riotの特徴

これとかこれを読めばほとんど書いてあるのですが、

1コンポーネント1ファイルつまり1つのファイルにHTML/CSS?JSを書いていきます。

やってみて思ったこと

これを参考にコンポーネントを一つ追加してみました。

チュートリアルをそのままやっただけですが、
以下のようなメリットがあると思いました。

• scoped便利
• コンポーネント必然的に意識。ローカルに書ける(BEMとかSMACSSとはなんだったのか・・)
• ループがすぐできる
• 学習コストがめっちゃ低い(Reactは色々学ばないといけなかったが、Riotはチュートリアル一通りやっただけで大体わかった気分に)

他にもHTMLっぽく書くだけじゃなくて、CoffeeやJadeも使えるみたいで書きやすそうな印象を受けました。

またこの記事にもあるように、
HTML/CSS部分がView、JavaScriptがController、Ajax通信部分がModelとはっきりと役割と分けられるというところが便利だと思いました。

まとめ

これだけミニマムなライブラリなのに自分がほしいなと思う機能はだいぶ揃っているなとおもいました。
コンポーネントを意識してCSSを組んでいましたが気軽にRiot.jsを導入するくらいのほうが長持ちするコンポーネントを作成できるかもしれないなと思いました。

NextStep

まだチュートリアルにちょっと毛を生やした程度しかやっていないですが、なかなか便利そうなので

• 静的なサイトをもう少しつくりこんでみる(Webサイトをコンポーネントを意識した状態で作ってみる)
• サーバーサイド(Rails)と連携してみる
• superagent使ってみる
• Fluxしてみる このあたり読んでみる

といったこともやってみようとおもいます。