Web 2.0生态系统/技术栈

Question

作为一个刚接触前端网站开发的新手，我能理解一些东西，比如路由、ORM等。但我不太明白这些东西是怎么一起工作的。我了解到，使用Pyramid、Django等框架构建网站时，有很多组件：

1. 模板引擎：这是一个可以把你的HTML和代码分开的工具。这样做很有道理。

2. SQLAlchemy等：这是一个ORM工具。没问题。

3. 渲染器：我完全不明白这个是什么。

4. JavaScript库：比如JQuery等：我不知道这些有什么用，除了添加一些好看的效果。它们是怎么和模板引擎互动的？又是怎么和整个框架互动的？我可以在Pyramid里写JQuery的代码吗，还是说我需要单独写JS，把我的JS文件放到模板里，或者...？

5. 表单模板库（formish、formalchemy等）：这些和整体有什么关系？它们是怎么接入的？

还有其他我遗漏的重要组件吗？

所以，有人能帮我解释一下这些组件是怎么搭配在一起的吗？

Answer 1

3) 渲染器。没什么头绪。

一般来说，渲染器的作用是把你的数据或模型转换成客户端想要的东西。如果客户端是浏览器，那么渲染器通常会把你的数据通过一个模板处理，生成HTML页面。如果客户端是一些JavaScript代码，或者是非浏览器的应用程序（比如桌面应用，或者是另一个正在使用你数据的服务器等），那么渲染器通常会生成JSON（或者可能是XML）。你可以把这看作是一种数据序列化或封装的方式。

4) JS库：

这些是用来编写用户界面的工具。用户界面可能只是一些漂亮的效果加在HTML上，但也可以更复杂。例如，Google Docs就是用JavaScript做的，不仅仅是漂亮的效果；Cloud9 IDE也是一个用JavaScript构建的完整应用程序（感谢Raynos提供的另一个例子）。

5) 表单模板库

你可以把这些看作是模板引擎的宏系统。如果你有一个数据结构，那么你可以用这些工具生成模板片段，并自动处理服务器端返回数据的相关操作。

还有其他重要的组件我遗漏了吗？

你可以把现代的网络架构看作是一个传统的客户端-服务器系统；这可能会让一些人不高兴，但这里没有什么根本性的变化，除了可能的规模问题。客户端是用HTML和CSS来布局的，用JavaScript（可能还会有一些工具包）来实现功能和视觉效果。服务器则是某种类型的网络服务器。客户端和服务器之间的通信通常是通过HTTP结合JSON和HTML来完成的。你可以把web-1.0（愿神明原谅我这种营销术语）看作是老式的傻终端，而web-2.0更像是一个有点智能的X终端。

Answer 2

1) 模板引擎：这是一个可以让你把HTML和代码分开的工具。这样做很有道理。

市面上有好几种这样的模板引擎。Mako尝试在模板中使用很多常见的Python写法，这样你就不用学习很多新概念。Jinja2和Django类似，但功能更多。Genshi则适合喜欢基于XML的模板的人。

对于刚接触这些的朋友来说，哪种最简单开始其实很难说。也许Jinja2比较合适。

2) SQLAlchemy等。一个ORM。没问题。

没错。

3) 渲染器。我不太清楚。

渲染器是Pyramid中的一个视图配置选项，它告诉Pyramid，如果你的视图返回一个字典，那么就应该把这个字典传给指定的“渲染器”。渲染器是根据文件扩展名来设置的，Pyramid自带了几种内置的渲染器：http://docs.pylonsproject.org/projects/pyramid/1.0/narr/renderers.html#built-in-renderers

简单来说，渲染器选项只是查看你传给它的名称，然后找到一个与扩展名（如.mak、.pt、'json'、'string'等）匹配的模板引擎，并用它来渲染字典结果。

在很多框架中，你不需要把渲染器作为配置来指定，而是在视图中写一些代码，通常看起来像这样：

def somefunc(request):
    return render_to_response('/some/template.mak', {})

在Pyramid中，你可以用以下方式实现：

@view_config(renderer='/some/template.mak')
def somefunc(request):
    return {}

后者的几个优点包括：

1. 当完全通过配置来设置时，你可以在不改变视图代码逻辑的情况下覆盖渲染器。

2. 你可以添加多个配置，根据其他条件来改变渲染器。

考虑这个例子，它根据HTTP请求是否为XHR（想要JSON格式结果的AJAX请求，而不是想要HTML的普通HTTP请求）来改变渲染器。

@view_config(renderer='json', xhr=True)
@view_config(renderer='/some/template.mak')
def somefunc(request):
    # lookup some_dict_data in a db, etc.
    return some_dict_data

4) JS库：JQuery等。我不知道这些有什么用，除了添加一些好看的效果。它们和模板引擎有什么关系？它们和整个框架是怎么互动的？我可以在Pyramid中写jQuery代码，还是要单独写JS，把我的JS文件插入到模板中……？

JS库让你写JavaScript变得更简单。它们在浏览器中与DOM（文档对象模型）互动，除了向你的网络应用发送HTTP请求（可能想要JSON格式的结果）外，与Pyramid没有其他互动。

一开始，我建议你完全忽略JavaScript，直到你对HTML、DOM树有了更深入的了解，并且能用HTML、CSS和网络应用构建一个能正常工作的站点。

5) 表单模板库（formish、formalchemy等）这些和整体有什么关系？它们是怎么接入的？

我强烈建议你完全忽略这些，先写一些基本的HTML表单元素。你刚接触整个网络开发的过程，真的没有必要直接跳到最复杂的部分，先熟悉基础知识更重要。

不过，在你写完基本表单后，你会需要一个表单验证库，这样可以更方便地检查提交的表单是否包含有效的参数。在PHP的早期，人们会写成百上千行的if/else语句来处理表单（有些人现在仍然这样做！）。

现在我们使用表单验证库，可以轻松声明表单的有效参数。我建议你从FormEncode开始，因为它在验证方面相对简单。对于Pyramid，使用FormEncode最简单的方式可能是pyramid_simpleform：http://packages.python.org/pyramid_simpleform/

目前，忽略表单渲染部分，自己在模板中写HTML表单元素，使用pyramid_simpleform仅用于方便的FormEncode集成。

总之，先从用视图函数和模板显示HTML页面和链接开始（使用URL调度，它比遍历对初学者更容易理解）。然后添加表单、它们的HTML和验证，再添加CSS来开始美化页面。

接下来，你可以开始用jQuery写一些基本的JavaScript，让页面上的东西动起来，然后逐步学习如何通过AJAX与网络应用互动获取更多数据。只要不要一次性尝试太多，应该能更容易地理解它们是如何结合在一起的。