React 简介
- React 主要是用来构建 UI(User Interface)的 JavaScript 库
- 从 MVC 的角度来说,开发的是 V 层的代码
- React 是起源于Facebook的内部项目,用于构建 Instagram 网站,在 2013.05 开源
React 特点:
- 声明式:使用 React 编写UI界面和写HTML几乎一样
- 组件化: 将业务逻辑和UI拆分到不同的组件中,哪里需要哪里调用,提升开发效率
- 高效:React通过对DOM的模拟,最大限度地减少与DOM的交互
- 灵活:React 可以与已知的库 或 框架很好地配合
MVC: 开发模式(开发架构)
M(Model): 模型,一般是指数据表模型,内部封装了针对于数据表的增删改查操作。
V(View):视图,页面。给最终用户看的网页。
C(Controller): 控制器,控制程序的运行。在什么情况下调用哪个模型,显示哪个视图。
为什么要使用MVC?
核心优势: 前后端分离开发。前端程序员只关注V,后端程序员关注 M 和 C。提升开发效率。
不管是Vue 还是 React 都是关注 V 层的开发。并且,Vue 和 React 都能使用脚手架来创建独立的Web项目,通过Ajax来访问后端服务器,得到需要渲染到页面上的数据。这个时候就产生了前后端分离的开发模式。
前后端分离的开发模式:
M和C是后端服务器
V是前端服务器
两个服务器通过Ajax来联系
项目搭建
# 创建 react 项目,项目名是 myapp
npx create-react-app myapp
# 进入myapp 目录
cd myapp
# 启动项目
npm start
- 项目名称中不能有大写字母
- npx 是 npm v5.2.0 之后提供的命令
- 如果没有安装react脚手架( create-react-app),系统会自动安装
- 要在项目根目录下启动项目
public 目录
public: 存放静态资源文件
- favicon.ico: 网站图标
- index.html: 首页文件
- logo192.png \ logo512.png: 不同尺寸的网站图标
- manifest.json: 应用加壳文件,可以将移动端项目包装成安卓或者ios应用
- robots: 爬虫规则文件
|