👋 欢迎参加我们的 Lift-off 系列的第 II 部分！
在 Lift-off I 中，我们为 Catstronauts 应用程序（这是一个能让想要探索宇宙的猫咪学习的平台）构建了主页网格功能。我们使用优先模式和模拟的静态数据设计了该功能。我们将一个模拟的条目多次显示，以填充主页网格的卡片。
现在是时候让此应用程序连接到真正的实时数据了！
在本课程结束时，你的 Catstronauts 主页将如下所示
点火序列...
先决条件
我们的应用程序在后端使用 Node.js，在前端使用 React。对于本课程，我们只会在后端工作。
说明：在本课程中，我们使用 Apollo Server 3。如果你需要 参考 Apollo 文档在上课程的同时，确保你处于 v3 的文档设置中！
克隆存储库
在你选择的目录中，使用首选的终端，克隆应用程序的起始存储库
git clone -b v1 https://github.com/apollographql/odyssey-lift-off-part2
注意：上述 git clone命令可能与你习惯使用的命令略有不同。本课程使用的是开始代码库 v1。 点击此处访问本课程的最新版本。
项目结构
本库与 Lift-off I 的内容互为衔接。我们的项目是一个全栈应用程序，其中后端应用程序位于 server/目录中，而前端应用程序位于 client/目录中。
你还可以找到 final/文件夹。其中包含完成课程后的项目的最终状态。欢迎将其用作指南！
以下为文件结构
📦 odyssey-lift-off-part2┣ 📂 client┃ ┣ 📂 public┃ ┣ 📂 src┃ ┣ 📄 README.md┃ ┣ 📄 package.json┣ 📂 server┃ ┣ 📂 src┃ ┃ ┣ 📄 index.js┃ ┃ ┣ 📄 schema.js┃ ┣ 📄 README.md┃ ┣ 📄 package.json┣ 📂 final┃ ┣ 📂 client┃ ┣ 📂 server┗ 📄 README.md
现在，使用你最喜欢的 IDE 打开此存储库。
注意：本课程中的示例均使用 npm；但如果你愿意，也可以改用 yarn。
让我们从服务器应用程序开始操作。
在终端窗口中，导航到库的 server目录并运行以下内容以安装依赖项并运行该应用程序：
npm install && npm start
如果一切顺利，你将看到安装已完成，并且控制台中的消息将指示服务器正在运行。
接下来是客户端应用程序。
在一个新的终端窗口中，导航到库的 client目录并运行以下内容以安装依赖项并启动该应用程序：
npm install && npm start
控制台应显示大量输出和一个指向正在 localhost:3000上运行的应用程序的链接。你可以在浏览器中导航到 https://127.0.0.1:3000，查看我们的主页，其中显示一张轨道卡并重复几次。这是我们在第一部分中设置的模拟数据。
要了解我们的 GraphQL 服务器缺乏什么才能与实时数据一起使用以及它将如何得知从哪里获取什么，让我们退一步探讨 GraphQL 查询过程。
GraphQL 查询之旅
在客户端
我们的网络应用需要获取远程数据来填充其主页。
要获取该数据，它会向我们的 GraphQL 服务器发送一个 查询。该应用将查询塑造成一个定义了 字段的 选择集的字符串。然后，它使用 HTTP POST或 GET请求将该查询发送到服务器。
在服务器端
当我们的服务器接收到 HTTP 请求时，它首先会提取包含 GraphQL 查询的字符串。它会对该字符串进行解析并将其转换为它可以更好地操作的形式：一个树形结构的 文档，称为 AST（抽象语法树）。有了这个 AST，服务器会根据架构中 字段和 类型验证 查询。
如果任何内容有误（例如，架构中未定义请求的 字段或者 查询格式错误），服务器将抛出错误并将其直接发送回应用。
在这种情况下，查询是正确的，且服务器可以“执行”它。这意味着，服务器可以继续进行处理并实际获取数据。服务器遍历 AST。
对于 查询中的每个 字段，服务器都会调用该字段的 解析器函数。解析器函数的工作是根据正确的来源（例如数据库或 REST API）为其字段填充正确的数据，从而来“解析”其字段。
由于所有 查询的 字段已经解决，因此数据将经过组装最终生成一个有序的 JSON 对象，其形状与查询完全相同。
服务器将此对象分配给 HTTP 响应正文的 data键，现在是返回给应用程序的时候了。
返回客户端
我们的客户端收到带着完全所需数据的响应，将该数据传递到相应组件以便进行渲染，瞧，我们的主页正在从远程数据中显示其卡片。
这就是 GraphQL 查询的历程！
分享你的问题和对这节课的意见
你的反馈有助于我们不断完善！如果你遇到困难或困惑，请告诉我们，我们会帮助你。所有评论都是公开的，并且必须遵守 Apollo 行为准则。请注意，已解决或已处理的评论可能会被删除。
你需要一个 GitHub 账户才能在下方发帖。还没有吗？ 改在我们的 Odyssey 论坛发帖。