摘要：鉴于我平常使用的是系统，就决定我只开发安卓客户端，客户端我们又招了一个小伙伴。一般来讲，安卓系统是这一两年市面上常用机型配置的系统。
从去年的10月份开始，我的大部分工作重心从传统的前端开发转向了使用ReactNative开发APP，在这个过程当中，走过了不少弯路，也遇到了一些技术相关的问题，但总算没有辜负那些对我信任的人。经历过痛苦和无助，终于坚持了下来，一个月的时间把产品成功部署上线了。想想这些日子其中不乏有一些经验，先愿意拿出来和大家交流交流，其中难免有一些不是最优的方法和方案，还望大家多提意见。
背景一开始为了快速的开展业务，我们决定把产品先通过H5的形式进行线上运行，终于在两周的高效率工作情况下，我们产品上线了，但相比较APP，使用H5开发，不能满足我们的产品需要，随后就决定开发APP，但公司这个时候没有APP开发的相关人员，我只好硬着头皮上了，通过学习ReactNative相关的基本知识，然后不断的向身边一些做过RN开发的朋友取经，使用RN开发APP的工作，才慢慢的走上正轨，起初，我打算IOS和安卓都用RN开发，但考虑到工作量和日常的一些事情，我一个人难免会耽误大家的进度。鉴于我平常使用的是window系统，就决定我只开发安卓客户端，IOS客户端我们又招了一个小伙伴。这样我的工作就有APP开发，H5开发，管理后台相关的支持等事情需要做。
基础工作开发APP的基础框架包，一开始使用create-react-app，再后来使用react-native-dva-starter作为基础的框架包。相比较create-react-app这个基础的框架，后者增加了dva和react-navigation模块，其中dva是一个基于redux和redux-saga的数据流方案，主要是为了管理我们项目当中的数据的，其中包括，数据请求，数据模型，数据存储，react-navigation是一套路由系统，可以帮助我们实现页面跳转，并管理历史跳转数据。数据的请求我们可以使用HTML5提供的fetch，也可以像通常开发H5页面那样使用Axios，毕竟请求数据这件事情，只不过是为了发起一个ajax请求，然后把数据拿回来就好，使用什么不太紧要，我在项目当中实际使用Axios来完成这部分的事情。准备好了上面相关的内容之后，我们最最基础的代码内容算是弄好了，后面就可以通过一些第三方的npm包，为你的项目加砖添瓦了；以下是我的项目当中用到的第三方包列表：
react-native-splash-screen 开屏广告
react-native-swiper 图片轮播
react-native-pdf 支持显示PDF文件
react-native-picker 列表选择
react-native-root-tips toast提示框
react-native-dialog dialog模态框
react-native-checkbox-component checkbox组件
react-native-linear-gradient 实现渐变
react-native-version-number APP版本号管理
react-native-device-info 获取设备信息
react-native-contacts-wrapper-pro 获取用户联系人
react-native-code-push APP热更新
react-native-image-picker 通过图片列表和拍照选择图片
以上不是全部，有些可能没有列出来，一个包的需不需要，往往是根据我们的需求来的，如果可以，你可以添加其他的包进来。
代码结构以上是不完全的目录结构，具体的内容，各位看官可以去我的代码仓库中去下载，查看详细的内容。我会在文章的底部附上代码相关的地址。
预备知识和环境工欲善其事必先利其器，以上我忽略了一个重要的部分，就是环境搭建的过程。这部分工作说起来不容小觑，没有这一步的胜利，后面所有的事情，都是白搭。关于环境，我们需要一个安卓的模拟器和打包和运营的JAVA环境，以及开发安卓APP相关版本的SDK包。具体环境的搭建详情，大家可以去
这里看，然后大家需要有react，webpack，redux的基础知识，以及对MVVM设计思想的初步了解，这样后续的事情，开展起来会顺利一些，不然就会一步三坑，看的一脸懵逼。
对了，开发安卓APP，大家一定要了解安卓各个版本在现在的安卓手机中使用的情况，比如说，3年前我们安卓的客户端，最低只支持安卓4.0的系统，然后向上兼容，如果你现在用的是安卓手机，你可以查看下你自己的机器系统版本是多少。一般来讲，安卓8.0系统是这一两年市面上常用机型配置的系统。我的项目当中，是基于安卓8.0系统进行开发的，所以说说，创建安卓虚拟机的时候，我会下载相关版本的SDK，明白了这些，你在开发时候下载SDK的时候，就可以有选择了，不用一股脑的把所有版本的SDK下载到本地，毫不夸张的说，所有安卓版本的SDK资源的大小应该不会小于50G，而且这些资源是从国外那边下载的，如果你真的不小心下载了所有的SDK包，我相信，你会哭的。
我配置的安卓模拟器是使用Android Studio中带的，下面是我配置的安卓模拟器的一些信息：
开发的过程当中，难免会遇到一些问题，建议大家多看看API文档，如果是第三方包，多看看他们的案例代码信息，如果实在解决不了，您也可以私聊我，我们一起探讨下。以下是APP产品的一些截图
代码地址：https://github.com/mmcai/reac...
dva.js地址：https://dvajs.com/
React-Native中文文档地址：https://reactnative.cn/
react-navigation地址：https://reactnavigation.org/d...
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/109528.html
摘要：对于崩溃的收集，我主要关心两个部分是需要统计到正确的崩溃栈。统计到的崩溃栈要是易于阅读的。最方便的是，你直接点击崩溃栈的代码，会自动打开对应的文件。但是正是因为会在模式下，住我们的崩溃栈，从而会导致无法搜集到对应的崩溃也就无法进行上报。 showImg(https://segmentfault.com/img/remote/1460000011982644?w=900&h=500); ...
摘要：前端每周清单半年盘点之与篇前端每周清单专注前端领域内容，以对外文资料的搜集为主，帮助开发者了解一周前端热点分为新闻热点开发教程工程实践深度阅读开源项目巅峰人生等栏目。与求同存异近日，宣布将的构建工具由迁移到，引发了很多开发者的讨论。 前端每周清单半年盘点之 React 与 ReactNative 篇 前端每周清单专注前端领域内容，以对外文资料的搜集为主，帮助开发者了解一周前端热点；分为...
摘要：，已过期，请使用代替。解决方案安卓增加属性并设置为官方解释当图片实际尺寸和容器样式尺寸不一致时，决定以怎样的策略来调整图片的尺寸。 本文均为RN开发过程中遇到的问题、坑点的分析及解决方案，各问题点之间无关联，希望能帮助读者少走弯路，持续更新中... （2019年3月29日更新） 原文链接：http://www.kovli.com/2018/06/... 作者:Kovli - 如何在原生...
摘要：以下的代码可以看作是一个文件的模版版本号可以根据需要而定。因此个人认为比较好的做法是在和同级目录创建一个目录，放置项目的代码。注意该版本号需要与文件中配置的版本号保持一致。至此，原生项目集成的工作就基本完成了。 前言 对于现有的大多数项目来说都不是从头构建的，而要在原有项目的基础上引入React Native则肯定和用react-native init xxx创建工程不同。因此下面就来...
摘要：工欲善其事，必先利其器。从零到一发布开源库作者程大治实习期间写的一个轮播工具，已开源。国内有关发布开源库的文章与教程很少见，来看看，项目地址。折腾范儿味精的一篇关于热更新库的对比与分析，很赞。这期的就到这里，欢迎大家分享更多的内容。 工欲善其事，必先利其器。本期 fir.im Weekly 推荐了很多优秀的 Github 项目、iOS/Android 开发工具利器，比如墨__守独立开发...
阅读 1845·2021-11-19 11:37
阅读 358·2021-11-11 16:54
阅读 978·2021-11-02 14:44
阅读 2526·2021-09-30 09:47
阅读 2720·2021-09-02 15:40
阅读 2195·2019-08-30 15:44
阅读 785·2019-08-29 11:17
阅读 943·2019-08-26 14:06
