课程章节： 课程导学+React初探
主讲老师： Dell
课程内容：
今天学习的内容包括：
React.js 和vue.js对比：
- React.js更加灵活；
- Vue.js的api更多，较为简单
react设计理念：all in js （在js中可以引入css以及用jsx模块的方式编写代码）
react创建的项目中public文件夹下放置一些静态文件以及图片等
react创建的项目中src文件夹下放置项目的源码文件
registerServiceWorker 可以将用户浏览的网页保存在浏览器中，在中间断网的情况下可以继续访问网页
课程收获：
1.1 心得：
课程内容包括
- 基础内容→环境搭建→基础语法→原理进阶→动画
- Redux→Redux进阶
- 实战项目→环境搭建→Header→首页→详情页
- 登录校验→上线
2.1 心得：
React 16版本之后称之为 React Fiber
这么称是因为在React 16版本之后，在底层在事件循环中加入了优先级这样的概念，可以在循环的碎片事件可以执行高优先级的交互。
2.2 心得：
使用react有两种方式：通过script引入通过搭建脚手架 (creat react app
脚手架：辅助工具，帮助我们实现代码编译然后给浏览器执行
环境搭建：
方式一：（授课安装方式）
- npm install -g creact-react-app
- creact-react-app react-app
- cd react-app
- yarn start
方式二：（官方文档推荐） - npx create-react-app react-app
- cd react-app
- yarn start
(注：npx基于npm5.2+，如已全局安装create-react-app，需卸载，以保证安装的npx使用的create-react-app都是最新版本)
2.3 心得：
yarn.lock 或者package-lock.json :项目依赖安装包,版本号限制，无需动这个文件
gitignore有些文件不想放到git仓库里，可以写在gitignore里。
node_moudles 第三方依赖包
public–> favicon.ico 小图标
noscript 网页禁止script 容错
src/index.js是项目的入口文件
react–all in js 在js中可以引用css
reportWebVitals–PWA 用户浏览过网页，之后在没有网的情况下用户也可以看到之前浏览过的页面。
Pwa => progressive web application
manifest.json 配置 Pwa使用
App.test.js 自动化测试的文件
2.4 心得：
定义一个react组件，如下：
import React, {Component} from 'react';
class App extends Component {
render(){
return (
<div>test</div>
);
}
}
render()函数返回什么 组件就展示什么内容
ES6的解构赋值
//import {Component} from 'react';
//等价于
//import React from 'react'
//const Component = React.Component
import React, {Component} from 'react';
ReactDOM的意义：把react生成的一些组件内容挂载到页面的某一个节点之下，让它显示出来
jsx语法：
并不是直接写App，而是以<App />标签的形式显示
ReactDOM.render(<App />,document.getElementById('root'));
注意：如果使用了jsx语法，那么一定要在对应文件引入react
（import React from 'react'）
在react之中，render函数之中的标签其实也是jsx语法，所以一定要引入react语法进行编译识别
组件中，render中定义内容，然后export default暴露render的类名；引用组件时，直接import 组件的相对位置，而后使用jsx语法，引用组件
挂载节点，使用ReactDom，把组件生成的内容，挂载到页面的（index.html）某个节点
2.5 心得：
jsx是基于js的，jsx不需要加引号，直接写标签即可
在jsx中使用自定义组件，组件必须以大写字母开头
在jsx中，以大写字母开头的一般都是组件，小写的是标签
随时随地看视频
