项目实战
技术架构
我们使用了React，jsx, 路由，create-react-app, axios, less, webpack实现一个单页面应用程序
目录部署
build 文件发布的目录
src 开发的目录
app 应用程序
pages 所有页面
components 所有组件
router.jsx 路由
index.jsx 入口文件
base.less 样式文件
我们遵守create-react-app命名规范，将组件名称首字母都大写。
css预编译
create-reate-app默认不支持css预编译语言，想使用css预编译语言我们就要写webpack配置，我们可以通过yarn eject指令生成webpack配置，在添加相应的加载机
我们可以在原来的css加载上做拓展
我们也可以重新定义一个less加载机
我们可以通过loader引入加载机。也可以通过use方法，引入加载机
工作中，添加什么加载机，我们要安装什么模块
主意：dev配置文件以及prod配置文件都要修改
react拓展
在组件中定义的子虚拟DOM元素，我们可以在组件中通过this.props.children获取。
reactnative
react有三个特点：
虚拟DOM，组件开发，多端适配
react团队为了实现多端适配，提供了reactnative，简称RN
RN开发也称之为混合开发，常见的混合开发有三类
类小程序：嵌入在某个应用中。
web渲染：angular提供的hybird，cordova开发。
源生渲染：react提供的reactnative
介绍RN
RN也是由fb团队推广的
github地址 官网 中文网站
安装
RN是为了IOS和android开发的。
mac安装
只需要两步
第一步 安装xcode软件
第二步 安装RN
npm install -g react-native-cli
window安装RN
npm install -g react-native-cli
此时提供了react-native指令，通过react-native -v查看版本号
react-native也是基于yarn管理，所以我们也要安装yarn
npm install -g yarn
可以通过yarn -v查看版本号
创建项目
通过react-native init 项目名称， 即可创建项目
目录架构
__test__单元测试
android android环境配置
ios ios环境配置
node_modules 依赖模块
以点开头的文件，都是配置文件，不需要开发
App.js 应用程序组件
app.json 应用程序配置
index.js 项目入口文件
package.json 整个模块npm配置
yarn.lock yarn锁文件
启动项目
ios端：react-native run-ios
android端：react-native run-android
安装python
点击python安装程序，进行下一步安装
安装java
点击java安装程序，进行下一步安装
点击java安装程序，进行下一步安装
有三种方式
第一种，安装相应的开发工具，例如android studio
第二种，安装Android sdk管理工具（工作中建议)
第三种： 直接解压sdk压缩包（学习中建议）
解压的时候，注意。不要出现中文字符。
