ReactJS 教程

ReactJS 主页 ReactJS 简介 ReactJS 路线图 ReactJS 下载安装和环境配置 ReactJS 功能 ReactJS 优势和缺点 ReactJS 架构 ReactJS 创建 React 应用程序 ReactJS JSX ReactJS 组件 ReactJS 嵌套组件 ReactJS 使用组件 ReactJS 集合组件 ReactJS 样式 ReactJS 属性 (props) ReactJS 使用属性创建组件 ReactJS props 验证 ReactJS 构造函数 ReactJS 组件生命周期 ReactJS 事件管理 ReactJS 创建事件感知组件 ReactJS Expense Manager 事件 ReactJS 状态管理 ReactJS 状态管理 API ReactJS 无状态组件 ReactJS Hooks 进行状态管理 ReactJS Hooks 的组件生命周期 ReactJS 布局组件 ReactJS 分页 ReactJS Material UI ReactJS Http 客户端编程 ReactJS 表单编程 ReactJS 受控组件 ReactJS 非受控组件 ReactJS Formik ReactJS 条件渲染 ReactJS 列表 ReactJS Key 键 ReactJS 路由 ReactJS Redux ReactJS 动画 ReactJS Bootstrap ReactJS Map ReactJS 表格 ReactJS 使用 Flux 管理状态 ReactJS 测试 ReactJS CLI 命令 ReactJS 构建和部署 ReactJS 示例

Hooks

ReactJS Hooks 简介 ReactJS 使用 useState ReactJS 使用 useEffect ReactJS 使用 useContext ReactJS 使用 useRef ReactJS 使用 useReducer ReactJS 使用 useCallback ReactJS 使用 useMemo ReactJS 自定义 Hooks

ReactJS 高级

ReactJS 可访问性 ReactJS 代码拆分 ReactJS 上下文 ReactJS 错误边界 ReactJS 转发 Refs ReactJS 片段 ReactJS 高阶组件 ReactJS 与其他库集成 ReactJS 优化性能 ReactJS Profiler API ReactJS Portals ReactJS 不使用 ES6 ECMAScript ReactJS 不使用 JSX 的 React ReactJS Reconciliation ReactJS Refs 和 DOM ReactJS 渲染道具 ReactJS 静态类型检查 ReactJS 严格模式 ReactJS Web 组件

其他概念

ReactJS 日期选择器 ReactJS Helmet ReactJS 内联样式 ReactJS PropTypes ReactJS BrowserRouter ReactJS DOM ReactJS 轮播 ReactJS 图标 ReactJS 表单组件 ReactJS 参考 API

ReactJS 有用资源

ReactJS 快速指南 ReactJS 备忘录 Axios 备忘录 ReactJS 有用资源 ReactJS 讨论


ReactJS - 简介

ReactJS 是一个免费的开源前端 JavaScript 库,用于开发各种交互式用户界面。它是一个简单、功能丰富且基于组件的 UI 库。当我们说基于组件时,我们的意思是 React 通过创建各种可重复使用和独立的代码来开发应用程序。因此,这个 UI 库在 Web 开发中被广泛使用。

ReactJS 可用于开发小型应用程序以及大型复杂应用程序。ReactJS 提供最小且可靠的功能集来启动 Web 应用程序。React 社区通过提供大量现成的组件来在创纪录的时间内开发 Web 应用程序,从而对 React 库进行了补充。 React 社区还在 React 库的基础上提供了状态管理、路由等高级概念。

React 版本

Reactjs 库由 Facebook 软件工程师 Jordan Walke 于 2011 年创立。随后,React 的初始版本 0.3.0 于 2013 年 5 月发布,最新版本 17.0.1 于 2020 年 10 月发布。主要版本引入了重大更改,次要版本引入了新功能,而不会破坏现有功能。必要时会发布错误修复。React 遵循语义版本控制 (semver)原则。

为什么需要 ReactJS?

尽管有各种库提供了开发用户界面的媒介,但 ReactJS 在受欢迎程度方面仍然占据主导地位。原因如下 −

  • 基于组件 − ReactJS 使用多个组件来构建应用程序。这些组件是独立的,具有自己的逻辑,这使得它们在整个开发过程中可重复使用。这将大大减少应用程序的开发时间。

  • 更好更快的性能 − ReactJS 使用虚拟 DOM。虚拟 DOM 将应用程序组件的先前状态与当前状态进行比较,并且仅更新真实 DOM 中的更改。而传统的 Web 应用程序会再次更新所有组件。这有助于 ReactJS 更快地创建 Web 应用程序。

  • 极其灵活 − React 允许开发人员和团队设置他们认为最适合的约定,并以他们认为合适的方式实现它,因为 React 中没有严格的代码约定规则。

  • 轻松创建动态应用程序 − 动态 Web 应用程序需要更少的编码,同时提供更多的功能。因此,ReactJS 可以轻松创建它们。

  • 也可以开发移动应用程序 − React 不仅可以开发 Web 应用程序,还可以使用 React Native 开发移动应用程序。React Native 是一个开源 UI 软件框架,源自 React 本身。它使用 React 框架为 Android、macOS、Web、Windows 等开发应用程序。

  • 调试很容易 − React 中的数据流是单向的,即在使用 React 设计应用程序时,子组件嵌套在父组件中。由于数据流是单向的,因此调试错误和发现错误变得更加容易。

应用程序

下面列出了一些由 React 库 支持的流行网站 −

  • Facebook,流行的社交媒体应用程序 − React 最初由 Facebook(或 Meta)开发,因此他们使用它来运行他们的应用程序是很自然的。至于他们的移动应用程序,它使用 React Native 来显示 Android 和 iOS 组件,而不是 DOM。Facebook 的代码库现在包含超过 20,000 个组件,并使用公开的 React 版本。
  • Instagram,流行的照片共享应用程序 − Instagram 也完全基于 React,因为它也由 Meta 提供支持。其主要用途包括地理位置、标签、Google Maps API 等。
  • Netflix,流行的流媒体应用程序 − Netflix 于 2015 年改用 React。影响这一决定的主要因素是 1) 启动速度以减少呈现主页的处理时间并在 UI 中启用动态元素,2) 模块化以允许必须与控制体验共存的各种功能和 3) 运行时性能以实现高效的 UI 渲染。
  • Code Academy,流行的在线培训应用程序 − Code Academy 使用 React 作为"脚本经过实战测试,易于思考,使 SEO 变得简单,与遗留代码兼容,并且足够灵活以应对未来"。
  • Reddit,流行的内容共享应用程序 − Reddit 也是使用 React 从头开发的。

如您所见,每个领域中最流行的应用程序都是由 React Library 开发的。