发布于 2026-01-05 8 阅读
0

React 入门完整路线图 - React、Hooks 和 Redux、UI 组件和样式、React 框架、GraphQL

学习 React 的完整路线图

入门指南 - React、Hooks 和 Redux

UI组件和样式

React框架

GraphQL

原文发布在 Notion 上,欢迎查看。链接
在此。

React 是 Facebook 开发的一个用于构建可组合用户界面的库。它鼓励创建可重用的 UI 组件,这些组件可以呈现随时间变化的数据。React 对 DOM 进行了抽象,从而提供了更简洁的编程模型和更佳的性能。

入门指南 - React、Hooks 和 Redux

你可以通过多种资源学习 React.js。选择最适合你的资源。

请参考 React 官方文档进行学习。

React——一个用于构建用户界面的 JavaScript 库

在 Udemy 上选修一门课程。

一些最佳课程的链接。

现代 React 与 Redux 培训课程

React 16:完整课程(含 React Router 4 和 Redux)

观看 YouTube 教程。

React 完整课程(YouTube 上最好的课程)

2020年完整React课程 - 学习基础知识、Hooks、Context API、React Router、自定义Hooks

完整的现代 React 教程

只关注 React 概念(请留意概念讲解)

ReactJS 入门教程

React Hooks教程

如果你想快速入门。

学习 React JS - 完整入门课程 - 2019 年教程

在本节中,您应该已经学习了 React、Redux 以及其他各种包和技术。这里有一个关于 Create React App 的快速链接。

创建 React 应用

深入了解 Redux

请参考以下网站了解 Redux 的深入概念。

React Redux | React Redux

Redux 工具包 | Redux 工具包

完整的Redux高级课程。

终极重制课程

通过这个播放列表理清你的 Redux 概念。

React Redux教程

Firebase 与 React

了解如何将 Firebase 集成到您的应用中。

React、Redux 和 Firebase 应用教程


UI组件和样式

虽然你可以使用 CSS、SCSS 来进行样式设计,但也有一些 UI 组件库可供选择。

UI库

Material-UI:一个流行的 React UI 框架

Ant Design——全球第二大最受欢迎的 React UI 框架

React JS 设计系统

样式组件

事实上,这是 React 最强大的样式工具之一。

styled-components

另外,还可以看看这个超棒的 CSS 框架。

Tailwind CSS - 无需离开 HTML 即可快速构建现代网站。

这是一个很棒的网站,可以激励你开发出很棒的东西。

React.js 示例

另一个提供大量适用于 React 项目的优秀库的网站。

React 库

现在你已经全面了解了 React、样式和 Firebase,来看看这个精心挑选的一些很棒的 React 项目播放列表吧。

React最佳教程

下面还有完整的 React 产品路线图。

替代文字

此时,你应该已经完成​​了两到三个项目,可以开始学习下一个项目了:React框架。

React框架

使用 React 的最佳框架有两个。

Gatsby.js

适用于现代网络的最快前端

以下是一些YouTube上最好的教程。

Gatsby教程

Gatsby JS - 了不起的 Gatsby 速成班 [完整教程]

Next.js

Next.js 由 Vercel 开发 - React 框架

以下是一些YouTube上最好的教程。

Next.js 入门教程

Next.js 速成课程 2021


GraphQL

这是一个非常棒的查询工具,特别是如果你使用 Gatsby 或 Next,那么你一定要学习它,因为它们都非常依赖这个工具。

您的 API 的查询语言

以下是一些YouTube上最好的教程。

GraphQL教程

GraphQL完整课程 - 从新手到专家

文章来源:https://dev.to/zephyrus21/complete-road-map-to-learn-react-3kfd