项目中一直使用的是Vue，最近准别去了解了解React，为什么学习呢，因为他也是前端开发很流行的框架，很多公司很多项目在用的框架，扩展自己的技术栈也是今年的目标之一，而且自从经历今年疫情的隔离等，长时间不学习真的会知识焦虑，所以准备向React下手。
官网
React 是什么
一句话 React 是 JavaScript 库 ，再详细点就是 用于构建用户界面的 JavaScript 库 ，这是官网最精简的介绍，我的理解是他是JS 库 ，那么JS能干什么他就能干什么，只是有自己的语法，自己的优势，为什么会封装成库，肯定是为了给开发者的福利，让开发实现起来更简单，代码跑起来效率更高，当时使用 jquery 的时候，是不是感觉简化了很多代码，没错React 会有更多的进步。
JSX
JSX 是 React 的装备，但不是必须品，它是JavaScript 的 扩展语法，可以同时包含UI 标签和 JS 逻辑，最终还是会转化成JS 标准DOM 执行，官网有介绍，刚开始熟悉，这种语法还不太了解，只是把UI 和 逻辑放在一块真的有点不习惯。
const vDom = <h1>Hello,world</h1>上面这行代码就是JSX 语法，变量 vDom 不是一个字符串也不是我们下载模板中的标签，具体什么样来看看
const vDom = <h1>Hello,world</h1>
const root = document.getElementById('root')
debuggerdebugger 之后 可以分别看下虚拟DOM 和 真实的DOM 都有哪些区别，会稍微有点明白为什么用虚拟dom ，之后再统一修改真实DOM ，其实虚拟DOM 相比较起来真的比较轻量级。
依赖库
<script src="https://cdn.staticfile.org/react/16.4.0/umd/react.development.js"></script>
<script src="https://cdn.staticfile.org/react-dom/16.4.0/umd/react-dom.development.js"></script>
<script src="https://cdn.staticfile.org/babel-standalone/6.26.0/babel.min.js"></script>以上都是开发环境使用的形式，线上环境往往使用的是压缩的.min 文件
react.js ：react 的核心库
react-dom.js：提供以DOM 相关的功能
babel.min.js ：可以将ES6 语法转换为ES5 语法，也可以对JSX提供支持
核心步骤
创建虚拟DOM ===》渲染虚拟DOM
HelloWorld
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>ReactDemo</title>
<script src="https://cdn.staticfile.org/react/16.4.0/umd/react.development.js"></script>
<script src="https://cdn.staticfile.org/react-dom/16.4.0/umd/react-dom.development.js"></script>
<script src="https://cdn.staticfile.org/babel-standalone/6.26.0/babel.min.js"></script>
</head>
<body>
<div id="root"></div>
<script type="text/babel">
// 创建虚拟DOM
const vDom = <h1>Hello,world</h1>
const root = document.getElementById('root')
ReactDOM.render(vDom,root)
// ReactDOM.render(<h1>Hello, world!</h1>, document.getElementById('root'))
</script>
</body>
</html>以上不是实现什么功能，而是把React 大体是个什么东西，能怎么做事情，有哪些依赖分享给大家，后续会继续深入学习，目标是敲一个像样的项目。
5612
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
