零、前言
React是一个开源、适应性强的 JavaScript 库，用于从称为组件的小而独立的位构建复杂的用户界面。本书将帮助您有效地使用 React，使您的应用程序更灵活、更易于维护，并提高其性能，同时通过提高速度而不影响质量，极大地提升您的工作流程。
您将首先了解 React 的内部结构，然后逐步编写可维护和干净的代码。接下来的章节将向您展示如何构建跨应用程序可重用的组件，如何构造应用程序，以及如何创建实际工作的表单。稍后，您将利用您的知识，探索如何设计 React 组件并优化它们，使应用程序更快、响应更快。最后，您将学习如何有效地编写测试，以及如何为 React 及其生态系统做出贡献。
在本书的结尾，您将能够避免反复试验和开发过程中的头痛问题，相反，您将拥有高效构建和部署真实世界的 React web 应用程序所需的技能。
这本书是给谁的
这本书是为那些希望增加对 React 的理解并将其应用于实际应用程序开发的 web 开发人员而编写的。假设具有 React 和 JavaScript 的中级经验。
这本书涵盖的内容
第 1 章介绍了 React的第一步，涵盖了一些基本概念，这些概念对于遵循本书其余部分非常重要，对于每天使用 React 非常重要。我们将学习如何编写声明性代码，并将清楚地了解我们创建的组件和元素在屏幕上显示实例时使用的组件之间的区别。然后，我们将了解选择将逻辑和模板放在一起的原因，以及为什么这个不受欢迎的决定是 React 的一大胜利。我们将讨论在 JavaScript 生态系统中感到疲劳的常见原因，但我们也将看到如何通过迭代方法避免这些问题。最后，我们将看到新的create-react-appCLI 是什么，有了它，我们就可以开始编写真正的代码了。
第 2 章清理您的代码，教您很多关于 JSX 如何工作以及如何在我们的组件中正确使用它的知识。我们从语法的基础开始，创建一个坚实的知识库，使我们能够掌握 JSX 及其特性。我们将研究 ESLint 及其插件如何帮助我们更快地发现问题，并在我们的代码库中实施一致的风格指南。最后，我们将学习函数式编程的基础知识，以了解编写 React 应用程序时要使用的重要概念。既然我们的代码是干净的，我们就准备开始深入研究 React，并学习如何编写真正可重用的组件。
第三章React Hooks教您如何使用新的 React Hooks 以及如何构建自己的 Hooks。
第 4 章探索流行的组合模式，解释如何组合我们的可重用组件并使它们有效地通信。然后，我们将介绍 React 中一些最有趣的组成模式。我们还将看到 React 如何试图解决使用 mixin 在组件之间共享功能的问题。然后，我们将学习如何处理上下文，而无需将组件与上下文耦合，这要感谢 HOCs。最后，我们将看到如何通过遵循functionalshild模式动态组合组件。
第 5 章，通过实际项目了解 GraphQL，解释了如何在实际项目中使用 GraphQL 查询和突变，您将学习如何使用 GraphQL、JWT 令牌和 Node.js 构建身份验证系统。
第 6 章管理数据介绍了一些最常见的模式，让孩子和家长使用回调进行沟通。然后，我们将学习如何使用公共父级在未直接连接的组件之间共享数据。我们将从一个简单的组件开始，该组件将能够从 GitHub 加载数据，我们将使其与 HOCs 可重用，然后继续学习如何使用react-refetch将数据获取模式应用于我们的组件，并避免重新发明轮子。最后，我们将学习如何使用新的上下文 API。
第 7 章为浏览器编写代码，从表单创建到事件，我们可以通过 React 针对浏览器做不同的事情；从动画到 SVG。React 为我们提供了一种声明性的方式来管理创建 web 应用程序时需要处理的所有方面。React 允许我们访问实际的 DOM 节点，我们可以使用它们执行命令式操作，如果我们需要将 React 与现有命令库集成，这非常有用。
第 8 章让您的组件看起来漂亮研究了常规 CSS 可能不是设计组件样式的最佳方法的原因，以及各种替代解决方案。在本章中，我们将学习在 React 中使用内联样式，以及它的缺点，这些缺点可以通过使用 Radium 库修复。最后，将介绍一个新的图书馆styled-components，以及它提供的现代方法的概要。
第 9 章中的服务器端渲染以获取乐趣和利润邀请您按照特定步骤设置服务器端渲染应用程序。到本章结束时，我们将能够构建一个通用的应用程序，并了解其优缺点。
第 10 章提高应用程序的性能简要介绍了 React 性能的基本组成部分，以及我们如何使用一些 API 来帮助库找到更新 DOM 的最佳路径，而不会降低用户体验。我们还将学习如何使用一些可以导入代码库的工具来监控性能和发现瓶颈。最后，我们将看到不变性和PureComponent是构建快速反应应用程序的完美工具。
第 11 章测试和调试解释了为什么测试我们的应用程序很重要，并概述了我们可以使用 React 创建测试的最流行工具。我们还将学习建立一个 Jest 环境来测试使用酶的组件，并讨论什么是酶以及为什么它是测试 React 应用程序所必须的。通过涵盖所有这些主题，在本章末尾，我们将能够从头创建一个测试环境，并为应用程序的组件编写测试。
第 12 章React Router介绍了在我们的应用程序中帮助我们实现 React Router 的一些步骤。接下来，当我们完成每个部分时，我们将添加动态路由，并了解 React 路由的工作原理。我们将学习如何安装和配置 React 路由，以及向路由添加组件、精确道具和参数。
第 13 章要避免的反模式都是关于我们在使用 React 时应该避免的常见反模式。我们将研究为什么改变状态对性能有害。本章还将介绍选择正确的键和帮助协调者，以及在 DOM 元素上传播道具不好的原因以及我们如何避免这样做。
第 14 章部署到生产，介绍了如何在 Google Cloud 的 Ubuntu 服务器上使用 Node.js 和 nginx 部署我们的 React 应用程序，以及如何配置 nginx、PM2 和域。还将介绍为持续集成实施 CircleCI。
第 15 章、下一步演示了我们如何通过打开问题和拉取请求来为 React 库做出贡献，并解释了回馈社区和共享代码的重要性。最后，我们将介绍推动开源代码时需要记住的最重要方面，以及如何发布npm包以及如何使用语义版本控制。
充分利用这本书
要掌握 React，您需要具备 JavaScript 和 Node.js 的基本知识。本书主要针对 web 开发人员，在撰写本书时，读者做出了以下假设：
- 读者知道如何安装 Node.js 的最新版本。
- 读者是能够理解 JavaScript ES6 语法的中级开发人员。
- 读者对 CLI 工具和 Node.js 语法有一定的经验。
下载示例代码文件
您可以从 GitHub 的下载本书的示例代码文件 https://github.com/PacktPublishing/React-17-Design-Patterns-and-Best-Practices-Third-Edition 。如果代码有更新，它将在现有 GitHub 存储库中更新。
我们的丰富书籍和视频目录中还有其他代码包，请访问https://github.com/PacktPublishing/ 。看看他们！
下载彩色图像
我们还提供了一个 PDF 文件，其中包含本书中使用的屏幕截图/图表的彩色图像。您可以在这里下载：https://static.packt-cdn.com/downloads/9781800560444_ColorImages.pdf 。
使用的惯例
本书中使用了许多文本约定。
CodeInText：表示文本中的码字、数据库表名、文件夹名、文件名、文件扩展名、路径名、虚拟 URL、用户输入和 Twitter 句柄。下面是一个示例：“将下载的WebStorm-10*.dmg磁盘映像文件作为系统中的另一个磁盘装载。”
代码块设置如下：
html, body, #map {
height: 100%;
margin: 0;
padding: 0
}
当我们希望提请您注意代码块的特定部分时，相关行或项目以粗体显示：
const name = `Carlos`
const multilineHtml = `<p>
This is a multiline string
</p>`
console.log(`Hi, my name is ${name}`)
任何命令行输入或输出的编写方式如下：
npm install -g @babel/preset-env @babel/preset-react
粗体：表示一个新术语、一个重要单词或您在屏幕上看到的单词。例如，菜单或对话框中的单词出现在文本中，如下所示。下面是一个示例：“从管理面板中选择系统信息。”
Warnings or important notes appear like this. Tips and tricks appear like this.
联系
我们欢迎读者的反馈。
一般反馈：如果您对本书的任何方面有疑问，请在邮件主题中注明书名，并发送电子邮件至customercare@packtpub.com。
勘误表：尽管我们已尽一切努力确保内容的准确性，但还是会出现错误。如果您在本书中发现错误，如果您能向我们报告，我们将不胜感激。请访问www.packtpub.com/support/errata，选择您的书籍，单击 errata 提交表单链接，然后输入详细信息。
盗版：如果您在互联网上发现我们作品的任何形式的非法复制品，请您提供我们的位置地址或网站名称，我们将不胜感激。请通过copyright@packt.com与我们联系，并提供该材料的链接。
如果您有兴趣成为一名作家：如果您对某个主题有专业知识，并且您有兴趣撰写或贡献一本书，请访问authors.packtpub.com。
评论
请留下评论。一旦你阅读并使用了这本书，为什么不在你购买它的网站上留下评论呢？然后，潜在读者可以看到并使用您的无偏见意见做出购买决定，我们 Packt 可以了解您对我们产品的看法，我们的作者可以看到您对他们书籍的反馈。非常感谢。
有关 Packt 的更多信息，请访问Packt.com。
版权属于：月萌API www.moonapi.com，转载请注明出处
