课程简介

GraphQL 逐渐成为了在现代网络和移动应用中使用 API 的新方式。

然而,学习新事物总是需要时间,而且如果不弄脏手,就很难了解新技术的细微差别。

因此,我们组建了一个强大而简洁的课程,它将在最短的时间内向您介绍GraphQL并将GraphQL集成到您的前端堆栈中。

我们将探讨GraphQL的基本原理,以及使GraphQL特别适合现代应用的东西,比如它的实时功能!该课程的观点很简单,一旦您掌握了基本原理,您就可以继续选择您喜欢的库和工具,并定制您的工作流程。

关键议题和采取的方式:

  • GraphQL 与 REST
  • GraphQL 查询、变更、订阅
  • 使用Apollo设置GraphQL客户端
  • 在您的React应用程序中集成GraphQL查询
  • 将GraphQL突变与查询变量相结合,以处理形式输入
  • 使用Apollo缓存在GraphQL变更后更新本地状态(表单输入)
  • 在GraphQL变更后,对本地状态和用户界面进行优化更新,以实现流畅的用户体验
  • 使用带有订阅hook的订阅
  • 使用变更和订阅建立一个带有通知的实时馈送

我们要构建什么?

我们将使用认证的的GraphQL API创建一个实时的待办事项应用程序。

试试这个应用程序的部署版本,看看我们将要构建什么:https://learn-hasura-todo-app.netlify.com/

本课程也会教授React概念吗?

不,我们将模拟一个场景,其中我们已经有一个GraphQL API和一个React应用的基本用户界面构建。在这种情况下,我们的任务是将 GraphQL API 集成到我们的 React 应用程序中,以构建一个完整且可运行的应用程序。

如果您是 React 中的 Hooks 的新手,我们建议您阅读官方文档,然后再回到这里!

学习该教程需要准备什么?

你需要运行npm/yarn和节点 8+。

完成该教程需要多长时间?

不到 2 小时

其他课程

前端:GraphQL用于:VueAngularElmReasonReact

移动:GraphQL用于React NativeiOSAndroidFlutter

后端:在 30 分钟内使用 Hasura构建实时 GraphQL 后端(前端、后端或全栈开发人员的理想选择)

关于社区作者

Apoorv Vardhan
Apoorv VardhanTwitter IconGithub Icon
Loves to try out and build new things!
Christoph Benjamin Weber
Christoph Benjamin WeberTwitter IconGithub Icon
Software developer, interested in frontend technologies.
Did you find this page helpful?
Start with GraphQL on Hasura for Free
  • ArrowBuild apps and APIs 10x faster
  • ArrowBuilt-in authorization and caching
  • Arrow8x more performant than hand-rolled APIs
Promo
footer illustration
Brand logo
© 2024 Hasura Inc. All rights reserved
Github
Titter
Discord
Facebook
Instagram
Youtube
Linkedin