これぐらいでイイ これぐらいがイイ Riot.js - A Memorandum
Riot.js(ライオット) とは 簡単なサンプル マウント ループ Conditional expressions イベント Named elements タグのネスト update unmount yield Observable Router まとめ Riot.js(ライオット) とは React と Polymer のコンセプトをすごくシンプルに体現したUIライブラリです(Riot 2.0)。 公式サイトでは大きく以下が挙げられています。 CUSTOM TAGS ENJOYABLE SYNTAX VIRTUAL DOM TINY SIZE しかし、一番のポイントは、「Small learning curve」 ではないでしょうか。 公式サイトの短いガイドをななめ読みしただけで、それなりに使えてしまいます。 乱立するフロントエンドライブラリの中で、これほど学習曲線が小さなものってちょ
Riot.jsとフォームのデータバインディング
Riot 勉強会 #2 の資料です。 http://runstant.com/imakei/projects/36b64780Read less
phiary
先日書いた 『Electron の入門エントリー』 が好評だったので私の大好きな Riot.js の入門も書いてみました. AngularJS や React でもいくつか Web アプリケーション作ってきましたが, 私にとっては Riot.js が一番しっくりきました. なので今回は Riot.js について紹介します. とにかく詳しい説明はいいから触って試してみたいって方はぜひ読んでみてください. Runstant を使ったデモを並べているので, このページ上で実行したりコードをいじることができます. 実際に動かしながら, Riot.js がどれだけ使いやすいか体感してみてください♪ Riot.js とは？ 今のところ私にとって(使いやすさ, 手軽さ, 規模感総合して)最も優れた JavaScript フレームワークです. 主な特徴 個人的に Riot.js でいくつかサービス作ってき
Riot.jsのv2からv3でいろいろ修正・変更されたもの - Qiita
Riot.js Advent Calendar 2016の9日目です！ Riot.js（以下riot）は非常にシンプルかつ軽量で敷居も低く、とても書きやすいコンポーネント指向のUIライブラリです。（ここまでテンプレート） v2からv3への移行する際の注意点 公式サイトのMigration from riot 2に詳細な内容が書かれていますので、そちらを読んでいただく方が早いと思いますので、ここでは単に列挙だけします。 （※日本語訳も出てます！） riot-tag属性の廃止、data-is属性を使う data-isはネストしたタグでも使用可能 また動的なテンプレート変数(expression)にも対応 スペースが入ったobservableのイベントは動作しない id, name属性でのDOMの参照を廃止、ref属性を使う 参照する場合はthis.refs.hogeと書く（後でもうちょっと触れ
jQuery使いがRiot.jsを使ってみた話 - Qiita
この記事はRiot.js Advent Calendar 2016の13日目の記事です。 前日の方と同じようなテーマになってしまって申し訳ないです！ 普段はCakePHPでのサイト構築やNode.jsでWebAPIプログラムを書いたりしてます。 フロントではjQueryしか使わない、JavaScriptフロントエンドライブラリ経験1ヶ月程度のゆるふわな感想ですので、生暖かく見守っていただければ幸いです。 きっかけ Node.jsで動いてるWebAPI(戻りはJSON)をWebブラウザでモニタリングする機能をサクッと作れないかなー PHPならサクッと組めるけどNode.jsを運用しているサーバにPHPを新たに入れるのは嫌だなー jQueryでDOM操作して書くのも大変だよなー(実際やったけど可読性最悪でメンテがしんどかった) そうだ、JavaScriptのフロントエンドライブラリを使ってみよ
Riot.js を利用してTODOアプリケーション構築のハンズオンを作成しました #riotjs - the industrial
Riot.js Advent Calendar 2016 の２日目！ １日目はkuwahara_jsngさんの「今年1年真剣にRiot.jsと付き合ってきたので振り返ってみた」です。 さて、ついにv3がリリースされたRiot.jsですが、実は以前、社内向けに作ったハンズオンがあるので、Riot.js Advent Calendar 2016の場をお借りして紹介させていただきたいと思います。 ただ、バージョンは2.6時点のものですのでご了承下さい。 v3版も、いずれ近いうちに!!! デモ http://omiend.github.io/riotjs_todo/ はじめに Riot.jsとは 関連するHTMLとJavaScriptを結合し、再利用可能なコンポーネントとしてまとめたカスタムタグを利用してアプリケーションを構築することができる、超軽量Webフレームワークです。 http://rio
Riot.jsでゲームを作る - Qiita
この記事は Riot.js Advent Calendar 2016 の最終日の記事です。ギリギリの更新ですみません； ゲームにも使えるRiot.js Riot.js、いいですよね。 実用的なアプリで利用されている印象ですが、ゲーム開発にも便利に使えそうだと感じたので、試しに使ってみました。 とりあえず3Dっぽい迷路をうろうろするゲームを作ってみましたが、1フレーム単位でシビアなタイミングが要求されるゲームでなければ非常に実用的だと思います。 デモは↓こちら。 Plunkerでのデモ 簡単な解説 迷路データ(0:通路、1:壁、など)を配列に格納 移動用のボタンを用意し、押下時に現在地データ(座標と方角)を書き換え 現在地データと迷路データをもとに、迷路画像などの表示を切り替え Plunker便利(Riot.js関係ない) ソース やっつけ感漂うソースですみません。特にsetToViewファ
Riot.jsのRoutingについて | Tagbangers Blog
SPAをとりあえず味わってみたいけどどこからはじめればいいか。 まずはやさしく始められるRiotでやってみよう。 ということでRiotのRoutingについてドキュメント引きながらやってみました。 Riot Routerの機能いわゆるRouting、URLを判断してどのビューを表示させるか決めるというのが大きな仕事 SetupRoutingの書き方は大きく2つ riot.route(callback)URLが変化したらcallbackを返します。 *「URLが変化」するというイベントが発生するタイミングとは以下の4つのパターンのとき 新しい#(URL)がアドレスバーに入力されたとき。 (#が必要な理由はデフォルトの仕様によるため。後述します)ブラウザの戻る/進む ボタンが押されたとき。riot.route(to) が呼ばれたとき。 リンクをクリックする遷移などではなく、自分でaaa.tag
Riot.jsによるゆるいコンポーネント分割（応用編） - Qiita
通信仕様 前回と同様aggreさんのObseriotを利用させてもらった。 ちょっと込み入っているが、前回と基本はいっしょ。 下記のポイントを気をつけた。 コンポーネント間を直接繋がない コンポーネント単体での試験が困難になり、拡張も気軽にできなくなる ストアを変更できるのはディスパッチャのみ データの整合性は集中管理する 表示コンポーネントにロジックは持たず、表示に必要なデータのみを格納したストアを用意する とりかえがしやすくなる（円グラフから棒グラフへの変更など） コンポーネントがストアを変更したい場合はアクションに通知する コード index.html <!DOCTYPE html> <html> <head> <title>riot-handsontable-nvd3</title> <meta charset="utf-8"> <meta http-equiv="X-UA-Com
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Riot live editor
DeNA Engineering - DeNAエンジニアのポータルサイト