背景：马上Vue3.0要来了，看了看前瞻，还是准备转移自己的主要技术栈了，所以就当笔记了吧，从头来过，过一遍React,正好最近RN也是火的一塌糊涂，不多哔哔，上菜
React与Vue的区别，太多文章介绍了，推荐一篇：
清晰对比两者的差异
1、开箱开箱
官网的文档是让做个小游戏，估计是害怕枯燥文档吓跑太多人，因为前几年我看的文档还不是这样似的，要不怎么投奔了Vue呢，谁叫人家文档简单明了呢
贴上官网
2、环境搭建
推荐了两种编程的方式：
一、在浏览器中编写代码
最简单的方式，可以开箱即用，官方给了一个初始模板。打开就能看到直接编写好的代码，不过是待补充完成的。
二、搭建本地环境开发
还是选择方式二吧，毕竟以后用的着，一步一步来。
React 是一个声明式，高效且灵活的用于构建用户界面的 JavaScript 库。使用 React 可以将一些简短、独立的代码片段组合成复杂的 UI 界面，这些代码片段被称作“组件”。
React 中拥有多种不同类型的组件，我们先从 React.Component 的子类开始介绍：
class IamClass extends React.Component {
render(){
return{
<div className="wrap">
<h1>Hello, i am {this.props.name}</h1> //这里是取到传值
</div>
}
}
}
IamClass在这里是一个React组件类，或者说是一个React组件类型。就像我们在Vue中注册了一个Component一样。
在这个组件中，需要接收一些参数，我们把这些参数叫做props("props"是“properties”的简写)--既然简写还不再简单一点，在组件中可以通过 this.props.key 名取到
整个HTML的代码需要通过render方法返回需要展示在屏幕上的视图的层次结构
render方法的return内容：描述了你希望在屏幕上看到的，你想让别人看到啥，你在这里return啥，简单！
官方说法是：更具体地来说，render 返回了一个 React 元素，这是一种对渲染内容的轻量级描述。
然后React搞了一个“JSX”的特殊语法，据说性能更好？可能第一眼看到有点觉得四不像，看看就习惯了，心中默念几下就好了铁子。
上面的代码等同于：
return React.createElement('div',{className:'wrap'},
React.createElement('h1',/*...h1 children...*/),
);WC，第一感觉是不是觉得，这玩意儿确定好用？
接着往下聊
在 JSX 中你可以任意使用 JavaScript 表达式，只需要用一个大括号把表达式括起来。每一个 React 元素事实上都是一个 JavaScript 对象，你可以在你的程序中把它当保存在变量中或者作为参数传递。
前文中的 IamClass 组件只会渲染一些内置的 DOM 组件，如<div />、<li />等。但是你也可以组合和渲染自定义的 React 组件。例如，你可以通过 <IamClass /> 来表示整个组件。每个组件都是封装好的，并且可以单独运行，这样你就可以通过组合简单的组件来构建复杂的 UI 界面。
写我们的HELLO WORLD
先CDN引入
可以通过 CDN 获得 React 和 ReactDOM 的 UMD 版本。
<script crossorigin src="https://unpkg.com/react@16/umd/react.development.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>上述版本仅用于开发环境，不适合用于生产环境。压缩优化后可用于生产的 React 版本可通过如下方式引用：
<script crossorigin src="https://unpkg.com/react@16/umd/react.production.min.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js"></script>如果需要加载指定版本的 react 和 react-dom，可以把 16 替换成所需加载的版本号。
为什么要使用 crossorigin 属性? {#why-the-crossorigin-attribute}
如果你通过 CDN 的方式引入 React，我们建议你设置 crossorigin 属性：
<script crossorigin src="..."></script>我们同时建议你验证使用的 CDN 是否设置了 Access-Control-Allow-Origin: * HTTP 请求头：
这样能在 React 16 及以上的版本中有更好的错误处理体验。
//html
<div id="root"></div>//react.js
ReactDOM.render(
<h1></h1>,
document.getElementById('root')
)这样就完成了学习每个语言的第一步Hello,world
行了，今天先到这里，明天继续，o(︶︿︶)o 唉，没办法，加班下班晚
加油各位铁子！
