タグ

ブックマーク / lxyuma.hatenablog.com (8)

  • Ractive.js入門 - lxyuma BLOG

    これは、jsCafe18で話したSlideです。 概要 これから、「Ractive.js」という js上でReactiveなUIを とてもsimpleにbuildするためのlibraryの話をします 目次 reactive programming ractive.js 他のframeworkとの比較 Backboneに入れてみる そもそもReactive Programmingとは? 古くは、2003年頃から日blogでも幾つか言及されてる模様 去年、更に色々と動きが出てきた。 2013/7 ガートナーの2013年のreportで扱われてる 2013/9 リアクティブマニフェストが出た。これ訳されてる方がいた。 2013/9 infoQの記事見ると大体の流れや概要が分かる バズりと意味の広がり なんか徐々にバズり感がある 他のバズりワード(cloud等)と同じように意味が広義に、より抽

    Ractive.js入門 - lxyuma BLOG
  • gulp vs Grunt - lxyuma BLOG

    概要 gulpの入門記事を以下に書いて行きます。 目次 gulpとは gulp sample gulp支える技術(Streamと並行性) grunt vs gulp どっち使う? gulp.jsとは いわゆるフロントエンド周りの task runner build tool Gruntあるでしょ その通り いわば、Gruntの簡易版 去年位?出来た後発のtool 最近、blog記事も増えてきた 公式Page売り文句 複雑なtaskも管理し易く、simpleで、使うのが簡単 一時fileのdisk書き込みが無いので早くて能率的 simpleで期待通り動くようにPluginのGuidelineがある APIが小さく学習時間かからない リソース gulp公式page 入門記事 クラスメソッドさんの入門記事 shuheiさんのqiita記事 sample多め anatooさんの入門記事 Shump

    gulp vs Grunt - lxyuma BLOG
  • Rest経由のparseを使うBackbone.Viewを自作する - lxyuma BLOG

    parse.comはiOS/android/Backbone.js等の各clientが準備されているが、 Restの口も準備されているので、実質、どの言語からも叩く事が出来る。 公式pageの内容をまとめて試してみて、 最後にBackboneのViewに組み込んでPluginにしてみた。 そこまでのメモ メリデメ 先にメリデメまとめると、 メリット とにかく気軽(Backend全く準備が要らない) 1ヶ月100万requestまでは無料 デメリット 少し気になる程、遅い。(後述) Parse固有の事がある(relation等)ので、これで書いてしまうと、ベンダーロックされる queryがmongoDB丸だしなので、これも書いてしまうと、mongoDBから抜け出すのが大変 いずれにせよ、単純なテーブル構成でとりあえず作って見た、的なもの ※ハッカソンや個人制作アプリやモック制作等。 で良けれ

    Rest経由のparseを使うBackbone.Viewを自作する - lxyuma BLOG
  • Marionette.jsのCompositeViewって、どこで使えばいいの?問題 - lxyuma BLOG

    ビール飲みながらダラダラ書いてるので、おかしな所は申し訳ない。 CompositeView marionette.jsには、CompositeViewというクラスがある。 CollectionViewを継承していて、 再起的な構造を持ったviewを作れる 親側もtemplateを持つ事が出来る というのが、特徴とかなんとかで、イマイチ使い道のimageが湧かなかった。 普段書くときも、ItemViewとCollectionViewで事足りていた。 が、最近、使い道がやっと分かってきた。 View親子に関係のある親戚のおじさんView あるViewに親子階層がある時であれば、ItemViewとCollectionViewを紐づければ良い。(ulタグとliタグのイメージ) これは、このブログでも何度も書いてきた、よく書くパターン。 ところが、この親子に働きかけたい別のView要素が必要になる時

    Marionette.jsのCompositeViewって、どこで使えばいいの?問題 - lxyuma BLOG
  • jsでTDD!MochaとChaiとsinon.js入門 - lxyuma BLOG

    ※この記事は社内勉強会向けの資料の下書きです。書きなぐりの下書きで見直すと最後の方の文書がヤバいので、いつか書き直します。読み辛い所は申し訳ないです。 概要 TDD テスト自動化とTDDを整理 TDDとBDDの違い Test Framework in javascript QUnit/jasmine/mochaについて、違いやメリデメを知る mocha 基的な書き方 アサーションライブラリのメリデメを整理する chai 記述形式の違い整理 基文法 sinonjs spy stubs mock TDD Test Driven Development テスト駆動開発 by ケントベック 特徴 xUnit系/BDD系のテストフレームワーク使う テストするコードも実装 テストファースト 実装の後にテストするのではなく、テストを先に書いて実装する サイクル Red(失敗) => Green(通過

    jsでTDD!MochaとChaiとsinon.js入門 - lxyuma BLOG
  • Backbone.jsのテストの悩みとその解決 - lxyuma BLOG

    経緯 Backbone.jsでTDD書く時に、 Model/CollectionはServerSideのようなイメージで書けるのだが、 Viewのテストがfrontend特有の事があり、結構、悩ましい。 ここでは、Backbone.Viewを中心に、 テストで悩ましい所をどう解決していくか、試行錯誤している所等書く。 ※どちらかというと、初めにどう書いて行くか?のTDD寄りの話。 ちなみに、環境は、 Backbone Marionette.js Test mocha chai sinon.js を使ってる。 概要 Backbone.Viewのテストの基形 悩み1: javascript vs html 答え:DOM分離 悩み2:検証方法が素直に書けない 答え:テストダブル イベント サーバー通信 アニメ local変数 Backboneのテスト現実解 Viewのテストの基形 初めに、V

    Backbone.jsのテストの悩みとその解決 - lxyuma BLOG
  • 普通のrailsアプリのBackboneにMarionette付けて思った事 - lxyuma BLOG

    以前書いた記事の反省を元にMarionetteに移行した。 思った以上に快適! 大規模になったらMarionette.js使えとか書いているのは嘘で、普通にBackbone使うときは、初めから使うべき。 Backboneで一番恐ろしいのは、各現場/各開発者毎に異なるオレオレ実装。オレオレ実装作るコストに加え、使う人の思わぬバグや学習コストやスイッチングコスト等諸々考えると、特別な理由がない限りMarionetteみたいな既存のframework使うべき。 あんど。データバインディングを提供してくれる、stickitと一緒に使うと、より一層効果的。 めっちゃ、ソースコードの量が減って、ソースの意図が明快になった。悩みも少ない。工数も勿論減る。 ここから、幾つか思った事を、サッカー見ながらお酒飲みながら、ダラダラ書く。※ちなみに、日vsオランダ戦見てる。 railsアプリでのjs周辺の作りの

    普通のrailsアプリのBackboneにMarionette付けて思った事 - lxyuma BLOG
  • Backboneでデータバインディング(stickit) - lxyuma BLOG

    最近、angularが熱くて、twitter見てると、angular周りが活発に流れて来るのだが、 angularのウリにしてるデータバインディング、Backboneでも同じ様な事がpluginで出来る。 Backbone自体は、非常にミニマルに出来ているので、(おそらく今後も体にこういう機能入らなそう...) こういう機能は自分で追加しないといけないのだが、pluginさえ入れれば動く。 幾つか類似pluginあるようだが、ここでは、stickitの事を書く。 stickitについて https://github.com/NYTimes/backbone.stickit NYTimes社のもの。 使い方 使い方は非常にsimpleでViewの中に セレクタと属性の紐付けを書く 対象となる要素がある状態で、stickit()と書く これだけ。 公式ページのsampleを実際にやってみる。

    Backboneでデータバインディング(stickit) - lxyuma BLOG
  • 1