RESTful Web的前端设计

Question

我正在开发一个RESTful web。

我希望前端看起来漂亮(即专业的和抛光的)--但我不是一个设计师，大多数设计师不知道JSON是什么，或者不知道如何处理我的web的JSON输出。

我正在考虑使用ReactJS或AngularJS来组装一个前端，但我不是一个设计师，这是一个最好由设计师来完成的工作--问题是大多数设计师不知道如何处理JSON输出，所以我处于一个恶性循环中.

我的问题是这个(假设没有专业的网站模板，我可以使用的角度/反应-因为我找不到任何)

有什么实用的方法来解决不作为一个设计人员的问题，以及必须与那些不了解JSON输出的设计人员进行交流？

Answer 1

1. 如果你的设计师准备好学习新东西，那么你必须告诉他。 学习JSON这是很容易的。
2. 如果他还没有准备好，只要告诉他在设计时放入虚拟数据，一旦设计完成，您就可以绑定API，从而获得实际数据。

简单的第二点示例假设您的设计人员设计Select，如

设计师设计

<select class="XYZ">
 <option>Customer</option>
 <option>Client</option>
 <option>Users</option>
</select>

开发人员在React中的修改

<select className="XYZ">
    {Data} 
</select>

这里，{ data }是什么，但您必须将该选项与API数据绑定，如

var Data=Object.keys(response).map(function(_res){
         return(
            <option>response[_res].Name</option>
            )
          }); 

Answer 2

首先，作为一个角/webapi开发人员，您将不会处理设计部分，因为这将由设计师完成。

如果我已经完全理解了你的问题，我想举一个例子，说明你(作为一个角锥/webapi开发者)和设计师将如何一起工作和交流。

考虑一下这个方法，

有一个项目，你和你的设计师必须工作。你对客户的要求很高。现在设计师开始他的工作了。比方说，在某个时候，他需要用ui-li标签列出一个列表。作为angularjs/webapi开发人员，您已经编写了一个返回列表(json)的webapi。

{"id":"1","name":"title1",
"id":"2","name":"title2",}

现在，您的设计人员不了解这种语法。那么，问题是他如何对HTML进行适当的设计呢？很简单，

他将制作或编写纯html标记。假设他在纯html代码下面编写了一个列表，

..。(设计人员将编写静态代码)

<ul>
  <li> something1 </li>
  <li> something2 </li>
</ul>

..。

现在您要做的是，接受/考虑/检查他的html代码，并相应地修改他的html代码，以便与ANGULARjs一起使用它。

你要修改它如下..。(angualr开发人员将编写动态代码)

<ul>
  <li ng-repeat="title in titiles"> {{title.name}} </li>
</ul>

..。

注意:我已经用RESTful编写了上千个.net Web，并且我也是.net的开发人员，我已经修改了设计人员给出的静态代码。

我希望这能帮到你。