Question

我们团队中有软件开发人员（PHP，SQL）和网页设计师（HTML，CSS，JS，Foundation，Bootstrap）。

典型情况：软件开发人员在设计由另一个人完成时实现业务逻辑。

问题：只要前端设计发生变化，设计人员就必须向开发人员发送新设计，他们必须跟踪变更并修改源。

问题：有哪些工具/方法可供设计人员直接使用Twig模板，并在没有后端开发人员帮助的情况下将更改应用于HTML / CSS / JS（如果可能，不安装Symfony和LAMP）？

或者在更高层次上 - 在Symfony 2中分离后端和前端开发的最佳实践是什么？

Answer 1

或者在更高级别 - 分离后端的最佳做法是什么和前端发展？

前端团队可以在模板中工作并向您发送标记，然后后端开发人员将使用数据来装饰它，这通常就是这样做的。

<强> BUT：

您可以采取的最佳方法来完全分离后端＆＃39;来自前端的工作＆＃39;工作正在做。：

创建后端逻辑以按需提供数据（Web服务/ API），而不是为视图提供服务，使用干净的主体发送响应，该主体仅包含可读格式的数据，如json对象。

然后前端开发人员可以向Web服务发出相应的请求以获取数据并用它来装饰他们的模板。

您唯一需要做的就是为他们提供一个URL，该URL将为他们正在使用的模板提供数据，以及他们在请求该URL时将接收的预期输出/格式，因此他们这样做甚至不需要任何服务器工作，他们可以在测试/创建视图时模拟您的响应。

个人观点： 我认为即使对于简单的应用程序，这种方法也很棒。

<强>为什么吗

如果您将后端创建为Web服务/ API，则可以轻松扩展它，在某些时候您的应用程序将被第三方应用程序使用，或者您只想创建本机移动应用程序版本，或者随你。如果是这种情况，你就不需要再写任何东西了。

简历

我已经看到了应该为网页提供服务的巨大项目，然后它变得流行起来，它以第三方的使用量而不是网络本身结束，并且没有为此做好准备。他们最终开发了一个Web服务，其中一半功能用于第三方应用程序，并且对于他们添加到Web服务层的每个功能，他们使用了更多代码，更多测试等等。

来吧，还在写吗？

谈到网页开发，你可以让你的前端专注于展示页面的数据，风格和事件，而后端人员则专注于添加新功能， 所以没有人需要分散对方团队的注意力 只是因为他们不知道一方的工具是如何工作的， 对我来说值得花时间保存。

Answer 2

我可以推荐的唯一“最佳实践”是与网页设计师交流并了解他们的需求。

因为TWIG几乎是纯HTML

这是完全错误的。 TWIG可能看起来像HTML，但它完全与数据有关。询问你的设计师，他们是否愿意在浏览器中看到类似的东西，而不是实际数据：

List of Products
{% for product in products %}
{% endfor %}

不知何故，我认为这对他们不起作用。

我想可能有一个工具可以将TWIG转换成真正的HTML，但是什么用作数据呢？如果它与后端数据不匹配，则会出现问题。

我建议你需要教你的开发人员如何使用composer update以及你的源代码控制系统。数据库应该不是问题。您可以在某个地方拥有一个设计人员数据库，后端人员可以随时了解最新信息。其他人可以安装和配置LAMP堆栈，

你甚至可以设置虚拟设计师机器（可能还有流浪汉），这些机器将完全加载设计师为特定项目所需的任何软件。您的开发人员可能会发现这些虚拟机也很有用。

另一种方法是核选择。不要使用TWIG。你的后端变成了一个web api，只处理数据。没有后端生成html。您的设计师现在可以完全控制前端。可能有点激进，但似乎确实是行业的发展方向。

Answer 3

Twig与Symfony控制器有关，用于＆＃34;数据＆＃34;。

如果您的设计师想要修改twig模板的html部分，他们可以直接进入模板。如果他们想要添加与特定数据相关的其他元素，则应该与后端开发人员一起使用，以便更新控制器代码并将此数据从后端填充到前端部分。

如果您使用symfony仅提供数据（基于前端的大量AJAX请求的JSON），我认为设计人员可以在本地安装中单独使用接口和模拟JSON数据，而无需使用symfony代码。

Answer 4

没有＆＃34;最佳实践＆＃34;在Symfony 2中分离后端和前端开发，仅仅是因为它使用MVC模式，它本身将商务逻辑与视图分开。您的所有视图都收集在一个目录中，设计人员唯一的工作就是显示数据。控制者和所有后端的东西聚集在其他地方，对他们来说是不可见的。

Symfony不是义务（虽然它是你想要在这里做什么的完美工具），但是我建议你选择一个实现MVC模式的框架，因为它是最简洁的开发方式，并确保您的代码从现在开始很长时间都是可维护的。

Answer 5

我将用PHP分享我们的解决方案/实践，它将前端工作与后端完全分开，我们的设计人员和开发人员在不同的部门分开，他们通过redmine的门票连接，但是在大多数情况下，他们不需要彼此沟通，而且在大多数情况下他们的工作也不会与他人互动。

Out解决方案基于java / javascript，我们只是开发了自己的框架来解决前后分离的问题。目前我们有两个独立的框架来解决这个问题，一个用于Java的服务器端渲染，另一个用于javascript的客户端渲染/绑定，一个客户端javascript MVVM框架。

首先，我们框架的基本思想是将所有模板渲染逻辑与html模板分离，因此我们的html模板是真正的纯HTML文件，没有任何后端入侵。

第二步，我们的设计师将完成他们对独立html文件的工作，而不考虑后端逻辑。然后在同一时间，我们的后端人员将通过分离的java / js源编写后端渲染/逻辑。

假设我们有一个如下的html文件：

<div><input name="name"></div>
<div><span id="name-preview"></span></div>

我们将通过java执行服务器端渲染，如下所示：

Render.create()
      .add("[name=name]", "value", user.name)
      .add("#name-preview", user.name);

我们也可以通过javascript执行客户端双向绑定，如下所示：

Aj.init(function($scope){
  $scope.data = {};
  $scope.snippet("body").bind($scope.data, {
      name:[
         Aj.form({name: "name"}), //bind the $scope.data.name to input[name=name] in 2-way
         "#name-preview" //bind the $scope.data.name to #name-preview in 1-way
      ]
  });
});

如上例所示，我们使用通用的css选择器来描述我们想要将值呈现/绑定到的位置和方式。

事实上，在我们的实践中，超过90％的前端重构不需要后端方面的帮助。即使在左边10％的情况下我们的后端人员必须修复损坏的渲染/绑定，修复也会变得非常简单，因为我们只需要在大多数情况下更改目标css选择器。

最后，虽然我们用Java实现了我们的服务器端框架，但我们相信它可以移植到任何其他语言，如PHP，ruby，python等。

服务器端框架：

https://github.com/astamuse/asta4d

客户端框架：

https://github.com/astamuse/asta4js

在Symfony2框架中分离前端开发

5 个答案: