yunchihuang / react_native_newsapp

react-native新闻类app制作

项目说明:

介绍：政策百晓生app全部基于react-native框架开发，网络通信基于node的koa2提供数据接口

在创业公司没有ios/android开发工程师，但要节省开支，这个重任交付到本小白一人头上，这也是第一次从PC端和微信开发转到正真的移动端应用开发，在一路爬坑中，也算是把这个1.0版做出来，供跟我刚开始涉足移动端的小白们一起学习，欢迎大神指导，别喷我，项目全由一人完成，时间紧任务急，代码质量目前还是比较烂的，会优化重构的

技术选型：目前流行的移动端app框架最老的phoneGap,发展到Cordova,国人现在的hybrid,APICLOUD，Angular ionic,React-Native还有...优略好坏，只是看我们适应的场景和业务，我一年前尝试用过hybrid开发过一个小应用，但用户体验确实不太好，白屏和性能，样式确实都有点小不爽，选择了React-native最大的感觉确实能达到原生的性能，感觉代码覆盖率在85-90%都是能用在跨端的，比较也是facebook的大厂的神器，生态圈也是不言而喻的

后端采用node做中间层，因为node得天独厚单线程，异步事件机制，再加上产品也没什么太复杂的业务计算逻辑，能够快速实时响应请求。使用koa2框架让中间件更干净，不像express附加很多中间件

ios必须要支持https协议，在给我们的node配nginx反向代理时记得配置

本地缓存数据库:realm性能好，速度快，尺寸适中，缺点是想要这玩意，大兄弟你必须要翻墙，在启动项目时你必须要网络环境好才能下载完成realm的编译包，否则你时崩溃，Mac有个Realm Browser可视化工具方便查看（但不能和模拟器同时启动）

在网络请求上Promise机制下，在我们路由跳转下是不没有断开请求的，也就是我们为什么总看到waring的那讨厌的黄色，我们人为干预一下取消请求还是很有必要的， 在视图中我们要避免组件嵌套组件和少使用动画效果，这样会造成卡顿，在路由跳转时不需要的视图最好把它replace掉

• 用到的组件:（感谢这些无私奉献的开发者们）
• react-natice-elements(有些UI交互元素还是挺好用的)
• react-native-swiper(轮播图)
• react-native-router-flux控制路由，后期将引入redux
• react-native-pull(作者在listView上做了一层封装的列表，还是很好用的)

##项目架构说明:

• application(应用)

  • components(组件)
  • config(配置文件)
  • images(静态图片资源)
  • pages(视图页面)
  • realm(对realm操作的一些封装)
  • tool(一些工具函数，中断Promise)

• node_ui(用于接收网络接口)

  • application
    • config(打包路径配置文件)
    • server(node中间层)
      • |config(node配置文件)
      • controlles(路由接口控制器)
      • model(数据模型)
      • libs(静态资源库)
      • build编译后的生产环境
      • app.es入口文件
      • gulpfile编译es6代码
    • webapp（当时想尝试利用vue实现搜索页面spa通过webview嵌入应用，后来发现在控制返回键和页面操作上还是不方便，放弃了） 使用了vuex+vue-router+webpack2+vue-cli store(vuex的状态管理机制)

---

(说明：因为公司项目原因，部分连接url已被注释，请自行设置) 内涵打包好的apk，可以在模拟器内测试应用