Skip to content

Main Navigation 👀 TOC

⚙️ Settings

📂 TNotes.yuque

Appearance

Sidebar Navigation

1. 初始 react

✅ react roadmap

✅ react 是什么

✅ 了解 react 官方文档的基本结构

✅ react 源码仓库

2. 环境准备

✅ 开发 react 项目之前推荐安装的 vscode 插件 - eslint

✅ 在 vscode 中，让 Emmet 语法支持 JSX

✅ npm create vite 使用 vite 快速初始化一个 react 工程

3. 第一个 react 应用

✅ Hello World（v16）

✅ React.createElement 跟 document.createElement 是一样的吗？

✅ react 核心库和 react-dom 库之间的关系是？

✅ 为什么一旦使用了 JSX 语法，就必须要引入 react 核心库？

✅ 通过脚手架来搭建工程 vs. 通过 CDN 的方式来直接引入 react 相关的库

✅ Hello World（v19）

4. 需要注意的一些版本问题

✅ ReactDOM.render

✅ 并发渲染（Concurrent Rendering）

✅ 不再支持 UMD，推荐使用 ESM

5. JSX

✅ JSX 概述

✅ HTML Tag vs. React Element vs. JSX Element

✅ react element 是只读的

✅ jsx 必须单根

✅ React.Fragment

✅ html to jsx 在线转换

✅ 在 JSX 中使用注释

✅ 在 JSX 中使用 JS 表达式

✅ 在 JSX 中书写内联样式 style

✅ 使用 className 给元素添加 class

✅ JSX 元素的正确使用及常见错误示例

✅ 条件渲染

✅ 列表渲染

✅ dangerouslySetInnerHTML

✅ DOMPurify

6. 组件基础知识

✅ 组件的基本组成及核心概念简介

✅ react 组件名的命名规则

✅ 函数组件概述

✅ 类组件概述

✅ 单向数据流是什么

7. 组件调用

✅ 函数组件不同调用方式对比：组件式调用 vs. 函数式调用

8. 组件属性

✅ 属性默认值

✅ 组件属性的传递和接收

✅ 通过 props 和 children 来传递元素内容

✅ 布尔属性

9. 组件状态

10. 组件生命周期

⏰ 生命周期

11. ref

✅ 实现图片自动轮播的效果

12. hooks

13. hoc

14. redux

⏰ redux 是什么

⏰ redux 的基本使用

⏰ 为什么说前端的 mvc 已死

⏰ redux 中的 action

⏰ 在 redux 中，store、reducer、action 三者之间的关系

15. 第三方库

✅ react-modal

✅ react-monaco-editor

⏰ react-tooltip

⏰ react-intl

16. 工程化

⏰ 快速搭建一个基于 vite、antd 的 react 项目

17. UI 组件库

⏰ 学习 antd Message 组件的使用

18. empty

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

⏰ xxx

to top

目录

open in vscode

Copied!

✅ 已完成：44

0101. react roadmap

📂 TNotes.yuque
- TNotes.yuque.react.0101
1. 📝 概述

1. 📝 概述

https://roadmap.sh/react
- react 学习路线
- pdf 已上传到语雀。

👣 9567 | 2025年09月06日周六 15:23:09

Last updated:

Pager

下一篇✅ react 是什么

🫧 Discussions

49c6f32e-3d80-4b9f-a9b1-e85542374dbb