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
相关推荐
毛骗导演1 分钟前
OpenClaw Auth Profile 与多 Key 冷却隔离机制深度解析:一个 API Key 是如何被选择、追踪并轮换的
前端·架构
用户9751470751361 分钟前
如何在 Vite 中配置 CSS 模块,以避免全局样式被模块化隔离覆盖?
前端
我叫黑大帅1 分钟前
Js常用的字符串处理
前端·javascript·面试
栀秋6662 分钟前
深入浅出:手写一个迷你版 Zustand
前端·react.js·前端框架
gustt2 分钟前
手写 Zustand:从零实现 React 轻量级状态管理库
前端·面试
读忆11 分钟前
在前端开发中使用组件后, 若是出了bug, 应该如何排查, 怎么排查, 解决方式是什么?
前端·javascript·vue.js·bug
We་ct16 分钟前
LeetCode 162. 寻找峰值:二分高效求解
前端·算法·leetcode·typescript·二分·暴力
HWL567919 分钟前
uni-app的生命周期
前端·vue.js·uni-app
softbangong20 分钟前
829-批量提取各子文件夹下文件到一级目录
java·服务器·前端·自动化工具·批量文件处理·文件提取工具·文件夹整理
李剑一21 分钟前
别再瞎写 Cesium 可视化!热力图 + 四色图源码全公开,项目直接复用!
前端·vue.js·cesium