내맘대로

Backbone.js 가 탄생하게된 배경 SPA(Single Page Application)의 필요성 리소스 로딩 속도를 개선하여 유저의 대기 시간을 줄이기 위해 SPA 개발 필요 Backbone의 구조(MV*) Backbone은 서버에서의 MVC 패턴에서 착안M(odel), V(iew), C(ontroller) 구조에서 착안되었으나 완전히 동일하진 않다. * 백본은 컨트롤러의 역할을 view가 대신 Model - 뷰의 변화를 관찰할 수 있다. (관찰한다는 것은 모델이 갱신될 때 마다 뷰가 인지할 수 있다는 것을 의미)- 모델의 집합 : Collection(그룹 내의 모델이 변경된 경우 그룹으로 부터 인지할 수 있는 로직을 작성할 수 있다는 것 => 모델 인스턴스의 변경에 대해 수동으로 관찰하지 않아도 ..

region와 layout은 마리오네트 js에서 화면을 구성하는데 언급되는 용어다. region과 layout은 화면을 생성할 때 사용된다. 그러면 이 둘의 차이점은 무엇일까? template/template.html 파일 예제. mainLayout.js 코드 예제var template = require('text!template/teamplate.html')var SubLayout = require('js/SubLayout'); var mainLayout = Marionette.Layout.extend({template: _.tempate(template), regions: {subLayout: '#subLayout'}, initialize: function() {}, onAttach: function..

view에서 model 값을 가져오는데 사용되는 메소드로는serializeData()와 templateHelpers()가 있다. 이 둘의 차이점을 확인해보자. serializeData() 이 메소드는 보통 model이나 collection 데이터를 template에서 사용할 수 있는 형태로 변환할 때 사용된다. serializeData는 기본적으로 단순히 model의 속성 값을 복사해준다. var _ = require('underscore');var Mn = require('backbone.marionette');var myModel = new MyModel({foo: 'bar'}); var MyView = Mn.View.extend({ template: _.template('Hello, '), seri..

마리오네트에는 이벤트를 통해 객체들이 통신을 할 수 있게 돕는 시스템이 있다. 이벤트를 발생시키는 방법은 여러가지인데, 이 차이점이 헷갈려서 한번 정리해보고자 한다. - trigger() this.trigger('eventName'); 위와 같이 이벤트가 발생하게 되면,해당 view의 상위 view에서 이벤트 핸들링을 할 수 있다. - triggerMethod() this.triggerMethod('childView:eventName'); 위와 같이 이벤트가 발생되면,해당 view + 해당 view의 상위 view에서 이벤트 핸들링을 할 수 있다. 또한 triggerMethod로 이벤트 발생 시, 이벤트 명에 : 문자를 이용하여 구분하는 경우 마리오네트에서 : 문자를 기준으로 하여 자동으로 핸들링 메소드..