Skip to content

Instantly share code, notes, and snippets.

@fakefarm
Created March 29, 2017 18:10
Show Gist options
  • Save fakefarm/d360447925b68f843ef63d943bea17a1 to your computer and use it in GitHub Desktop.
Save fakefarm/d360447925b68f843ef63d943bea17a1 to your computer and use it in GitHub Desktop.
notes on backbone
// I. Setup Architechture
// -----------------------------------------
// 1. make the model
var Image = Backbone.Model.extend({});
// 2. make the view
var ImageView = Backbone.View.extend({
// 3. make the template
template: _.template($('#template').html()),
render: function () {
// 4. merge model data with template
var template = this.template({path: this.model.get('img')});
// 5. append to dom
this.$el.append(template);
// 6. return this from render
return this;
}
});
// II. Get the Data
// -----------------------------------------
// 7. source custom data
var imgPath = "img/ephesians_mind_map.jpg";
// III. Initialize new Objects
// -----------------------------------------
// 8. put it into a new model
var img = new Image({img: imgPath});
// 9. new up a view
var imgView = new ImageView({
// 10. pass the model to the view
model: img,
// 11. what is the element to append to? (is this from the template, no name, or from the dom?)
el: "#app"
}
);
// IV. Interactions
// -----------------------------------------
// 12. call render
imgView.render();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment