graphql是什么_为什么GraphQL是避免技术债务的关键

graphql是什么

GraphQL (not to be confused with GraphDB or Open Graph or even an actual graph) is a remarkably creative solution to a relatively common problem: How do you enable front end developers to access backend data in exactly the way they need it?

GraphQL(不要与GraphDB或Open Graph甚至是实际的图形混淆)是一个相对常见的问题的极富创造力的解决方案： 如何使前端开发人员以所需的方式完全访问后端数据？

Quick example: We want to display a list of products on a web page. So we write a service which returns a list of products. We make it super RESTful because that’s what someone on a podcast said we should do.

快速示例：我们想在网页上显示产品列表。 因此，我们编写了一个返回产品列表的服务。 我们使它成为超级RESTful，因为这是播客上的某人说我们应该做的。

{"items": [{"id": 2051,"name": "Extension Cord","price": 15,"productType": "Electrical","supplierName": "Northwind","shortDescription": "Outlet not where you need it? Extend your power to the right place at the right time",},{"id": 2053,"name": "LED Lamp","price": 14,"productType": "Hardware","supplierName": "Northwind","shortDescription": "Low power battery operated light",}]
}

Then we slap said products on the page. Go ahead and imagine a slapping sound. Or feel free to use this one here…

然后，我们在页面上拍了说产品。 继续想象一下拍手声。 或随时在这里使用此…

Now that we have everything done, someone decides we also need to display what quantity of each product we have in stock because of course they do.

现在我们已经完成了所有工作，有人决定我们还需要显示库存中每种产品的数量，因为他们当然这样做了。

Ok. I guess. I mean, you didn’t specify that in the original project document, but why not. Let’s just make the scope whatever you want it to be.

好。 我猜。 我的意思是，您没有在原始项目文档中指定它，但是为什么不指定呢。 让我们只是做任何你希望它是范围。

The product quantity information is a field in the database, but it’s not being returned by the service. In order to get to it from the front end, we have to modify the code of our service and then redeploy before we can even think about making changes on the front end. For one field.

产品数量信息是数据库中的一个字段，但服务未将其返回。 为了从前端获得它，我们必须修改我们的服务代码，然后重新部署，然后才能考虑在前端进行更改。 对于一个领域。

Likewise, if this same someone (who can’t seem to decide what they really want in life) decides that we no longer need the SKU, we can ignore it on the front end, but it’s part of the API response so it ends up being junk data in the payload, and pointless bits that our users don’t need.

同样，如果同一个人(似乎无法决定他们生活中真正想要的)决定我们不再需要SKU，则可以在前端忽略它，但这是API响应的一部分，因此最终是有效负载中的垃圾数据，以及我们的用户不需要的毫无意义的位。

Every project is just this back and forth of unforeseen changes. That’s literally the definition of “Software Development”. I mean it’s not, but my point sounds better if I reference a dictionary.

每个项目都是无法预料的变化的来回。 从字面上看，这就是“软件开发”的定义。 我的意思不是，但是如果我引用字典，我的观点听起来会更好。

The point is that we end up making a lot of trade-offs on both the front and back ends just to make things work and keep up with the pace of change. And trade-offs equal technical debt.

关键是，我们最终要在前端和后端进行很多权衡，以使事情正常进行并跟上变化的步伐。 权衡等于技术债务。

This is the very essence of the problem that GraphQL is trying to solve.

这是GraphQL试图解决的问题的本质。

I only recently put all the GraphQL pieces together in my own head. It wasn’t until my colleague Simona Cotin volunteered to teach me GraphQL that I had the epiphany that it is, perhaps, the answer to a problem that I’ve been trying to work around the bulk of my professional career.

我只是最近才把所有GraphQL片段放在一起。 直到我的同事Simona Cotin自愿教我GraphQL时，我才意识到这也许是对我一直在努力解决的大部分职业问题的答案。

与我们一起学习GraphQL (Learn GraphQL With Us)

Simona and I did three teaching sessions together and we recorded each one. In these three videos, you can learn with me as I go from zero knowledge about GraphQL, to implementing a GraphQL interface and then consuming it from a React application.

我和西蒙娜(Simona)一起进行了三场教学，每场我们都记录下来。 在这三个视频中，当我从对GraphQL的零知识到实现GraphQL接口，然后从React应用程序中使用它时，您可以与我一起学习。

Each video comes with a Github repo that you can clone to get the fully working solution in case you get lost along the way.

每个视频都带有一个Github存储库，您可以克隆该存储库以获取完整的解决方案，以防万一您迷路了。

We use Azure Functions a lot in this video series because it’s so much easier to build a Serverless API than it is to start from scratch. Grab a free Azure account if you don’t already have one.

在本视频系列中，我们经常使用Azure Functions，因为构建无服务器API比从头开始要容易得多。 如果您还没有免费的Azure帐户，请获取一个。

Create your Azure free account today | Microsoft AzureGet started with 12 months of free services and $200 USD in credit. Create your free account today with Microsoft…azure.microsoft.com

立即创建您的Azure免费帐户| Microsoft Azure 开始使用12个月的免费服务和200美元的信用额度。 立即使用Microsoft创建免费帐户… azure.microsoft.com

第1部分：GraphQL简介 (Part 1: Introducing GraphQL)

In the first video, Simona introduces me to the concepts of GraphQL and the quirky syntax that it uses. We also create the GraphQL API in this video and deploy it.

在第一个视频中，Simona向我介绍了GraphQL的概念及其所使用的古怪语法。 我们还将在此视频中创建GraphQL API并进行部署。

simonaco/serverless-graphql-apis-part1Contribute to simonaco/serverless-graphql-apis-part1 development by creating an account on GitHub.github.com

simonaco / serverless- graphql-apis-part1通过在GitHub上创建一个帐户为simonaco / serverless-graphql-apis-part1开发做出贡献。 github.com

第2部分：本地安装Graphiql并进行部署 (Part 2: Installing Graphiql locally and deploying)

In part 2, I get the Graphiql visual GraphQL testing tool running locally on my own machine and then deploy it to Azure Storage so I can easily test my GraphQL API without needing to wire up an application.

在第2部分中，我获得了在自己的计算机上本地运行的Graphiql可视化GraphQL测试工具，然后将其部署到Azure存储，因此我可以轻松地测试GraphQL API，而无需连接应用程序。

simonaco/serverless-graphql-apis-part2Contribute to simonaco/serverless-graphql-apis-part2 development by creating an account on GitHub.github.com

simonaco / serverless- graphql-apis-part2通过在GitHub上创建一个帐户为simonaco / serverless-graphql-apis-part2开发做出贡献。 github.com

第3部分：在React App中使用API (Part 3: Using the API in a React App)

We round out this series by looking at how to actually call this API from an application. That’s kind of an important detail.

我们通过研究如何从应用程序实际调用此API来完善本系列文章。 这是一个重要的细节。

simonaco/serverless-graphql-apis-part3Contribute to simonaco/serverless-graphql-apis-part3 development by creating an account on GitHub.github.com

simonaco / serverless- graphql-apis-part3通过在GitHub上创建一个帐户为simonaco / serverless-graphql-apis-part3开发 做出 贡献。 github.com

了解有关GraphQL的更多信息 (Learn more about GraphQL)

Once you understand the problem that GraphQL solves, you’ll start to see opportunities for it everywhere. And the best part is that you don’t have to start fresh to use it. In fact, it’s recommended that you use it on top of a typical REST API, so you’re likely in the perfect spot to use GraphQL today.

一旦了解了GraphQL解决的问题，您将开始在各地发现它的机会。 最好的部分是您不必重新使用它。 实际上， 建议您在典型的REST API之上使用它，因此您很可能今天就可以使用GraphQL。

If you want to go further with GraphQL and React, check out Wes Bos’s course. It’s paid, but it’s worth every penny. This is an investment you will be glad you made. Wes doesn’t pay me anything to say that. But maybe he should.

如果您想进一步了解GraphQL和React，请查看Wes Bos的课程。 它是付费的，但值得每一分钱。 这是一项投资，您会很高兴。 韦斯不付我任何费用。 但是也许他应该。

Advanced React & GraphQLBuild Full Stack Applications with React and GraphQLadvancedreact.com

Advanced React＆GraphQL 使用React和GraphQL构建全栈应用程序 advancedreact.com

翻译自: https://www.freecodecamp.org/news/why-graphql-is-the-key-to-staying-out-of-technical-debt-7915f8f59a9/

graphql是什么