此文是作者考虑 GraphQL 在 Node.js 架构中的落地方案后所得。从最初考虑可以(以内置中间件)加入基础服务并提供完整的构建、发布、监控支持,到最终选择不改动基础服务以提供独立包适配,不限制实现技术选型,交由业务团队自由选择的轻量方式落地。中间经历了解除误解,对收益疑惑,对最初定位疑惑,最终完成利弊权衡的过程。
我们的业务后台使用开发rpc服务,然后通过包一层http给前端调用。因为历史遗留问题,前期项目赶进度导致遗留了很多技术债。例如:
很久之前其实就关注过这个技术,记得当时还是React刚刚崭露头角的时期吧。总之那时候,GraphQL感觉还只是概念完备阶段,除了FB自己内部大量使用外,好像社区并不是很健全,不过大家应该都在疯狂的讨论和跟进吧。过了2年,如今再回过头来看,已经涌现出各种开源或商用服务专注于这个领域,各种语言的框架和工具也都很完备了,感觉是时候重新接触GraphQL了。如果你的项目正处于技术选型,你正在犹豫选择一种接口风格的时刻,不妨了解一下这个神奇而强大的玩意儿~~
当一个应用的规模逐渐扩张,其所包含的应用状态一般也会变得更加复杂。作为开发者,我们可能既要协调从多个远端服务器发送来的数据,也要管理好涉及 UI 交互的本地数据。我们需要以一种合适的方法存储这些数据,让应用中的组件可以简洁地获取这些数据。 许多开发者告诉过我们,使用 Apollo Client 可以很好地管理远端数据,这部分数据一般会占到总数据量的 80% 左右。那么剩下的 20% 的本地数据(例如全局标志、设备 API 返回的结果等)应该怎样处理呢? 过去,Apollo 的用户通常会使用一个单独的 Red
内容来源:2018 年 6 月 9 日,国内某大型电商公司用户体验部门前端开发专家邓若奇在“杭州第一届 GraphQLParty—GraphQL与领域驱动带来的协同价值”进行《基于SPA架构的GraphQL工程实践》演讲分享。IT 大咖说(微信id:itdakashuo)作为独家视频合作方,经主办方和讲者审阅授权发布。
先回到会议的主题,为什么会开这么一个会议?原本这个会议报名的时候希望可以控制到 100 人之内,不要超过 120 人,结果报到 250 人还爆满了,后来没有办法,我们只能从工作经验来筛选,选择工作经验在三年以上的比较资深的工程师,和一部分 2 年经验工作经验的,还有 5 年的,10 年甚至更久的从业者。
了解事物幕后的运作方式往往有好处,但并非总是如此。 因为不必使事情过于复杂。而可视化图形界面在处理这么一个场景中,是首当其冲的。
GraphQL 由于其灵活性和高效性,已经成为构建 API 的热门选择。当与 React.js 结合使用时,这个强大的 JavaScript 库为创建动态、响应式的 Web 应用程序打开了无限的可能性。在本指南中,我们将介绍如何将 GraphQL 无缝集成到您的 React.js 项目中。
GraphQL 是一个用于 API 的查询语言,是一个使用基于类型系统来执行查询的服务端运行时。GraphQL 并没有和任何特定数据库或者存储引擎绑定,而是依靠你现有的代码和数据支撑。
传统的api调用一般获取到的是后端组装好的一个完整对象,而前端可能只需要用其中的某些字段,大部分数据的查询和传输工作都浪费了。graphQL提供一种全新数据查询方式,可以只获取需要的数据,使api调用更灵活、高效和低成本。
Egg.js 简介:https://eggjs.org/zh-cn/index.html
本文的目的是提供一份快速指南 -- 《如何快速在如何在 Node.js 中创建安全的 GraphQL API》。
今天最常讨论的术语之一是 API,很多人不知道 API 到底是什么,API 是 Application Programming Interface(应用程序编程接口)。顾名思义,它是一些预先定义的函数,目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力,而又无需访问源码,或理解内部工作机制的细节。
之前闲着无聊写的一个 Redux 项目,今天突然想把它做成动态数据源,很早之前使用 Gatsby 的时候尝试过 GraphQL 觉得不错,所以就试着集成了一下。
本文的目标是提供关于如何创建安全的 Node.js GraphQL API 的快速指南。
GraphQL 是由 Facebook 开发并开源的。提到 GraphQL ,大家自然而然会提起 RESTful api。下面对比一下 RESTful api 和 GraphQL 的优缺点。
英文:Igor Ribeiro Lima 译文:众成翻译/乐何 zcfy.cc/article/graphql-overview-build-a-to-do-list-api-with-a-react-front-end-mdash-sitepoint 设想你想要参考食谱烤一个蛋糕。你将需要一些原料,并且一些合适的量。如果你能拿一个盒子装好你烘焙所需要的各种原料 ,并且已经称量好匹配菜谱的份量,那肯定会让烘焙更简单。如果你把前端 UI设想成一块蛋糕的话,那这就是GraphQL所做的事。 在本教程中我们将
关于React生态系统的一系列令人敬畏的事情。 React React一般资源 React社区 React在线游乐场 React教程 React通用教程 React钩子 React和TypeScrip
GraphQL 在我们之前的项目中的使用情况非常不错,后端可以只需要专注于合理的 Schema 设计与开发,并不需要太关心界面上的功能交互,在前端我们用 Apollo GraphQL 替代了 Redux 结合 React 也获得了很好的开发体验 (还在用 Redux,要不要试试 GraphQL 和 Apollo?) 。
2018 年了,Reason 生态发展了不少,而且正好看到一篇文章的作者也抱着这种心态尝鲜 React + graphql,索性调研一下,看看这套前沿的方案是否有落地对可能性。
在本文中,我们将了解 monorepo 是什么,以及 monorepos 如何帮助以更好的开发体验更快地开发应用程序。我们将讨论使用Nx开发工具管理 monorepo 的优势,并学习如何使用这些工具构建Next.js应用程序。
除了 REST 以外,很多 API 都开始支持 GraphQL,甚至完全支持它了。但是,如果你需要使用一个 GraphQL API,你很自然就会想到自己需要使用 React 和 / 或其他一些库才能让它跑起来。这是因为许多教程和示例代码似乎都基于这样一个假设,也就是说如果你在使用 GraphQL,就需要使用这些库。
付文平,携程机票研发部前端开发总监。2011年加入携程,主要负责携程机票PC、H5、Hybrid业务方面的开发工作。先后负责机票PC前后端分离,H5 Swift改版,机票React Native技术的推进,重点关注Node.js技术和产品体验。
为了获取服务端GraphQl接口的数据,客户端需要使用apollo这个插件,三大前端框架均可以将apollo集成,下面以vue为例来说明在客户端如何集成vue-apollo这个插件。
每隔一段时间就能看到一篇 GraphQL 的文章,但是打开文章一看,基本上就是简单的介绍下 GraphQL 的特性。很多文章其实就是 github 上找个 GraphQL 的项目,然后按照对应的 demo 跑起来而已。有些文章明显是没有完整的项目实践经历,却在狂吹 GraphQL 的各种优点,让不熟悉 GraphQL 的同学以为这是神丹妙药,弄不好还要在项目中实践一番。
本文首先介绍了 GraphQL,再通过 MongoDB + graphql + graph-pack 的组合实战应用 GraphQL,详细阐述如何使用 GraphQL 来进行增删改查和数据订阅推送,并附有使用示例,边用边学印象深刻~
GraphQL 既是一种用于 API 的查询语言也是一个满足你数据查询的运行时。它由Facebook开发和开源,强烈地表达了代码即文档的期望。能够精确有效地得到数据,没有冗余。
微服务架构是一种将应用程序构建为一组小服务的方法,每个服务运行在其自己的进程中,并通过轻量级机制(通常是HTTP资源API)进行通信。这些服务围绕业务能力构建,可以独立部署,由完全自治的团队维护。在我们深入构建微服务的过程之前,了解 GraphQL 在此架构中的作用非常重要。
阅读本文的知识前提:熟悉 TypeScript + GraphQL + Node.js + Decorator + Dependency Inject 等概念。本文选用技术框架是 Midway.js,设计思路可以迁移到 Nest.js 等框架上,改动量应该不会太大。 本文长约 1.3w 字,阅读时间约 20min
ZEIT 是一个部署平台, 可以部署很多东西, 主要目的是部署一些 Serverless 的项目
接上一篇文章,由于 express 现在仍然是主流的 Node.js 服务端框架,所以今天看看 ApolloServer 怎样和 express 集成构建 GraphQL 服务。另外今天文章也顺便讲一下怎么使用 typescript 来实现。
我认为,GraphQL 将改变世界。将来,你可以使用 GraphQL 查询世界上的任何系统。我在创造这样的未来。那么我为什么要对使用 GraphQL 进行辩驳呢?我个人最讨厌的是,社区一直在宣传 GraphQL 的好处,而这些好处却非常普通,并且与 GraphQL 实际上没有任何关系。如果我们想推广采用,那么我们应该诚实,应该摘掉有色眼镜。这篇文章是对 Kyle Schrade 的文章“为什么使用 GraphQL”的回应。这并不是批评。这篇文章是一个很好的讨论基础,因为它代表了我在社区中经常听到的观点。如果你读了整篇文章,当然这会花一些时间,你就会完全理解,为什么我认为 Kyle 的文章应该改名为“为什么使用 Apollo”。
大概率你听说过 GraphQL,知道它是一种与 Rest API 架构属于 API 接口的查询语言。但大概率你也与我一样没有尝试过 GraphQL。
接上一篇文章,上一篇通过 express 作为 GraphQL Server 介绍了一下 GraphQL,今天说一下如何使用 Apollo Server 作为 GraphQL服务器。
mkdir graphqljs cd graphqljs npm init npm install --save graphql touch hello.js 编辑hello.js var { graphql, buildSchema } = require('graphql'); var schema = buildSchema(` type Query{ hello:String }`); var root = { hello: () => 'Hello world!' }; gr
我的博客最初是用 Github Pages 默认的 Jekyll[2] 框架,其使用的 Liquid[3] 模板引擎在使用上有诸多不便。
在Koa中使用GraphQL主要有以下几步: 1. 安装 graphql、koa-graphql 和 koa-mount。 2. 引入koa-mount 和 koa-graphql。 3. 引入自定义的schema,其中定义schema又分为以下几步: (1). 定义查询字段的schema类型。 (2). 定义一个根 , 根里面定义调用schema类型的方法。 (3). 把根挂载到 GraphQLSchema。 4. 配置中间件,注意要放在实例化koa之后。 下面用代码来说明具体的实现步骤: 首先是Koa中
编者按:本文作者奇舞团前端开发工程师何文力,同时也是 W3C CSS 工作组成员。
注意:GraphQL 是 api 的查询语言,而不是数据库。从这个意义上说,它是数据库无关的, 而且可以在使用 API 的任何环境中有效使用,我们可以理解为 GraphQL 是基于 API 之上的一 层封装,目的是为了更好,更灵活的适用于业务的需求变化
WebAssembly 相对其它 web 标准来说,稍显新颖。但 wasm 的应用范畴和方向,却十分广阔。关于其优势所在,本文不做赘述,网上有许多分析比较的文章。我们从 Rust 周报趋势来领会,可以发现 Rust 官方在 WebAssembly 上投入了不少精力。Rust 社区中,Rust + WebAssembly 的应用也比较热门,其文章和话题增长趋势显著。
在Express中使用GraphQL主要有以下几步: 1. 安装 graphql 和 express-graphql。 2. 引入express-graphql。 3. 引入自定义的schema,其中定义schema又分为以下几步: (1). 定义查询字段的schema类型。 (2). 定义一个根 , 根里面定义调用schema类型的方法。 (3). 把根挂载到 GraphQLSchema。 4. 配置中间件,注意要放在实例化express之后。 下面用代码来说明具体的实现步骤: 首先是Express中的主
GitHub - octokit/octokit.js: The all-batteries-included GitHub SDK for Browsers, Node.js, and Deno.
三种基本操作 Query(a read‐only fetch), Mutation(a write followed by a fetch), Subscription(订阅,不常用,适合长连接业务)
Gatsby 是一个令人难以置信的静态站点生成器,它允许使用React作为渲染引擎引擎来搭建一个静态站点,它真正具有现代web应用程序所期望的所有优点。它通过在构建时通过服务器端渲染将动态的 react 组件呈现为静态 HTML 内容。这意味着您的用户可以获得静态站点的所有好处,比如不使用JavaScript、搜索引擎友好性、非常快的加载速度等等,也并没有失去现代web所期望的活力和交互性。一旦呈现为静态 HTML,客户端站点的React和JavaScript会接管它并添加动态的内容。 Gatsby 最近发布了v1.0.0,推出了很多新特性。包括(但不限于)使用GraphQL创建内容查询的能力,与各种cms集成——包括WordPress、Contentful、Drupal等等。还有基于路由的代码分布使得用户体验更佳。在这篇文章中,我们将深入探讨 Gatsby 和一些新特性,并创建一个静态博客。让我们开始吧!
接前面的文章,考虑这么一种场景,有时候我们希望根据某些参数条件来决定返回某些字段。比如下面的查询操作,有时候我们希望返回name字段,有时候不希望。
前端爱好者的知识盛宴 JavaScript渗透的范围越来越广,它能做的事情已经远不止前端开发而已。 掌握2018最新JS趋势,很有必要! 不久前stateofjs.com刚刚发布了一份2017 JavaScript现状报告,现在Ryan Chartrand非常应景地推出了2018年的JavaScript发展趋势,下面把这两份文章一起结合来看,让作为JS开发者的你少走弯路。 首先看看火爆2017的vue。 React vs. Vue.js 我们开门见山,直接上好东西吧:认为Vue可能会成为React的一大
随着多终端、多平台、多业务形态、多技术选型等各方面的发展,前后端的数据交互,日益复杂。
领取专属 10元无门槛券
手把手带您无忧上云