Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/panta/backbone-ko
Knockout integration with Backbone.js
https://github.com/panta/backbone-ko
Last synced: about 2 months ago
JSON representation
Knockout integration with Backbone.js
- Host: GitHub
- URL: https://github.com/panta/backbone-ko
- Owner: panta
- License: mit
- Created: 2013-04-23T09:23:54.000Z (over 11 years ago)
- Default Branch: master
- Last Pushed: 2018-10-09T04:24:35.000Z (about 6 years ago)
- Last Synced: 2024-10-09T22:19:03.272Z (2 months ago)
- Language: CoffeeScript
- Size: 125 KB
- Stars: 4
- Watchers: 3
- Forks: 2
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Backbone-KO
## [Knockout][] integration with [Backbone][] ##
This library provides a smooth integration of [Knockout][] with [Backbone][].
It is meant to be a simpler and lightweight alternative to [Knockback][]. For comparison, Knockback core is 62Kb **unminified** (10Kb minified and gzipped), while Backbone-KO is **3.5Kb unminified** and less than 1Kb minified and gzipped).
### Key Benefits ###
* Use the familiar [Backbone][] with the all the added power of [Knockout][]
* Bi-directional model-view binding
* Knockout view models are automatically created from Backbone models (can be provided explicitly if needed)
* Transparent binding through Backbone views
* Extensively tested with [mocha][] and [zombie][]
* Completely backward compatible
## Compatibility and Requirements
Backbone-KO has the following dependencies:
* [Backbone][] v1.0.0 (earlier versions should work)
* [Knockout][] v2.2.1 (earlier versions should work)
* [knockout.mapping][https://github.com/SteveSanderson/knockout.mapping/tree/master/build/output] v2.4.1
The dependencies are not particularly strict: slightly earlier or later versions should work too.
### Download and Installation ###
Just copy the library (either [backbone-ko.js](https://raw.github.com/panta/backbone-ko/master/dist/backbone-ko.js) or [backbone-ko.src.js](https://raw.github.com/panta/backbone-ko/master/dist/backbone-ko.src.js)) from the `dist` folder to your javascript assets directory and include it using a script tag:
```html
```
Using [Bower][]:
```bash
npm install -g bower
bower install backbone-ko
```
### Getting Started ###
The library is contained in the `bko` namespace.
The simplest way to use it is through `bko.View`, a `Backbone.View` extended with [Knockout][] support.
`bko.View` will take care to create a KO view model from the Backbone `model` provided and to automatically apply the bindings to the view `el`:
```javascript
$(function() {
var Person = Backbone.Model.extend({});
var person = new Person({ first_name: "Thomas", last_name: "Jefferson", age: 83 });
var personFormView = new bko.View({ el: $("#person"), model: person });
});
```
and the HTML:
```html
First name:
Last name:
E-mail:
Age:
```
In the above example, the form will be automatically populated with values from the Backbone model, and the model will be updated whenever the user modifies the form fields. In other words a bi-directional binding is estabilished between the view and the model.
### License ###
Backbone-KO is © 2013 Marco Pantaleoni, released under the MIT licence. Use it, fork it.
[Knockout]: http://knockoutjs.com
[Backbone]: http://backbonejs.org
[Knockback]: http://kmalakoff.github.io/knockback
[Backbone-KO]: http://github.com/panta/backbone-ko
[Bower]: http://bower.io
[mocha]: http://visionmedia.github.io/mocha
[zombie]: http://zombie.labnotes.org
[CoffeeScript]: http://jashkenas.github.com/coffee-script/
[Node.js]: http://nodejs.org/
[Jasmine]: http://pivotal.github.com/jasmine/