6

我是骨干新手,我在这里寻求一些帮助,以了解我将如何构建我当前的 webapp 项目。我正在为服务器开发一个模块化管理面板。面板的每个“页面”都应该是一个打包的“模块”,包括控制器、模型和视图。

该面板将包含一个初始加载的主布局视图,以及一个基本导航。当用户单击导航上的链接时,页面会通过 AJAX 加载到布局中。(如果这听起来很愚蠢/有理由不这样做,请告诉我:))

由于其他人也会开发这些页面,而且它们是模块化的,所以我不知道我将在通过 AJAX 加载的页面中看到哪些模型、视图和控制器。

我将如何最好地使用骨干做到这一点?

我特别想知道如何动态扩展 Backbone 模型等,以及如何管理(例如)用户离开页面和/或稍后重新访问它。

Backbone 是否提供了我可以使用的东西,我是否需要一起破解自己的东西,有没有更好的方法来做我缺少的事情?

4

4 回答 4

2

与 Backbone 结合使用的常见模块化脚本加载框架是 require.js。这可能是您正在寻找的东西。Require.js 都是关于 AMD 模块、异步模块的。通常每个模型、集合、视图都是它自己的模块,它定义了特定模块所需的依赖关系,然后根据需要加载这些模块。它特别适合大型项目,在这些项目中,您需要在应用程序的不同点将许多单独的部分混合在一起。

您当然可以在单个模块中组合多个主干元素(通常我将其保留给仅与父视图一起使用的视图和特定子视图),但这完全取决于您。

使用 Backbone,通常的目的是创建单页应用程序 - 这意味着所有页面脚手架通常被包装为单个文件并在开始时完全加载到客户端。然后通过 ajax 调用每个页面的数据,并在用户导航和加载应用程序的不同方面时填充数据。这是您在描述中的意图吗?

如果您要加载从服务器单独抓取的不同页面,那么我不确定 Backbone 是否是答案。还有其他服务器端 MVC 框架可以帮助实现这一点。

这通常涉及如何将 Backbone 用于此类事情。

至于如何扩展 Backbone 模型等,Backbone 使用 Underscore 作为依赖项,并且 underscore 提供了一个很好的_.extend()功能,可以轻松地以几乎任何您想要的方式扩展所有对象。覆盖默认功能,加入 mixins,就 Backbone 而言,这一切都非常轻松。作为一个框架,Backbone 在改变、修改和定制每一点和每一个部分时都非常适合。

至于处理用户访问和重新访问页面,Backbone.router允许您创建不仅指向应用程序中特定“页面”的 URL,而且还可以执行需要执行才能到达那里的任意代码。像登录用户访问“mysite/#account”之类的东西会触发路由器加载某些脚本,这些脚本会显示该特定视图以及可能fetch()为用户启动和运行该视图所需的数据。

我不确定是否有资源可以为您提供某种基本结构。我所知道的大多数经验都倾向于通过“Todo List”之类的基本教程并从那里开始。我不确定您对 javascript 或一般编程的经验水平如何,但是当我几乎一无所知时,我从 Backbone 和 require 开始。只有对 JSON 是什么的模糊概念和对 HTTP 的低层次理解,例如“它就是获取网页的东西”。也就是说,我认为 Backbone 对我来说很容易上手,它加深了我对整个客户端 RESTful 类型应用程序结构的了解。

“待办事项列表”应用程序有一个非常好的列表,有许多不同的风格,例如 Backbone 和 Knockout 等等。在决定一个框架时,我基本上通过代码比较了所有可用的不同框架并选择了 Backbone,因为它对我来说似乎最有意义。我不后悔。这很有趣,我认为最好的方法是尝试一些演示教程。

于 2012-09-16T17:29:30.007 回答
2

你对这些问题的思考听起来很正确。使您的 UI 组件尽可能自包含。观看这个10 分钟的视频,了解有关 UI 组件最佳实践的更多信息。

如果您对 JavaScript 应用程序开发的其他重要问题感兴趣,请查看我发布的BoilerplateJS参考架构以分享我的经验。它包含与您描述的类似的示例应用程序(带有组件激活的菜单)。

我对您的 UI 组件激活、停用的建议是:

  • 不要删除/创建 DOM 组件。重用隐藏/显示,因为即使从 DOM 中删除,您的元素也会在内存中重新定位
  • 尽量减少在客户端保留“状态”信息。当用户重新访问组件时,使用服务器调用刷新它,然后使其可见(使用服务器作为状态信息的唯一真实性)。

有关更多详细信息,请参阅 BoilerplateJS 示例组件实现。我知道很少有人将它与 BackboneJS 一起使用(目前它与 knockoutJS 一起提供)。我们将在一周后使用 v0.2 中的 BackboneJS 发布它的示例。

于 2012-09-17T05:14:51.940 回答
1

看看木偶卓别林。两者都建立在 Backbone 之上,并提供了一种结构化的方式来使用 Backbone 构建更大的应用程序。

于 2012-09-16T17:27:38.013 回答
0

这是使用backbonejs将您的应用程序组织为模块的教程

http://backbonetutorials.com/organizing-backbone-using-modules/

于 2012-12-19T08:56:01.600 回答