React入门 -- todolist

React.js

2019-10-31

学习内容：

---

一、简介：

　　使用的人数最多；Facebook 推出；

　　React Fiber：React16之后的版本

二、开发环境的搭建：

　　（1）先安装node.js 的环境：LTS版更稳定（建议）自带包管理工具npm

　　（2）https://reactjs.org 官网，在docs Create a New React App中找到 Create React App脚手架工具创建一个原始的react工程

 

端口：http://localhost:3000/

　　每次修改不需要重启服务，只需要保存后在页面上刷新 

 三、项目目录分析：

 

（1）工程入口是index.js

（2）serviceWorker.js 目前用不上，忽略

（3）index.css 的效果是把页面的边框去掉

（4）App.test.js 是jest自动化测试工具

（5）App.js 里render的html代码，就是浏览器展示的页面

四、组件：

　　html的每个标签，就是网页上的一个组件。

ReactDOM：这个库的作用是可以让我们的组件挂载到页面一个dom上，因此可以发现 App.js 在定义一个react组件

　　正如index.js 中：App挂载到root dom上：

　　而public的静态文档index.html中root是一个空的div

五、JSX简单语法：

　　jsx允许在div块中直接写js表达式，但不能写js语句例如{ { if (true) {return 123} } }

六、编写todolist功能：

　　目标：http://todolist.cn/

　　详见个人文档 todolist（暂时不po出）