chatgpt react前端页面

一、React简介及开发环境准备

---

1. React简介

• React是Facebook在2013推出的开源的前端开发框架，它带来了一种全新的函数式编程风格。目前React.js是全球范围内使用人数最多的前端框架，它也拥有健全的文档和完善的社区，中文文档比较落后，建议直接阅读英文文档。
• 我们会把16之后的react版本称之为React Fiber，因为在16版本中，react底层在事件循环中加入了优先级等概念，可以在事件循环的碎片时间执行一些高优先级的用户交互，提升用户体验。
• 与vue.js对比，react.js灵活性更大，所以处理一些非常复杂的业务时，技术方案会有更多的选择。而vue.js提供了更多的api，实现功能会更简单，但灵活度也会相应降低。React在处理复杂项目时，有Facebook的团队做技术支持，相对稳定可靠，vue目前社区运维，没有大厂背书。

2. 开发环境搭建

• 脚手架工具
  1. 脚手架是前端开发过程中的一个辅助工具，它会自动地帮我们构建一个大型项目的开发流程和目录，它允许我们以一定的方式实现js文件的相互引用，更方便的进行项目管理。注意，在脚手架中编写的代码实际上不能直接运行，需要脚手架工具对代码进行编译，编译出的代码才可以被浏览器识别运行。2. 初学react时，建议使用官方提供的脚手架工具create-react-app。安装：npm install -g create-react-app。使用前需要安装node和npm。
• 构建项目
  命令：create-react-app [app_name] 成功状态



• 启动项目
  进入项目目录，执行命令：npm start 成功后会在浏览器打开一个页面



• 这个过程实际上是脚手架工具分析源代码，然后启动一个服务器将项目运行起来。