使用从Node.js(Express.js)注入的模板的Backbone.js视图

Mic*_*end 1 node.js express backbone.js

就我在互联网上阅读而言,如果你想将backbone.js和node.js一起使用,通常你会使用node.js(express.js specificy)作为后端API提供者(加上其他功能,如持久性,等),同时Backbone.js的是前端的发动机,这意味着,提供了HTML模板,视图,模型等

我在互联网和github上读过的骨干项目,通常以index.html开始,它直接执行一个javascript文件,实例化路由,集合,视图等"类".前端的视图是inyecting的责任. html和css模板并自行管理视图,如事件等.

问题来自于我看到像backbone.iobind(https://github.com/logicalparadox/backbone.iobind)这样的项目,它使用了我真正不理解的非常特殊的配置以及它是如何工作的.

如果您看到源代码,则node.js服务器不仅负责API,还负责处理Backbone将使用的html模板.我有很多疑惑:

  1. 谁执行骨干前端,因为没有"索引"执行执行路由器,视图,集合和历史记录的javascript?

  2. 你如何同步express.js所引用的模板,以及将要使用它们的backbone.js端的视图?

  3. 什么是backbone.js路由器类的目的,因为你正在使用node.js路由器进行入侵?

  4. 为什么你使用这种架构,而不是像我在开头描述的那样更干净?

非常感谢你的帮助

Mic*_*end 5

经过几天的研究,看到互联网上没有关于它的信息,我将回答我自己的问题.希望有些编辑会纠正错误的答案.我要描述的是node.js和backbone.js应用程序的"主干",它们从后端而不是从前端来模仿模板,因为社区正在发展.为什么开发人员选择两个选项之一?根据不同的变量:安全性,加载和渲染速度等.过程总结:

A.基本上,第一步是在express.js中配置views目录和模板引擎:

    app.set('views', __dirname + '/views');
    app.set('view engine', 'jade');
Run Code Online (Sandbox Code Playgroud)

B.在此之后,我们将在中间件中找到所有静态资源.当我们谈论'静态'资源时,我们会讨论将在前端执行的图像,javascript,html,css等:

    app.use(express.static(path.join(__dirname, 'public')));
Run Code Online (Sandbox Code Playgroud)

如果express(或connect)在/ public目录中找到index.html,它将运行它.如果没有,您必须通过快速路由系统创建路由.

C.我们处于express.js从后端传入HTML的情况.为此,正如我所写,我们需要一个路由系统,如:

    app.get('/', require('./views/index').init);
Run Code Online (Sandbox Code Playgroud)

在这里,当express.js检测到用户访问主页'/'时,它会查找和index.js文件位于/ views父目录(不是/ public),并将从这里找到index.jade将被呈现并被引入前端:

    res.render('index');
Run Code Online (Sandbox Code Playgroud)

D. index.jade将提供所需的资源.在我们的例子中,将提供此.jade所需的CSS,库(jquery,backbone等),最后,将由backbone.js提供两个元素:

  1. 将加载backbone.js前端的javascript文件.在这里,所有文件都将位于/ public目录中:

     script(src='/views/index.js')
    
    Run Code Online (Sandbox Code Playgroud)
  2. index.jade还将提供backbone.js视图所需的模板:

     script(type='text/template', id='login')
    
    Run Code Online (Sandbox Code Playgroud)

E.有几种不同的backbone.js配置.通常,您从前端路由器启动主应用程序,其中所有对象都已初始化.但是,同步index.jade文件,模板和javescript视图的执行的主要思想是在加载DOM之后执行最后一个.出于这个原因,最好的想法是使用以下jquery句子:

     $(document).ready(function() {
        app.view = new app.View();
     });
Run Code Online (Sandbox Code Playgroud)

也许有些人会发现这个摘要是不必要的,但是对于那些不知道在前端拥有所有内容,或者混合HTML node.js后端+ backbone.js前端之间的区别的初学者,我认为这将是有用的.最重要的是,结构如何.也许这听起来很疯狂,但互联网上没有关于如何构建它的信息.

最好的祝福