在做项目之前，首先要搭建ReactNative环境。这里我就不细说了。跟着配置就行了。http://reactnative.cn/docs/0....1.总页的基本结构之前一直存在的Navigator被弃用了。所以在真机测试的时候，底部总会弹出组件过时警告，这让我很头疼。后来发现react-navigation，今年1月份刚刚上线，facebook推荐的一个新的导航组件。总的来说，react-navigation由三部分组成1.StackNavigator：类似于html中的a标签功能，用于页面切换2.TabNavigator：相当于iOS中的TabBarController，屏幕底部的标签栏3.DrawerNavigator：抽屉效果和侧滑的用法很简单，官网有API介绍。这里主要想说一下整个app是如何嵌套这三个导航组件的。有人建议可以这样嵌套1.StackNavigator2.-TabNavigator3.-DrawerNavigator（官方文档关于DrawerNavigator的最后一句话：请记住，嵌套DrawerNavigation，抽屉会显示在父导航下方。如果按如上实现嵌套的话，侧边栏滑动导航的高度不会占满全屏，而StackNavigator的topbar会占据部分高度，抽屉在stack下面。）经过多次尝试，我总结出的嵌套方式是：1.DrawerNavigator2.-StackNavigator3.-TabNavigator侧边栏包裹整个app组件，其他侧边栏等功能组件整个app组件包裹底部导航栏组件，并在四个导航栏关联的页面可以点击跳转的页面放在这个StackNavigator的底部导航栏组件中，包括四个关联页面2.课程app中使用的一些第三方组件(1)推荐页面1.轮播图react-native-swipergithub.com/leecade/react-native-swiper部分代码2.滑动删除,修改react-native-swipeoutgithub.com/dancormier/react-native-swipeout3.视频播放react-native-videogithub.com/react-native-community/react-native-video代码太复杂了，可以看看我写的项目github.com/ouxiaojie18/ClassTable-react你也可以学习他的例子react-native-video的github（二）树洞页面1.点击图片放大查看react-native-zoom-imagegithub.com/Tinysymphony/react-native-zoom-image（三）课程页面1.课程react-native-easy-gridgithub.com/GeekyAnts/react-native-easy-grid布局神器，grid,col,row可以将页面划分成网格2.图片功能react-native-image-pickergithub.com/react-community/react-native-image-picker3.七牛村图片react-native-qiniugithub.com/buhe/react-native-qiniu(4)注释页1.图片毛玻璃效果react-native-blurgithub.com/react-native-community/react-native-blur2。好友联系人列表首字母a-z排序react-native-alphabetlistviewwww.npmjs.com/package/react-native-alphabetlistview3。聊天功能react-native-gifted-chat很强大，支持语音、视频、图片等github.com/FaridSafi/react-native-gifted-chat（五）其他1.moment是一个非常好用的修改库时间格式，也可以进行日期时间加减等操作2.react-native-vector-iconsgithub.com/oblador/react-native-vector-icons第三方可以直接使用图片名来加载图像。它类似于网络上的iconfont矢量图标。使用起来非常方便。您不需要在项目文件夹中塞入各种图像。节省大量空间。3.使用Express框架作为后端这个应用程序使用node.jsexpress框架作为后端。搭建node环境，步骤如下：jingyan.baidu.com/article/73c3ce28f34b8ce50243d95e.htmlexpress全局安装：使用express在demo文件夹下创建服务端项目service，进入service目录，安装相关依赖：最后启动服务：在浏览器输入localhost:3000，会出现下图表示运行成功：安装一个模块，自动监控：用supervisor启动项目：服务是在这个创建的方式，具体后端代码就不贴了~具体项目在我的githubgithub.com/ouxiaojie18/ClassTable-react，有不懂的模块可以下载看看
