（说明：文中多图，大部分截图来自 The Net Ninja 的 GraphQL Tutorial，十分棒的教程！）
一、什么是 GraphQL？
- GraphQL 是一种强大的查询语言；
- 是客户端和服务器进行通讯的中介；
- 比 REST API 更加灵活高效，因此被认为是 REST API 的接替者。
GraphQL
What is GraphQL?
二、GraphQL vs REST API
- 相比于 REST API 的接口灵活性差、接口操作流程繁琐，GraphQL 的声明式数据获取，使得接口数据精确返回，数据查询流程简洁，照顾了客户端的灵活性。
- 客户端拓展功能时要不断编写新接口（依赖于服务端），GraphQL 中一个服务仅暴露一个 GraphQL 层，消除了服务器对数据形状或大小进行硬编码的需要，将客户端与服务端分离，可进行单独维护和改进。
- REST API 基于HTTP协议，不能灵活选择网络协议，而传输层无关、数据库技术无关使得 GraphQL 有更加灵活的技术栈选择，能够实现在网络协议层面优化应用。
A RESTful Approach
A GraphQL Approach
REST API Endpoints
Walking the Graph...
三、GraphQL 思考模型——一切皆是图
GraphQL流程
Project Overview
创建 GraphQL server 的最终目标是允许查询通过图和节点的形式去获取数据。
四、GraphQL 核心概念
- 定义 API Schema（包括类型以及操作数据的 API 定义）
type 类型名 {
字段名: 类型
}
A schema 代表了图的形式，它描述了在这张图上的数据，描述了对象类型以及这些对象类型之间的关系，描述了我们如何进入这张图并且如何和图中的数据进行交互，包括查询以及改变数据。
- 数据操作
数据操作
👉 具体参考：GraphQL 初探—面向未来 API 及其生态圈
五、项目技术栈
Graphiql
React + Apollo
The React App Use Apollo
通过使用 Apollo clients 将查询绑定到我们的组件：Apollo 能够帮助我们创建查询并且将查询绑定到组件，因此，当一个组件在浏览器中渲染的时候，Apollo 在幕后处理查询（发给服务端，并且返回想要的结果），然后，我们就可以将结果渲染到组件中。
ps：国内的项目好像不太能感受到 REST API 的痛点，不过还是期待能够在全栈的道路上小试牛刀～
六、参考
- Getting Started With GraphQL.js：GraphQL官网
- GraphQL中文网
- GraphQL Tutorial：很棒的教程！
- graphql-playlist：Graph QL实战项目
- 安息吧 REST API，GraphQL 长存
- [译] 我经常听到的 GraphQL 到底是什么？
- GraphQL 初探—面向未来 API 及其生态圈
- The Anatomy of a GraphQL Query：GraphQL语法图解
- The Fullstack Tutorial for GraphQL：HOW TO GRAPHQL
- Learn Apollo tutorial：GraphQL Client
网友评论