3.1.1 前端开发的主要任务

1．构建查询

由于Schema的存在，在前端开发中并不需要关注后端的实现细节和所用技术，在前端只需要对数据按需取用。也有很多开发者把这种方式称为声明式数据取用（Declarative data fetching）。

那么怎么声明呢？其实就是根据业务逻辑和需求来构建GraphQL的查询操作——Query，Mutation以及Subscription等。

2．拿到数据

构建好查询，客户端就可以发送查询请求到服务器端，然后解析服务器端返回的结果，让前端的其他模块可以自由使用这些结果数据。一些成熟的GraphQL客户端还会使用缓存（cache）来避免去服务器端请求重复的数据，提升前后端通信的效率。使用缓存还有另外的一个好处，让客户端应用可以有一定的离线（offline）能力，比如说在网络临时中断的时候，也有部分功能可以响应用户的操作。

3．显示数据

GraphQL服务器端返回的结果是JSON格式的数据，开发者在服务器端要把这些数据映射成前端的UI元素（UI element）。比如从后端拿到一个产品列表，就是一个JSON数组的形式，需要把这些数据转换为可显示的——用户觉得好看和易于使用的形式。

在GraphQL前端开发中，其实构建查询和显示数据是一一对应的，有什么样的查询就显示什么样的数据，或者说需要显示什么样的数据，就构建什么样的查询。

4．和数据互动

数据显示好后，还要允许用户和UI互动，比如点击、修改、查询、翻页操作等。需要注意的是，有些互动在前端就可以解决，而不需要去“烦扰”服务器端——比如把一个已经获得数据的回复列表折叠。但也会有很多互动一定要发送请求给服务器端——比如回复一个帖子。在这种情况下，GraphQL前端项目会起到把用户操作映射到GraphQL查询的作用。当然，也可以理解为在处理用户操作的时间处理中，向服务器端发送GraphQL请求。