React 第一章 概述

React 起源于 Facebook 的内部项目,因为该公司对市场上所有 JavaScript MVC 框架都不满意,就决定自己写一套,用来架设 Instagram 的网站。

React 的实质其实是一个用于构建用户界面的 JavaScript 库。React 主要用于构建 UIReact20135 月开源,由于拥有较高的性能,代码逻辑简单,越来越多的人已开始关注和使用它。

UI = fn(state)

由于 React 的设计思想极其独特,属于革命性创新,性能出众,所以,越来越多的人开始关注和使用,认为它可能是将来 Web 开发的主流工具。

这个项目本身也越滚越大,从最早的 UI 引擎变成了一整套前后端通吃的 Web App 解决方案。

React 官网:https://reactjs.org

React 从诞生到现在,一直在给我们带来各种各样的惊喜。甚至从 2015 年开始,每年都会举行 React Conf 大会,介绍 React 本年度所更新的新特性有哪些。

React Conf 官网:https://conf.reactjs.org/

React Conf 油管视频:https://www.youtube.com/channel/UC1hOCRBN2mnXgN5reSoO3pQ

下面介绍一下 React 几个重要版本的重大更新:

  • React 16 :出现了 Fiber,整个更新变的可中断、可分片、具有优先级
  • React 16.8 :推出了 Hooks,标志着从类组件正式转为函数组件
  • React 17 :过渡版本,没有添加任何面向开发人员的新功能。而主要侧重于升级简化 React 本身
  • React 18
    • transition
    • Suspense
    • 新的 Hooks
    • Offscreen
    • ...

React 特点

React 官网中,罗列了 3 个特点:

  • 声明式
  • 组件化
  • 一次学习,跨平台编写

除此之外,React 还具有如下的特点:

  • 单向数据流
  • 虚拟 DOM
  • Diff 算法

搭建开发环境

虽然官方提供了通过 CDN 引入 React 的方式:https://zh-hans.reactjs.org/docs/cdn-links.html

但是实际开发中肯定是使用 React 的脚手架工具来搭建项目,React 官方提供了脚手架工具 Create React App

https://create-react-app.dev

快速开始:

js 复制代码
npx create-react-app my-app
cd my-app
npm start
相关推荐
顺颂时绥_110 分钟前
前端大图片压缩与安卓/苹果设备矫正实践
前端
Csvn12 分钟前
JSON.parse 大数精度丢失:一个让前后端互相甩锅的 Bug
前端
张元清19 分钟前
React useCookie Hook:把 Cookie 变成响应式状态(2026)
javascript·react.js
Helen_cai31 分钟前
OpenHarmony 项目统一全局样式、尺寸、色彩主题封装 ThemeUtil(API23)
开发语言·前端·javascript·华为·harmonyos
郑州光合科技余经理32 分钟前
家政O2O平台解析:从0搭建上门预约小程序解决方案
android·java·开发语言·前端·小程序·架构·php
小徐_233343 分钟前
AI 写 wot-ui 总在猜 API?我们把 Skills、MCP 和 CLI 都配好了
前端·uni-app·ai编程
winfredzhang1 小时前
用 wxPython + ECharts + 阿里矢量地图,做一个可离线兜底的上海雨量看板
前端·javascript·echarts
索西引擎1 小时前
【React】Immer.js 在现代 Redux 生态中的角色:不可变性保障的工程化实现与开发体验优化
前端·javascript·react.js
kisshyshy1 小时前
《川剧变脸 × React 状态管理?我在浏览器里跑了个端侧大模型》
前端·react.js·架构
只一1 小时前
端侧AI实战第二章:React组件工程化 + 事件系统 + 可复用进度条(WebGPU模型加载底座)
前端·react.js