嘿,欢迎来到React学习资源库!这里整理了一些React全栈开发的学习资料,从零基础到实战项目都有覆盖。不管你是刚入门的新手,还是想提升技术的开发者,都能在这里找到适合自己的内容。仓库的目标很简单:希望每个人都能快速上手React开发,并且能够构建出可用于生产环境的应用。别担心经验不足,每个高手都是从新手开始的。带着热情和坚持,相信你也可以做到!这个资源库会持续更新,如果你也有好的学习资源,欢迎分享出来,让我们一起打造更好的学习社区。毕竟,学习的路上有伴才更有趣,不是吗? 😄
如果你感兴趣,这是我推荐的React学习资源:
学习React肯定要有一些基础知识的,这里准备几个资源让你快速掌握前置知识, 如果你已经掌握了某些主题,可以随时跳过。
- 三小时前端入门(html+css+js) 深入浅出,3小时快速掌握前端三件套核心概念。
- html+css零基础教程 如果想要详细了解前端入门技术,这个课程绝对适合,通俗易懂。
- JavaScript 6小时初学者速成课程 6小时速通js和核心概念
- JavaScript全套课程 来自200多万订阅的博主js全套课程,适合想更详细去学习js的同学,用来查漏补缺。
- freeCodeCamp学习社区 备受欢迎的编程学习社区,通过边学边练的交互式课程快速学习HTML,Javascript等多种编程语言
- Git初学者教程:1小时学会Git 拥有YouTube四百多万订阅的博主Mosh带你快速掌握Git
- GitHub小白指南 完全针对小白的教程,适合快速上手
- 游戏化学习Git 通过互动式加可视化来教授Git
- MDN 非常重要的 Web 开发文档平台, 遇到不会的就去查一查。
- 1小时快速入门node.js 学习react前了解基本的 Node.js 概念足够
- Node.js零基础视频教程 nodejs新手到高手,如果有颗全栈梦,这个技术讲得很细
- 30分钟掌握Webpack 快速掌握Webpack
- AI全栈导师 利用AI技术自动生成教学文档,适合基础不扎实去细化学习。
50projects50days 学完之后你可以这个通过这个仓库来做 50 个迷你小项目来测试磨练下基础前端技能。
- React 官方文档 - 官方 React 文档
- React 官方中文文档 - 最新的 React 官方中文文档,2023年重写
- Create React App 中文文档 - 创建 React 项目的官方工具
- React 菜鸟教程 - 基础语法入门
- React-Router 中文文档 - React 路由中文文档
- React 入门实战教程 - 边学边练
- React学习指南 - 如何在3到6个月内掌握React
- ES6特性 - 查看ES6和其他最新版本特性
- React 备忘单 - 针对初学者的全面 React 备忘单
- React 模式 - 18 种短小精悍的 React 模式案例,通俗易懂值得收藏
- React 学习路径 - React 前端工程师实战学习路线
一定要边学边写,避免一遍过就结束了。
- React 技术全家桶 - B站尚硅谷React教程
- React 速成课程 - 3小时速通 React 的基础知识
- React基础到项目实战 - React18的视频教程
- 最新React课程 - Youtube Bro Code的react课程
- React 初学者指导
- React的全套课程 - Youtube上的React精品全套课程
- React JS 初学者完整课程 - 包含近 9 小时的 React JS 代码和指导
- 超全的React初学者课程列表
- 使用 Redux Toolkit学习React 18 - 针对初学者的完整课程中学习如何使用React 18和Redux Toolkit
要深入了解React开发流程,不仅要掌握技术细节,还要理解作者的编码思路和写作规范。
- 全栈应用项目实战 - 学习在23小时内构建 4 个全栈项目
- 构建一个简单的电影应用 - 使用 React 和 Vite 构建一个简单的电影应用
- 边学边练 - 用React部署 3 个现代 Web 应用程序
- 通过一个小项目学习React - 通过一个项目分解您需要了解的React中的所有最重要的概念。
- 构建一个LMS网站 - 了解如何使用 React JS 创建完整的 LMS 网站,以及类似 Udemy 的网站
- 全栈应用项目实战 - 学习在23小时内构建 4 个全栈项目
- 掌握React 18 与TypeScript! - 使用TypeScript学习React 18并构建一个出色的前端应用程序
- React Native 速成课程 - 3小时内构建一个移动应用程序
收集适合学习React和相关技术的优质频道
- JavaScript Mastery - 专注于提供高质量的JavaScript和前端开发教程,通过实际项目构建来教授现代web开发技术,特别关注React、Next.js等流行框架和全栈应用开发
- Programming with Mosh - 提供了完整的React入门到精通的课程,涵盖React基础知识、组件、props、状态管理等
学习React当中遇到的其他方面知识汇总
- 一小时彻底搞懂跨域和解决方案 - 我们在前后端交互的时候经常会遇到一个问题:跨域,如果想详细了解并解决这个问题可以看一下这个视频
- React 状态管理 - Redux 中文文档
- 前端精读周刊 - 包含一些React文章
- React 状态管理 - 包含大量 React 文章
- 阮一峰的网络日志 - 包含对于前端领域的独特见解
- Dan Abramov的博客
- Kent C. Dodd的博客
- React 技术揭秘 - React 源码解析
- React 入门指南 - 快速入门React
- React 入门教程 - 很细的入门教程
- React Book - 关于 React 的免费书籍。适合初学者到中级水平。
- React freebook - github上整理的一些react书籍列表
在学习中我们会遇到 一些问题,可以去社区或一些网站寻找答案,下面推荐一些好的React社区网站。
- stack overflow
- 知乎上的React话题
- segmentfault React 话题
- V2EX的React话题
- DEV社区 - 分享各种关于React的学习教程,资源等。
- Medium - 高质量的英文社区,涵盖关于React的精品文章。
- Reactiflux - 我们是一个由20多万名开发者组成的聊天社区,专注于React。
这里收集一些各个平台的社交账号,关注这些账号可以获得关于React的最新信息等
- React官方账号
- React Native官方账号
- DEV Community官方账号 - 有各种React教程博客
- freeCodeCamp官方账号 - 不定期分享各种编程教程,知识,包括React
- React DEV - 不定期分享分享与React相关的教程、课程、书籍、工作……
- React Trends - 不定期发布ReactJs最热门趋势
- Lee Robinson - 教一些react,next.js的知识
- @The_React_Dev - 没事发布一些精选React教程帖子
- @petarivanovv9 - 实用的 React、Node 和软件架构技巧
- @remix_run - 使用 Remix 和 React Router 构建更好的网站
- @housecor - 每天分享JavaScript和React开发技巧,内容实用
- kentcdodds - Epic React Dev课程创作者,提供全面React教程
- @ryanflorence - Remix联合创始人,讨论React框架和路由相关内容,适合框架学习者
- @BroCode1508 - 前端开发人员,精通 React.js、Next.js、Node.js 和 Express.js
这些是一些常用的 React 框架,它们可以帮助你快速开发不同类型的 React 应用。每个框架都有不同的特点和用途,适合不同的项目需求。
- next - React 框架
- remix - 专注于用户界面的全栈 Web 框架
- gatsby - 使用 React 构建现代网站
- react-admin - 用于构建 B2B 应用的前端框架
- refine - 构建基于 React 的 CRUD 应用,无限制
- React Native - 用于构建移动应用的框架
这些工具和库都是用来优化和增强 React 开发体验的。
- create-react-app - 通过一个命令设置现代 Web 应用
- vite - 下一代前端工具
- parcel - 零配置的 Web 构建工具
- million - 极快且轻量级的优化编译器
- reactotron - 用于检查 React 和 React Native 项目的桌面应用
- eslint-plugin-react - React 特定的 ESLint 规则
- why-did-you-render - 通知您关于可避免的重渲染的 React 补丁
这些是常用的 React 组件库,可以帮助你快速构建各种功能的组件。
- Awesome React Components
- react-select - React 的选择组件
- react-big-calendar - 日历组件
- react-datepicker - 简单可重用的日期选择器组件
- react-loading-skeleton - 创建自动适应应用的骨架屏
- react-qrcode - React 二维码组件
- react-archer - 在 React 元素之间绘制箭头
- react-icons - 流行图标包的 SVG React 图标
- react-complex-tree - 无偏见的可访问树
- react-insta-stories - Instagram 故事风格的 React 组件
- swiper - 最现代的移动触摸滑块
- keen-slider - 触摸滑块轮播
- cookie-consent-banner - 轻量灵活的 Cookie 同意横幅
- heart-switch - 心形切换开关组件
- kbar - 快速、便携且可扩展的 cmd+k 界面
- tagify - 轻量高效的标签输入组件
- puck - React 的可视化编辑器
- codesandbox - 在线代码编辑器,让开发者无需本地配置,适合快速开发调试。
- CodePen - 一个在线前端开发平台,可在浏览器中创建、编辑和分享前端代码。
- swr - 用于数据请求的 React Hooks 库。该项目是帮助开发者简化数据请求逻辑的 React 库
- million - 优化 React 性能,让您的 React 速度在几分钟内(而不是几个月)提高 70%。
- FeHelper - 一个浏览器扩展,格式化和美化JSON数据,使其更易读和分析
- Babel - 一个 JavaScript 编译器,把 “新的 JavaScript 语法” 转换成 “旧的、浏览器能识别的语法”。
如果这个项目对你有帮助,请不要忘记给它一个star ⭐