백본 JS의보기를 올바르게 사용하지 않는 것 같습니까?

Question

방금 ​​백본 (및 언더 코어) JS를 사용하기 시작했습니다. 우리는 큰 iPad HTML5 응용 프로그램을하고 있으며 모든 클라이언트 측에서 작동해야합니다. 이 프로젝트는 구조가 필요하며 백본은 적합 할 것 같습니다. 너무 많이 들어가는 것 같지 않고 (특히 Underscore가 필요하기 때문에) 약간의 툴킷으로 사용할 수 있습니다.

나는 한 가지 질문이 있습니다. 이 HTML5 앱은 기본적으로 단일 페이지 애플리케이션입니다. 모든 것은 index.html 파일에서부터 시작됩니다. 나는 내가 좋아하는 백본의 URL 조각 관리 방법을 알게되었다. 라우팅 이벤트를 특정 모델에 쉽게 설정할 수 있습니다.

내가 작업하고있는이 HTML5 앱에는 '페이지'라는 중첩 된 레이어가 많이 있습니다. 대략 3 단계의 중첩이 있습니다. JSON 데이터입니다.이 앱에서 사용하는 데이터입니다 (아직 로컬 데이터베이스 저장 장치에 들어가기는했지만 어쩌면해야할까요? 백본에서 먼저 머리를 쓰고 싶었습니다). 그것들은 정상적인 웹 페이지이므로, 웹 애플리케이션의 다양한 부분에로드되는 내용의 페이지 일뿐입니다.

조회수를 사용하고 있습니다. 나는 개념을 가지고 있다고 생각한다. 데이터로 콜렉션을 채우고 뷰는이 데이터 콜렉션을 중심으로 구축된다. 나는 하나의 모델 인스턴스에 대해 함께 갈 뷰가 있다는 것을 이해한다. 그런 다음 모델의 Collection을 보려면 컬렉션을 반복하고 각 개별 모델의 View를 호출하는 View를 호출 할 수 있습니다.

미안하지만 나는별로 감각이 없다는 것을 알고 있습니다.

기본적으로 Backbone Views는 단일 모델, 모델의 Collection ...에 대해 HTML을 생성하는 데 사용되는 것을 볼 수 있습니다. 모든 작은보기가 페이지의 여러 부분으로 정렬되었지만, 전체 페이지? 이 HTML5 애플리케이션에 기본 템플릿이 있지만 웹 애플리케이션의 다른 페이지마다 다른 전체 페이지 레이아웃이 필요했기 때문에 어떻게해야 볼 수 있습니까? 이런 일을 할 수 있니? 기본적으로 전체 페이지 템플릿을 얻기 위해 Ajax 호출을 수행하는 뷰가 있습니까?

아래 예제는 URL이 앱의 루트에있을 때 주 생성자에서 호출되는보기입니다. 사용자가 다양한 URL에있을 때 내 앱이 표시해야하는 설정하고 싶은 여러 가지보기가 있습니다. 내가 여기있는 것처럼 Ajax 템플릿 전체를로드하는 것이 잘못 되었습니까? 단일 페이지 응용 프로그램을 사용하는 다른 방법은 없지만 사이트의 모든 다른 비트에 대해 관리 가능한 페이지 서식 파일이 있습니까?

App.View.Home = Backbone.View.extend({ 
    tagName: "article", 
    id: "view-home", 
    initialize: function() { 
     _.bindAll(this, "render"); 
    }, 
    render: function() { 

     var that = this; 

     $.get("templates/home.html", function(templateHtml) { 
      $(that.el).html(_.template(templateHtml)); 

      // we want tabs in this template too 
      var tabs = new App.View.Tabs(); 
      $(that.el).find('#main').html(tabs.render().el); 

     }, "html"); 

     return that; 
    }, 
}); 

이것이별로 의미가 없다면 유감입니다. 저는 많은 것을 배우려고 노력하고 있습니다.

Answer 1

이 접근법에는 아무런 문제가 없지만 조금 더 많은 코드를 보지 않고 말하기는 어렵습니다. 중요한 것은 백본을 과도하게 생각하지 않는 것입니다. 백본이 설계된 몇 가지 사항 만 있고 그 이상의 기능을 활용하는 것은 당신에게 달려 있습니다.

저는이 특별한 문제에 관해서 왜 당신이 여기서하고있는 일을해서는 안되는 지 알지 못합니다. 필요한 데이터 나 템플릿을로드/페치하지 않기 전에 확실히 확인합니다. 뷰를 렌더링하기 전에 서버에서 필요로하는 모든 데이터를 얻을 때까지 기다려야합니다 (보기가 불규칙하게로드되지 않도록). 이 마지막 점은 지침 일 뿐이며 백본과 관련이 없습니다. 하지만 솔직히 말해서 그것은 기능 중 하나입니다. 백본 : 몇 가지 일을 잘 수행하고 나간다.

Answer 2

제가 생각하기에 가장 쉬운 방법은 많은 뷰와 많은 템플릿을 갖는 것입니다. 뷰는 컨트롤러와 뷰에서 템플릿으로 생성됩니다.

우리는 jqote2를 사용하여 템플릿이 멋지게 작동하도록했습니다. 모든 템플릿을 앞에 캐시하고 데이터가 앱을 구동하게합니다.

각보기는 해당 div에 대한 마크 업을 렌더링 할 수 있습니다.

그런 다음 컨트롤러는 예를 들어 여러 뷰를 생성 할 수 있습니다 : -

App.Controllers.X = Backbone.Controller.extend({ 
    .... 
    index: function() { 
     new App.Views.View1({ 
     el: 'div#id1, 
     ... 
     }); 
     new App.Views.View2({ 
     el: 'div#id2, 
     ... 
     }); 
etc 
    } 

희망이