knockout.js helps you simplify dynamic JavaScript UIs using the Model-View-ViewModel (MVVM) pattern. This website is a set of interactive coding exercises to help you quickly learn how to benefit from knockout.js and MVVM.
お疲れ様です。 思えばKnockoutJS触るようになってからまだ3ヶ月かそこらです。そこまで語れるようなコアな知識に踏み込めるか?というとそこまで探求しきれてはいません。なので初学者向けに何か書けるといいな、と考えました。 KnockoutJSを使おうと思ったきっかけは3ヶ月くらい前、Rebuild.fmで宮川さんがAngularをdisりながら「JavaScript得意な人はKnockoutが薄くていいよ、っていうけどね」と言うのを聞いたことでした。自分も前の仕事でAngularの規模感(というか学習コスト)につらみを感じていたので、新しく開発する前にちょっと触ってみるか、と興味を持ちました。 勉強しはじめて、わりとすぐ新しい開発で導入したのですが、その中で実際に何をしたのかを振り返ると 公式チュートリアルを3周くらいやる Railsにうまいことフィットさせる方法を実装しながら模索 こ
これは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
KnockoutJSを使った開発を1年ほど前に行っていました。 元々はプロトタイピングだけに使う予定でしたが、使い勝手が良かったのでそのまま本開発に取り込みました。 最近、少しAngularについても調査をしていたので、Knockoutと比較できる部分も書きだしてみました。 KnockoutJSの長所/短所、そしてAngularJSとの比較となります。 長所:双方向のデータバインディング Knockoutの最大の長所は、間違いなく強力な双方向のデータバインディングと言えます。 この凄さを試したければ本家サイトのExample各種を試すと良いかもしれません(参考URL)。 あるいは自分自身でサンプル・アプリケーションを作るといいでしょう。 すぐに虜になるはずです。 DOMとJSのモデルを紐付けて、整合性をとる処理を全てフレームワーク側が吸収してくれます。 JS側の記述がシンプルになるので、ア
数あるJS Frameworkの中でKnockoutを選んだ理由を紹介します。 つくりたかったもの ざっくりいうと、、、チームマネジメント用のタスク管理ツール。基本的なtodo機能が人に紐付いていて、マネージャーがそれを一括管理できる。大規模ってほどではないと思います。 DOMへの即時反映+各々の環境でもリアルタイムに更新したい。リアルタイムはRails-Websocket使うとして・・その他のDOMの動き、通信は何で実装しよう、という感じ。 KnockoutJsを選んだ理由 先にKnockoutを導入したかった理由を上げてみます。 (これはフレームワークを使いたかった理由)jQueryでDOMがめちゃくちゃになってよく泣いていたので、ビューをバインドできるMVがあるフレームワークを使いたかった。 学習コストが低い。資料やチュートリアルが豊富。フレームワークをガッツリさわったことがないので
JSのMV*は何がいいのか論争は最近収束気味な気はしますが、あんまり触ることができていなかったので、きよくらさんの話を聞いて興味を持っていたKnockout.jsを、仕事で作っているプロダクトに導入してみました。 AngularJSは途中から導入するには難しいですし、BackboneJSはなんか面倒臭かった記憶がありました。結局jQueryで頑張ろうと思えばなんとかなるレベルなので、とりあえずjQueryでDOMと戦っていましたが、面倒臭さが勝ち始めてきました。Knockout.jsは、MVVMとしてシンプルな機能を提供してくれているので、途中から導入できそうでした。 ちなみにKnockout.jsとjQueryを合わせて使っているので、プロジェクト内からjQueryを撲滅するとかそういうことはありません。相変わらずjQueryは便利に使っています。 jQueryのみで作ってDOMを掘って
対象読者 jQueryなどを使っているJavaScript開発者 JavaScriptを使った複数人でのプロジェクトに参加している方 JavaScriptを使ってサーバ等と連携したフロントエンドの開発をしている方 必要な環境 この記事では、AngularJSを使用し、Chrome(36.0)、IE11、Firefox(31.0)、Safari(7.0.5)の環境で確認を行っています。 JavaScript開発の歴史 フレームワークを説明する前に、10年ほど前から現在までのJavaScriptが歩んできた流れが分かると、どうして今、JavaScriptにもフレームワークが必要になってきているのか、または開発者はフレームワークに何を求めているのかが多少は見えてくることと思います。 2005年くらいまではJavaScriptは利用者や開発者から避けられていた技術で、たとえ使われても、非常に簡単で
■ [javascript] JS MVCフレームワークについてちょっと調べた (2013夏) JS MVC戦国時代ってそういえばどうなったんだろう、と思いつついくつかのライブラリを調べてみたところ、意外とそれぞれキャラが違うことが分かった。 Backbone.js 1.0.0 いまのところ一番人気らしい 意外と小さい。ソースが1ファイルしかない。 Model、Collection、Viewという、自作してもこういう感じになりそうだなぁという構成。(Router/HistoryはURLいじらないなら使う必要はないので、実質この3つだけ) 薄いフレームワークなので、他のライブラリと組み合わせるのは簡単そう。 デメリット:以下のフレームワークが持っているdata bindingのような高度な機能はないので、相対的にコード量が増える。これは小さなアプリでもそこそこ行数を書かないといけないというこ
This document compares several major JavaScript libraries, frameworks, and toolkits to help determine which is best for a given project. It defines the differences between libraries, frameworks, and toolkits. Features like modularity, code structure, utilities, and user interface capabilities are compared for libraries like jQuery, MooTools, AngularJS, BackboneJS, Dojo and YUI. Considerations arou
2. KnockoutJS入門 COPYRIGHT 2015 PLUGRAM, INC. 自己紹介 @tan_go238 PLUGRAM, Inc. 仕事:PHP、JavaScript 趣味:JVM、Curry 215年1月26日月曜日
Todoリストの機能 1.テキストボックスから、Enterで追加できる 2.登録したTodoはダブルクリックで編集可能になり、Enterで編集確定できる 3.登録されているTodoの総件数がフッターに表示される 4.完了したTodoがある場合、それらをリストから消すボタンが表示される 5.全選択/解除を行うチェックボックスがある 個人的な結論 趣味開発で使うならAngular.js・仕事で使うならKnockout.jsをお勧めしたい。 まず、フレームワークを選択する際は、以下3つの選択基準を持つとよいと思う。 1.開発の規模 大規模ならBackbone.jsはお勧めできる。 書き方が決まっていて、チュートリアルに目を通せば(面倒なのは置いておいて)何を作らなければならないかは簡単に理解できる。そこそこの人数で長い時間の開発を行うなら、UIチームはアプリケーションとView、サーバーサイドは
Thanks for stopping by! Let's get started TodoMVC is a common set of JavaScript examples for MVC frameworks like SproutCore, JavaScriptMVC, Backbone, YUILibrary, Spine, Sammy, AngularJS and others. Live examples To preview a Todo implementation for a particular framework, simply select it from the menu to the right of the screen. Depending on the browser you're using, you may need to access the
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く