零、前言
本书将通过展示如何应用基本和高级 React 模式来创建跨平台应用,帮助您将 React 知识提升到下一个层次。React 的概念以新开发人员和经验丰富的开发人员都能理解的方式进行描述;尽管 React 有帮助,但无需事先具备 React 经验
在本书的 12 章中,您将使用 React、React Native 或 React 360 创建一个项目。在这些章节中创建的项目实现了流行的 React 功能,例如用于重用逻辑的高阶组件(HOCs),用于状态管理的上下文 API,以及用于生命周期的挂钩。流行的库(如 React Router 和 React Navigation)用于路由,而 JavaScript 测试框架 Jest 用于为应用编写单元测试。此外,一些更高级的章节涉及 GraphQL 服务器,Expo 用于帮助您创建 React 本机应用
这本书是给谁的
本书面向希望探索 React 工具和框架以构建跨平台应用的 JavaScript 开发人员。web 开发、ECMAScript 和 React 的基本知识将有助于理解本书中涵盖的关键概念。
本书支持的 React 版本有:
- React-v16.10.2
- 反应本机-v0.59
- React 360-v1.1.0
这本书涵盖的内容
第 1 章第 1 章,第二章在反应环境中创建电影列表应用,探索建立可伸缩的反应项目的基础。将讨论和实践如何构建文件、要使用的包和工具的最佳实践。构建 React 项目的最佳方法是创建电影列表。此外,webpack 和 Babel 用于编译代码
第 2 章创建具有可重用 React 组件的渐进式 Web 应用,将解释如何在整个应用中设置和重用 React 组件中的样式。我们将构建一个 GitHub 卡应用,以了解如何在 JavaScript 中使用 CSS,以及如何在应用中重用组件和样式。
第 3 章构建了一个包含 React 和 Suspence的动态项目管理板,将介绍如何创建决定其他组件之间数据流的组件,即所谓的 HOCs。我们将构建一个项目管理板来查看整个应用中的数据流。
第 4 章使用 React Router构建基于 SSR 的社区订阅,将讨论路由,包括设置基本路由、动态路由处理以及如何设置用于服务器端渲染的路由。
第 5 章使用上下文 API 和挂钩构建个人购物清单应用,将向您展示如何使用带有挂钩的 React 上下文 API 来处理整个应用中的数据流。我们将创建一个个人购物列表,看看如何使用钩子和上下文 API 访问和更改从父组件到子组件的数据,反之亦然。
第 6 章使用 Jest 和 Enzyme构建一个探索 TDD 的应用,将重点关注带有断言和快照的单元测试。此外,还将讨论测试覆盖率。我们将构建一个 hotel review 应用,以了解如何测试组件和数据流。
第 7 章使用 React Native 和 GraphQL构建一个全栈电子商务应用,将使用 GraphQL 为应用提供后端。本章将向您展示如何设置基本 GraphQL 服务器并访问此服务器上的数据。我们将构建一个电子商务应用,以了解如何创建服务器并向其发送请求。
第 8 章使用 React Native 和 Expo构建房屋挂牌应用,将涵盖 React Native 应用的扩展和结构,这与使用 React 创建的 web 应用略有不同。本章将概述开发环境和工具(如世博会)的差异。我们将构建一个房屋清单应用来检查最佳实践。
第 9 章使用 React Native 和 Expo制作一个动画游戏,将讨论动画和手势,它们是移动应用与 web 应用的真正区别。本章将解释如何实现这些功能。此外,iOS 和 Android 之间手势的差异将通过构建一个具有动画和响应手势的纸牌游戏应用来体现。
第 10 章使用 React Native 和 Expo创建实时消息应用,将涵盖通知,这对于保持应用用户的最新状态非常重要。本章将介绍如何使用 Expo 添加通知并从 GraphQL 服务器发送通知。我们将学习如何通过构建消息应用来实现所有这些。
第 11 章使用 React-Native 和 GraphQL构建全栈社交媒体应用,将涵盖使用 React-Native 和 GraphQL 构建全栈应用。将演示服务器和应用之间的数据流,以及如何从 GraphQL 服务器获取数据。
第 12 章使用 React 360创建虚拟现实应用,将讨论如何通过创建全景查看器开始使用 React 360,该查看器使用户能够在虚拟世界中环视四周并在其中创建组件。
充分利用这本书
本书中的所有项目都是使用 React、React Native 或 React 360 创建的,并且要求您事先了解 JavaScript。尽管本书中介绍了 React 的所有概念和相关技术,但如果您想了解有关某个功能的更多信息,我们建议您参考 React 文档。在下一节中,您可以找到一些关于为本书设置计算机以及如何下载每章代码的信息。
安装你的机器
对于本书中创建的应用,您的计算机上至少需要安装 Node.js v10.16.3,以便运行 npm 命令。如果您的机器上没有安装 Node.js,请转到https://nodejs.org/en/download/ ,您可以在这里找到 macOS、Windows 和 Linux 的下载说明。
安装 Node.js 后,在命令行中运行以下命令以检查已安装的版本:
- 对于 Node.js(应为 v10.16.3 或更高版本):
node -v
- 对于 npm(应为 v6.9.0 或更高版本):
npm -v
此外,您应该已经安装了React Developer Tools插件(用于 Chrome 和 Firefox),并将其添加到浏览器中。此插件可以从Chrome 网络商店(中安装 https://chrome.google.com/webstore 或 Firefox 插件(https://addons.mozilla.org 。
下载示例代码文件
您可以从您的账户www.packt.com下载本书的示例代码文件。如果您在其他地方购买了本书,您可以访问www.packtpub.com/support并注册,将文件通过电子邮件直接发送给您。
您可以通过以下步骤下载代码文件:
- 登录或注册www.packt.com。
- 选择“支持”选项卡。
- 点击代码下载。
- 在搜索框中输入图书名称,然后按照屏幕上的说明进行操作。
下载文件后,请确保使用以下最新版本解压或解压缩文件夹:
- WinRAR/7-Zip for Windows
- 适用于 Mac 的 Zipeg/iZip/UnRarX
- 适用于 Linux 的 7-Zip/PeaZip
该书的代码包也托管在 GitHub 上的https://github.com/PacktPublishing/React-Projects 。如果代码有更新,它将在现有 GitHub 存储库中更新。
我们的丰富书籍和视频目录中还有其他代码包,请访问https://github.com/PacktPublishing/ 。看看他们!
下载彩色图像
我们还提供了一个 PDF 文件,其中包含本书中使用的屏幕截图/图表的彩色图像。您可以在这里下载:https://static.packt-cdn.com/downloads/9781789954937_ColorImages.pdf 。
使用的惯例
本书中使用了许多文本约定。
CodeInText
:表示文本中的码字、数据库表名、文件夹名、文件名、文件扩展名、路径名、虚拟 URL、用户输入和 Twitter 句柄。下面是一个示例:“由于您将在本章中构建一个电影列表应用,请将此目录命名为movieList
代码块设置如下:
{
"name": "movieList",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC"
}
当我们希望提请您注意代码块的特定部分时,相关行或项目以粗体显示:
import React from 'react';
import ReactDOM from 'react-dom';
+ import List from './containers/List';
const App = () => {
- return <h1>movieList</h1>;
+ return <List />;
};
ReactDOM.render(<App />, document.getElementById('root'));
任何命令行输入或输出的编写方式如下:
npm init -y
粗体:表示一个新术语、一个重要单词或您在屏幕上看到的单词。例如,菜单或对话框中的单词出现在文本中,如下所示。下面是一个示例:“当用户单击“关闭 X”按钮时,组件的显示样式规则将设置为“无”
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,转载请注明出处