fix: --

Author: webVueBlog

README.md

@@ -236,10 +236,12 @@
 - [mysql教程](./Mysql/mysql.md)
 - [HTTP](./企业级/HTTP.md)
 
-## React全家桶 🪣 (react文件夹 📁 下)
+## React技术全家桶
 
 ### 阶段一
 
+- [react简介](./react/react简介.md)
+- [hello-react](./react/hello-react.md)
 - [第一个React Web应用程序](./react/Web应用程序.md)
 - [React State(状态)](./react/State.md)
 - [React Props](./react/Props.md)
@@ -260,6 +262,8 @@
 - [Hooks](./react/Hooks.md)
 - [Others](./react/Others.md)
 - [react-fiber-root](./react/react-fiber-root.md)
+- [JSX](./react/JSX.md)
+
 
 
 ## 常见问题及解答

react/JSX.md

@@ -0,0 +1,16 @@
+1. 全称：JavaScript XML
+2. react定义的一种类似于XML的
+3. 本质是React.createElement(component, props, ...children) 方法的语法糖
+4. 作用：用来简化创建虚拟DOM
+5. 标签名任意：HTML标签或其它标签
+
+
+## jsx语法规则：
+
+1. 定义虚拟DOM时，不要写引号
+2. 标签中混入JS表达式时要用{}
+3. 样式的类名指定不要用class，要用className
+4. 内联样式，要用`style={{key:value}}`的形式去写
+5. 只有一个根标签
+6. 标签必须闭合
+7. 标签首字母：若小写字母开头，则将改标签为html中同名元素；若html中无同名元素，则报错。 若大写字母开头，react就去渲染对应的组件，若组件没有定义，则报错。

react/hello-react.md

@@ -0,0 +1,33 @@
+## 相关js库
+
+1. react.js
+2. react-dom.js 提供操作DOM的react扩展库
+3. babel.min.js 解析JSX语法代码转为JS代码的库
+
+## babel
+
+1. es6->es5
+2. jsx->js
+
+## 虚拟DOM的两种创建方式
+
+1. 使用JSX创建虚拟DOM
+2. 使用js创建虚拟DOM
+
+```js
+const VDOM = React.createElement('h1', { id: 'title' }, 'hello')
+```
+
+## 虚拟DOM与真实DOM
+
+虚拟DOM ，一般对象
+
+真实DOM
+
+## 关于虚拟DOM
+
+1. 本质是Object类型的对象（一般对象）
+2. 虚拟DOM比较“轻”，真实DOM比较“重”，因为虚拟DOM是React内部在用，无需真实DOM上那么多的属性。
+3. 虚拟DOM最终会被React转化为真实DOM，呈现在页面上。
+
+

react/react简介.md

@@ -0,0 +1,46 @@
+React-Router 路由
+
+PubSub 消息管理
+
+Redux 集中式状态管理
+
+Ant-Design 精美的UI组件库
+
+## React简介
+
+React 用于构建用户界面的JavaScript库
+
+1. 发送请求获取数据
+2. 处理数据（过滤，整理格式等）
+3. 操作DOM呈现页面
+
+是一个将数据渲染为HTML视图的开源JavaScript库
+
+
+```js
+document.getElementById('app')
+document.querySelector('#app')
+document.getElementsByTagName('span')
+```
+
+## 为什么要学
+
+1. 原生JavaScript操作DOM繁琐，效率低
+2. 使用JavaScript直接操作DOM,浏览器会进行大量的重绘重排
+3. 原生JavaScript没有组件化编码方案，代码复用率低
+
+## React特点
+
+1. 采用组件化模式，声明式编码，提高开发效率以及组件复用率。
+2. 在React Native中可以使用React语法进行移动端开发。
+3. 使用虚拟DOM+优秀的Diffing算法，尽量减少与真实DOM的交互。
+
+https://react.docschina.org/
+
+a. 声明式编码
+
+b. 组件化编码
+
+c. React Native 编写原生应用
+
+d. 高效