React Native：初学者指南中缺少的部分。

本文最初发表于 Obytes 博客。

过去几个月，我一直与Barmej的团队合作，使用React Native构建一款移动应用。我突然想到要写一篇关于这个项目的文章，分享我的观点、想法以及一些初学者常见问题的解答。这篇文章面向所有具有 React Web 背景的开发者，主要讲解如何开始使用 React Native 构建应用。

在本文中，我不会讨论设置和基本内容。相反，我将回答您在构建 React Native 应用程序时肯定会问的一些关键问题。

本文分为几个部分。在每个部分中，您将找到与 React Native 开发相关的问题的答案。

让我们开始吧！！

做好准备

如果你正在阅读这篇文章，那你已经准备好了！但首先，让我解释一下“做好准备”是什么意思。众所周知，大多数 React Native 开发者同时也是 Web 开发者。超过 70% 的 React Native 开发者一直从事 Web 开发和 React.js 相关的工作。如果你的情况也是如此——很可能是这样——那么我很遗憾地告诉你，你将错过精彩的 Web 开发体验。因为在移动设备上的体验将截然不同。

这并不意味着 React.js 移动端尚未成熟，而是因为 Web 平台上每天都会发生很多令人惊奇的事情。不过，我保证，这种体验会比使用原生语言（Android 和 Swift）开发有趣得多。

正如 React Native 官方文档中提到的，React Native 使用热重载 (Hot Reloading) 来更快地构建应用程序。您可以立即重新加载应用程序，而无需重新编译。如果您来自 React Web 开发领域，我相信您已经熟悉它并且它对您来说很有效。然而，在移动应用程序构建中，如果您不够小心，很可能会丢失热重载功能！尤其是当您的移动应用程序规模逐渐增大时，因为 HMR 不支持 React Native 上的函数式组件。

这就是为什么你需要做好准备！

React Native 难度曲线（React Native 难吗？）

如果你熟悉 Web 中的 React.js，那么你正处于学习 React-native 的阶段！如果不熟悉，我认为开始学习 React-native 的最佳方式是构建一个简单的 React Web 项目，这样你就可以学习一些 React.js 和 React.js 生态系统的基础知识，而不会受到平台问题的困扰，因为这些问题可能会阻碍你学习 React Native 的新路径。

我想在本节中强调的下一个重要思想是难度曲线，以及在 React Native 项目中何时会遇到困难。

作为一名拥有 React.js 背景的开发者，我相信我们刚开始使用 React Native 时会遇到一些困难。让某些东西直接显示在屏幕上很简单，并不难，但如果遇到更复杂的情况，比如启动导航或一些原生的、比较棘手的功能，你就得开始使用一些第三方库了。而使用其中一些库并不会给你带来理想的体验。

下图准确地解释了我的 React Native 体验。当我用一些基础的东西开始一个新项目时，感觉就像“等等，还有什么比这更简单的吗”。然后，在使用一些第三方库之后，项目进展缓慢，而且我面临许多与这些库升级相关的问题。这很正常，因为维护一个 React Native 开源项目并非易事。你需要拥有扎实的 JS、Java 和 Swift 基础。这些第三方库是由一些很棒的人开发的，他们可能只是出于爱好。他们没有为此获得报酬，所以质量并不总是处于最佳状态。（说到这个，我想赞扬 React Native 社区的出色工作！）

React Native init 与 expo

要使用 React Native 启动新项目，您需要 Android Studio 和 XCode。Android Studio 意味着设置 Java 环境。XCode 意味着您只需要一台 MAC 笔记本电脑，是的！！当 expo 进入 React Native 生态系统时，他们引入了一种无需使用 Android Studio 或 Xcode 即可构建整个移动应用程序的新方法。我相信他们做得很好，允许非 MAC-OS 用户也开始构建 iOS 应用程序。不仅如此，expo 还具有一些很棒的功能，例如推送通知、资产管理器以及毫无困难地与测试人员共享应用程序。expo 有一个主要问题是它不支持本机模块。这个问题是我选择而不是react-native initExpo 的原因之一。老实说，我不想在我的应用程序中添加额外的层。

这并不意味着“不要使用 expo！”，Expo 对很多人来说都非常有用，而且 React Native 团队也react-native-create-app使用 expo SDK 实现了它。我认为，创建你的第一个应用，然后迁移到“react-native init”方式，这是最佳选择。你可以在 Reactjs 社区GitHub 仓库上的这个公开讨论问题中阅读更多关于此主题的内容。

iOS 或 Android（我需要学习 Java/Swift 的东西吗）

我强烈建议你具备一些 Java 和 Swift 的使用经验。这会非常有帮助，让你更好地掌控自己的工作。如果你有时间，我建议你观看一些介绍 Java 和 Swift 应用架构和配置基础知识的教程。这些经验可能会对你在应用构建过程中遇到的一些关键情况产生重大影响。例如，升级项目中的一些第三方库或为原生模块添加一些功能，至少需要一些 Gradle 配置经验。

与本节相关的最后一个建议是，我强烈建议先从 iOS 开始开发。这关系到 iOS 相对于 Android 平台的稳定性。在 iOS 平台上开发比在 Android 平台上开发要容易得多。

状态管理和 API

这部分需要你的React.js经验，或许你正在使用 Redux 或 Mobx 来管理应用状态，你也可以使用它们。但是移动平台比 Web 平台有一些特定的要求。这意味着必须实现一些额外的功能，例如离线功能、缓存策略和一些乐观更新。

在 Barmej 开发过程中，我们选择了 redux、redux-observable 和 redux-persist 技术栈，并使用与 Web 应用相同的 REST API，并尽可能多地使用 Web 应用代码。然而，一段时间后，我们发现该应用的性能并未达到我们预期的最​​佳水平。这源于我们需要进行大量的 API 调用，以及为了实现缓存和离线支持而进行的规范化处理。

能够加入这样一个优秀的团队，并承担风险将 REST API 迁移到 GraphQl API，让我的工作更加轻松。使用像 apollo-client 这样的 GraphQl 客户端，它几乎包含了我们所需的所有开箱即用功能，有助于使应用构建更加流畅，并且更具原生体验。

至此，我们确信 GraphQl 堆栈优于 Redux 堆栈。我们正在着手移除 Redux 堆栈依赖，并使用 context API 进行本地状态管理，并使用 apollo-client 进行 API 管理。

结论

本文到此结束。在应用开发过程中遇到挑战性的情况很正常。我们使用 React Native 已经有一段时间了，我们对自己的选择深信不疑。

我很快会发布另一篇有关 React Native 开发的文章，敬请关注，别忘了关注我。

感谢阅读！如果你觉得这篇文章对你有帮助，那么它肯定也会对很多人有所帮助，那就赶紧分享吧！因为“分享就是关爱”！

本文最初发表于 Obytes 博客。