GraphQL 从入门到实践

Blackjun 发布于2019-08-26 13:36 / 482人阅读

摘要：本文实例代码什么是是一种面向数据的查询风格。概述前端的开发随着框架全面普及，组件化开发也随之成为大势所趋，各个组件分别管理着各自的状态，组件化给前端仔带来便利的同时也带来了一些烦恼。

本文首先介绍了 GraphQL，再通过 MongoDB + graphql + graph-pack 的组合实战应用 GraphQL，详细阐述如何使用 GraphQL 来进行增删改查和数据订阅推送，并附有使用示例，边用边学印象深刻~

如果希望将 GraphQL 应用到前后端分离的生产环境，请期待后续文章。

本文实例代码：Github

0. 什么是 GraphQL

GraphQL 是一种面向数据的 API 查询风格。

传统的 API 拿到的是前后端约定好的数据格式，GraphQL 对 API 中的数据提供了一套易于理解的完整描述，客户端能够准确地获得它需要的数据，没有任何冗余，也让 API 更容易地随着时间推移而演进，还能用于构建强大的开发者工具。

1. 概述

前端的开发随着 SPA 框架全面普及，组件化开发也随之成为大势所趋，各个组件分别管理着各自的状态，组件化给前端仔带来便利的同时也带来了一些烦恼。比如，组件需要负责把异步请求的状态分发给子组件或通知给父组件，这个过程中，由组件间通信带来的结构复杂度、来源不明的数据源、不知从何订阅的数据响应会使得数据流变得杂乱无章，也使得代码可读性变差，以及可维护性的降低，为以后项目的迭代带来极大困难。

试想一下你都开发完了，产品告诉你要大改一番，从接口到组件结构都得改，后端也骂骂咧咧不愿配合让你从好几个 API 里取数据自己组合，这酸爽

GPU云服务器云服务器 python3入门到实践 spark从入门到前端从入门到精通云计算从入门到精通

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/109157.html

GraphQL 搭配 Koa 最佳入门实践

摘要：如下图嗯，如图都已经查询到我们保存的全部数据，并且全部返回前端了。如图没错，什么都没有就是查询服务的界面。写好了之后我们在配置一下路由，进入里面，加入下面几行代码。 GraphQL一种用为你 API 而生的查询语言，2018已经到来，PWA还没有大量投入生产应用之中就已经火起来了，GraphQL的应用或许也不会太远了。前端的发展的最大一个特点就是变化快，有时候应对各种需求场景的变化，不...

MoAir 2019-08-21 18:39 评论0 收藏0
21 分钟学 apollo-client 系列：获取数据

摘要：分钟学是一个系列，简单暴力，包学包会。一旦组件挂载后，会自动进行数据请求，前提是客户端提供的和后端的相符。如果回调返回直接不作请求。在组件内进行分页请求之前提到了，这个装饰器为添加了对象，其中有个函数为。 21 分钟学 apollo-client 是一个系列，简单暴力，包学包会。搭建 Apollo client 端，集成 redux使用 apollo-client 来获取数据修改本...

robin 2019-08-22 11:10 评论0 收藏0
专治前端焦虑的学习方案

摘要：不过今天我希望能够更进一步，不仅仅再抱怨现状，而是从我个人的角度来给出一个逐步深入学习生态圈的方案。最后，我还是想提到下对于的好的学习方法就是回顾参照各种各样的代码库，学习人家的用法与实践。本文翻译自A-Study-Plan-To-Cure-JavaScript-Fatigue。笔者看到里面的几张配图着实漂亮，顺手翻译了一波。本文从属于笔者的Web Frontend Introduc...

codeGoogle 2019-08-21 14:41 评论0 收藏0
GraphQL 的入门指南

摘要：允许创建零配置的服务器。这是一种人类可读的模式语法，称为规范与描述语言。类型是表示外观的自定义对象。为此，创建一个名为的新查询。这意味着无论何时在服务器中发生事件，并且每当调用该事件时，服务器都会将相应的数据发送到客户端。 showImg(https://segmentfault.com/img/bVbm0c1?w=2560&h=1024); 想阅读更多优质文章请猛戳GitHub博客,...

马忠志 2019-08-16 14:20 评论0 收藏0