React.js学习初探02

知识点
1、介绍
2、开发环境搭建
3、项目目录介绍
4、react组件
5、react中基础JSX语法

1、介绍

React JS ：用react语法编写网页交互效果
React Native：用react语法编写原生APP应用
React VR（360）：在react基础上开发VR或全景应用

简介：Facebook推出、2013年开源 、函数式编程 、使用人数最多的前端框架 、健全的文档与完善的社区、React Fiber（指React16版本或React16版本的底层实现，因为react底层在事件循环过程中加入了优先级的概念，可以利用时间循环的碎片时间，执行一些高优先级的用户交互，提高用户体验）

ReactJS和VueJS对比
1、react.js的灵活性更大，对于处理一些复杂业务时，技术方案有更多的选择；
2、vue.js拥有更丰富的API，实现功能会更简单，但由于API多，其灵活性会受到限制；

复杂度高优选react.js，面向用户复杂度低选vue.js。

2、开发环境搭建

具体操作内容，查看 react项目搭建和react devtools安装（https://blog.csdn.net/weixin_36985768/article/details/89355863）

安装node.js — 打开cmd — 输入npm install -g create-react-app 和 create-react-app learn-react — 输入cd learn-react 和 npm start — 打开浏览器http://localhost:3000/可查看项目页面

3、项目目录介绍

package-lock.json：记录项目依赖安装包的版本号限制。
README.md：记录项目的说明，可删除全部代码，自己使用markdown语法进行记录项目的相关信息。
package.json：记录一些项目介绍，包括项目名、版本号、依赖第三方包、可调用命令，该文件使得项目成为一个node包。
.gitignore：使用git管理代码时，对于不需要上传的文件可以定义到此文件上。
node_modules：存放一些第三方模块。
favicon.ico：用于浏览器最顶的标签页的左边小icon。
index.html：项目首页的html模板，其中<noscript>you need to enable JavaScript to run this app.</noscript>标签容错代码，当用户将浏览器的javascript内容禁用了，提示用户开启网页javascript适配项，即允许网页去加载javascript。
src：存放所有源代码。
index.js：

• 所有代码的入口，css文件可以像模块一样被引入js import './index.css';；
• import App from './App';脚手架会自动补全./App.js，优先寻找js文件；
• import * as serviceWorker from './serviceWorker';，先了解一个概念PWA（progressive web application）通过写网页的形式，写一些AP