javascript - 什么是动态 Web UI 开发的正确方法 : template based

Question

我有一个要求，即用户可以为他的页面选择不同的模板，例如用户个人资料页面，我们的网络应用程序应该提供多种类型的模板来显示个人资料，用户可以选择任何一个模板。将来我们可能会通过为用户提供更多模板自由来增强相同的功能，他可以按照自己的方式自定义模板，

自定义模板的示例是:他可以将个人资料图片从左侧移动到右侧，他可以更改背景颜色等。

这种 UI 的最佳方法是什么？我是否需要保留整个页面的元数据然后在客户端创建它？我是否需要在服务器端创建整个 html 并在客户端加载它？

是否有用于此类 UI 开发的 JADE/Node.js 框架？我对这种开发完全陌生，所以建议我正确的方法。

Answer 1

您可以很容易地完成此操作，如下所示:

1. 向用户呈现一个表单和一个列出主题选项的选择框(或替代框)。将其保存到他们用户下的数据库中，或者如果您的应用程序没有真正的后端可言，那么您可以将其保存到本地存储(尽管在这种情况下，设置可能会在用户端的太久之前重置)。

2. 使用 JS，在页面加载时，确定他们选择的值(AJAX 调用或检查本地存储)并动态地将一个类附加到他们的个人资料页面周围的包装器，例如profile--colorful、profile--thin等

3. 使用这些类在 CSS 中为每个配置文件设置不同的样式。