staab / js-allonge

Repository for collaboration on the project for the Javascript Allonge group 2014
MIT License
1 stars 3 forks source link

Design HTML Bindings #8

Open staab opened 9 years ago

staab commented 9 years ago

Not sure how to go about this, but we'll probably want something pretty declaratively client-side model driven, listening for updates on the models and updating the DOM in response. When updating the DOM, it seems more correct from what I've seen to have various pre-defined classes that HTML can include, rather than the javascript going out and finding html based on certain criteria.

jpurdy commented 9 years ago

"listening for updates on the models" What is the mechanism for this? Is this mechanism related to http://backbonejs.org ? I don't understand what this looks like; can you (or anyone else out there) point me to where I might get a little more information? Thanks.

staab commented 9 years ago

Yeah, I honestly don't know the mechanism either. I've used knockout.js http://knockoutjs.com/ a little bit, and there are also Ember, Angular, Backbone, and lots of others.

I think the basic concept is this:

  1. Write some javascript that defines predefined behaviors for certain identifiers in your html. When it finds elements matching its search criteria, it modifies them and listens to modifications on them in a predefined manner.
  2. include the predefined identifiers (classes or data attributes) in your markup for elements you want to be processed/analyzed/synchronized by javascript.

This differs from the jquery paradigm in that the html is very much a consumer of a data api defined in javascript. The thing is, html can't do much on its own, so event bindings are still the mechanism for making it happen. This lends to code re-use, since you're defining data structures and applying them to disparate ui elements, rather than defining disparate ui elements and accomodating your data structures to them.

On Sat, Oct 25, 2014 at 9:07 AM, jpurdy notifications@github.com wrote:

"listening for updates on the models" What is the mechanism for this? Is this mechanism related to http://backbonejs.org ? I don't understand what this looks like; can you (or anyone else out there) point me to where I might get a little more information? Thanks.

— Reply to this email directly or view it on GitHub https://github.com/staab/js-allonge/issues/8#issuecomment-60487528.