服务器端和客户端JavaScript

I am having great difficulty choosing which frameworks to use for an app that is about to go into development. I am a front-end guy, and my friend is doing the back-end.

我在为即将进入开发的应用程序选择哪些框架时遇到了很大的困难。我是一个前端的家伙，我的朋友正在做后端。

Say I was developing a simple todo list app. I have a template for each item on the todo list. Ideally, I would want the server-side JavaScript to use this template as well as the client-side JavaScript.

假设我正在开发一个简单的待办事项列表应用程序。理想情况下，我希望服务器端JavaScript使用这个模板以及客户端JavaScript。

So on page load, if there are already 5 todos in the database, the HTML will be compiled on the server. If I then add a new todo item to the list, the client-side JS will compile the HTML using the same template.

所以在页面加载时，如果数据库中已经有5个待办事项，HTML将在服务器上编译。如果我将一个新的todo项目添加到列表中，客户端JS将使用相同的模板编译HTML。

I've heard a lot of buzz about Node.js, Backbone.js, etc. It is quite overwhelming just how many options there are for this sort of thing. Can anybody give me examples of using these technologies together?

我听到很多关于Node的议论。js,骨干。js，等等。对于这类事情，有这么多的选择实在让人难以接受。谁能给我举个例子说明这些技术在一起使用吗?

6 个解决方案

#1

Node.js is JavaScript on the server-side, while Backbone.js is used to structure your front-end stuff elegantly, using collections, models and views.

节点。js是服务器端JavaScript，而主干。js用于优雅地构造前端内容，使用集合、模型和视图。

Each of the two has their own role. For a better comparison between front-end frameworks you can check Addy Osmany's TODO list, written in a LOT of them: https://github.com/addyosmani/todomvc

两者都有各自的角色。要更好地比较前端框架，可以查看Addy Osmany的TODO列表，其中有很多:https://github.com/addyosmani/todomvc

There are some nice tutorials over the net on Backbone also:
- http://dailyjs.com/2011/04/04/node-tutorial-19/
- http://backbonetutorials.com/
- http://net.tutsplus.com/tutorials/javascript-ajax/getting-started-with-backbone-js/

在主干网站上也有一些不错的教程:http://dailyjs.com/2011/04/node tutorial-19/ - http://backbonetutorials.com/ - http://net.tutsplus.com/tutorials/javascript- ajax/getting-starwith - backbonbonbonbonnebone-js/

Here's an application that combines Node.js on the server with Backbone on the client:

这是一个结合了Node的应用程序。服务器上的js，客户端上的主干:

http://fzysqr.com/2011/02/28/nodechat-js-using-node-js-backbone-js-socket-io-and-redis-to-make-a-real-time-chat-app/

Backbone (like Node.js) is really popular so you would get a lot of help / resources online.

主干(比如Node.js)非常流行，所以你可以在网上得到很多帮助和资源。

#2

Sure. Check out TodoMVC to get a better idea of various alternatives.

确定。查看TodoMVC，了解各种替代方案。

#3

Paste the template file at the bottom of the page. This way your client code can use it easily without making a call to get the template.

将模板文件粘贴到页面底部。这样，您的客户端代码就可以轻松地使用它，而无需调用来获取模板。

An Example using JQuery when calling your template would be

调用模板时使用JQuery的示例是

<div style="display:none" id="sample_jquery_template">
  Hello ${name}
</div>

in your client side javascript code

在客户端javascript代码中

..javascript..
person = {name:'Joe'}
$.tmpl($("#sample_jquery_template").html(), person ).appendTo( "#destinationList" );

#4

There are enough templating solutions out there like mustache.js working on both ends.
But for working with the templates on the client-side it is helpful to have the rendered data available.
Henrik Joreteg wrote a nice article about reusing your backbone-models and syncing them between client and server.

有足够的模板解决方案，比如胡子。js在两端工作。但是，对于在客户端上使用模板，提供可用的数据是很有帮助的。Henrik Joreteg写了一篇很好的文章，介绍如何重用您的backbone模型，并在客户机和服务器之间同步它们。

#5

Dav Glass from Yahoo gave a good talk showing how he ran YUI3 on the client and server with node.js.

来自雅虎的Dav Glass做了一个精彩的演讲，展示了他如何使用node.js在客户端和服务器上运行YUI3。

Here is his github of the examples from the video:

以下是他在视频中举的例子:

You also might be interested in checking out jsdom

您可能还对签出jsdom感兴趣

I just started learning node and this video really helped me see how to experiment on the server and client with node. You will see him disable javascript and the calendar still works - that was cool.

我刚开始学习node，这个视频真的帮助我了解了如何在服务器和客户端上使用node进行实验。你会看到他禁用了javascript，而日历仍然可以运行——这很酷。

And here is a good backbone resource:

这里有一个很好的主干资源:

#6

You might have a look at http://derbyjs.com/#why_not_use_rails_and_backbone

您可以查看http://derbyjs.com/# why_not_use_rails_and_中枢

They try to achieve the following when opening a webapp:

他们在打开网络应用程序时，试图实现以下目标:

Transmit a completely rendered page on the first request.
在第一个请求上传输一个完全呈现的页面。
From then on all changes shall be directly made client side and synced to the server via ajax.
从那时起，所有的更改都将直接在客户端进行，并通过ajax同步到服务器。

So usually the first request a user makes to a site with a "fat" client is pretty painful:

所以，通常用户第一次请求一个“胖”客户端的网站是非常痛苦的:

App data has to be transferred and initialized
应用程序数据必须进行传输和初始化
Data has to be loaded by the Client
数据必须由客户端加载
Data is displayed
数据显示

This behavior is usually way slower than transmitting an oldschool like server side rendered page. Gmail or iCloud for example need some time to load up because they do it like this.

这种行为通常比传送旧学校服务器端呈现的页面要慢得多。比如Gmail或iCloud需要一些时间来加载，因为它们是这样做的。

#1