Knockout.jsの概要 (3つのMVC系人気フレームワーク、Backbone.js/AngularJS/Knockout.js) - Build Insider Offline #1 Sample Code: http://mayuki.github.io/Sample/BuildInsid…
はじめに Rails で作る管理画面等でリッチな動きをつけたいと思った場合、何かしらの JavaScript フレームワーク の利用を検討するかと思います。 以前に APIサーバを Rails、フロントエンドを AngularJS で開発する [その①] [その②] [その③] という投稿をしたのですが、このような感じで Rails は APIサーバに徹する のが良いのかな、と個人的には思うものの、JavaScript フレームワークを View で薄く使う という構成もあるのかなと。(jQuery を触るよりましだよね、という程度。) 今回は、JavaScirptフレームワーク ⇔ Rails 間で、API 経由ではなく View 経由でデータをやりとり する、ということをやってみました。 Knockout.js を利用していますが、素の JavaScript でも他のフレームワークでも
みなさん、Trello使ってますか? IT企業は「TrelloとSlack使ってる」と言っておけばイケてるスタートアップ風を装えると誰かが言っていました。 KnockoutJS Advent Calendar 13日目ということで今回はTrelloライクなUIをKnockoutJSで実装してみたいと思います。 一応軽く説明すると、Trelloはタスクを書いた『カード』と、カードをステータスごとに格納する『リスト』から構成されているタスク管理ツールで、「リストにカードを追加・削除したり、異なるリストにカードを移動させる」というのが基本的な機能です。 例えばTODOリストに新しいタスクを書いたカードを追加して、そのタスクに取りかかるときにDOINGリストに移動し、タスクが終了したらDONEリストに移動するという流れで使います。 特徴的なのは、これらの動作をすべてドラッグ&ドロップで行う点です。
数あるJS Frameworkの中でKnockoutを選んだ理由を紹介します。 つくりたかったもの ざっくりいうと、、、チームマネジメント用のタスク管理ツール。基本的なtodo機能が人に紐付いていて、マネージャーがそれを一括管理できる。大規模ってほどではないと思います。 DOMへの即時反映+各々の環境でもリアルタイムに更新したい。リアルタイムはRails-Websocket使うとして・・その他のDOMの動き、通信は何で実装しよう、という感じ。 先にKnockoutを導入したかった理由を上げてみます。 (これはフレームワークを使いたかった理由)jQueryでDOMがめちゃくちゃになってよく泣いていたので、ビューをバインドできるMVがあるフレームワークを使いたかった。 学習コストが低い。資料やチュートリアルが豊富。フレームワークをガッツリさわったことがないので最初にはちょうどいいと思った。 機
これはKnockoutJSアドベントカレンダー1日目の記事です。 KnockoutJS Advent Calendar 2014 - Qiita 一発目なので最初は KnockoutJS とはどんなものなのかについて書きたいと思います。 KnockoutJSとはMVVMパターンでJavaScriptで作る動的なUIをシンプルに構築するライブラリです。 ※個人的にはフレームワークではなくライブラリだと思っている 公式サイトには以下のような標語で書かれています。 Simplify dynamic JavaScript UIs with the Model-View-View Model (MVVM) Knockout : Home KnokoutJSを一言でいえば、「バインディングフレームワーク」の一種です。 以下の特徴があります。 ・他のライブラリ(jQueryなど)に依存しない ・IE 6
これは TypeScript Advent Calendar 2014 の11日目(12/11)の投稿です。 TypeScirpt、これは単純に優れているのではと思い、この機に試してみました。今回は薄いフレームワーク(ライブラリ)として私が勝手に重宝している Knockout.js に TypeScript を適用してみます。 尚、事前準備となる周辺環境(WebStorm、TypeScript本体、TSD)については昨日こちらに書いたので、宜しければ参照ください。 → WebStorm で TypeScript を始めよう! まずは Knockout.js の環境構築 Yeoman でサクりと作っちゃいます。 今回の前提環境 yo:1.3.2 generator-webapp:0.5.1 Knockout.js:3.2.0 jQuery:2.1.1 手順 Yeoman の generato
追記: 今から SPA を始めようと思ってこの記事を見つけた方へ この記事は2014年に書きました。 KnockoutJS はバインディングライブラリとして生まれ、Angular, Vue などの MVVM フレームワークの礎となりました。現時点で振り返ってみても、KnockoutJS はやはりフレームワークではなくバインディングライブラリです。 SPA をサクッと作りたい場合、もしくは腹を据えて開発したい場合、どちらにおいてもフレームワークを利用したほうが明らかに楽です。この記事での実装方法には、退屈なボイラープレートが数多く残っています。 薄いライブラリを使用しているがための自由度の高さがあるか、と考えてみても Angular, Vue, React を使う場合と比較した優位性はもはやありません。 KnockoutJS を dis りたいわけではありませんが、冷静に比較しても SPA
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く