react源码解密2-先学会应用

官方脚手架区别

目前官方版本是react19.https://react.dev/learn/creating-a-react-app

learn文档左侧有：

• create a react app。 这个是直接用现成的框架，即携带了路由、请求库等的完整框架。例如next.js。 因为react是一个库并不是框架，所以这些next.js框架就给你把其他配套加上变成框架。
• build react app from scratch。 这个是基于vite/parsel生态下给你做的构建插件给你初始化一个仅仅能构建成功的spa版本的应用吧。

先应用后学习

咱们先来实验实验基本的react操作，具体怎么用可以学习react官方教程（理论上只要你有js基础基本上就挺快能学会了，只是里面一些react特有的概念可能稍微晦涩或者使用起来会让你感觉很神奇的感觉）。

• 编写根组件
• 借助react-dom的createRoot来创建一个reactRoot对象（她内部关联到一个dom的root节点---即react的画布）
• 调用rootObj的render(<MyApp></MyApp>)去绘制react逻辑层面的组件。即往画布上去绘制咱们react的虚拟dom吧可能是。
• 自己创建一个自定义的组件放到MyApp里面
• 自己使用一下setState感受重新触发组件执行的感觉。

应用实践的时候建议通过https://react.dev/learn/build-a-react-app-from-scratch 这里创建一个vite版本的react脚手架项目即可，这个纯sap的骨架会比较简单。