delktsai / react-step-by-step

:book: react-step-by-step 是一个 react 技术栈中文教程

React 爬坑指南

👉 React 爬坑指南电子书

💡 引言

初学 React 的时候，相信大部分人都有这样的体会：React 技术栈水太深，涉及的技术点太多了。

如今网上有不少 React 相关的教程，但多的是是完整的 React 项目，少的是庖丁解牛式的、一步步的搭建 React 项目框架的教程。而且，React 涉及的技术点很多，常常让人有种无从入手的感觉。

如果，你也有这样的困惑，不妨阅读一下 如何学习React(react-howto) 。这篇文章提出了一个合理的学习 React 技术栈的顺序，我认为很有道理。

本教程采用 react-howto 中提出的 React 技术栈学习路线，由浅入深，循序渐进的为你一一讲解 React 。

如果，你有任何疑问或建议，欢迎在 Issues 中提出。

📝 内容

• Prepare - Html, Css, Javascript
  • Html 快速入门
  • Css3 快速入门
  • Css3 快速入门（二）
• Chapter01 - React
• Chapter02 - Node, Npm, Yarn
  • Node入门
  • Node代码组织
  • Node的IO操作
  • Npm入门
• Chapter03 - Webpack
  • 如何学习 Webpack
  • Webpack 概念
  • Webpack 入门
  • Webpack 资源管理
  • Webpack 代码分离
  • Webpack 开发工具
• Chapter04 - ES6, Babel, ESLint
  • Babel 入门
  • ES6 入门
  • ESLint 快速入门
  • ESLint 配置
  • ESLint 命令
• Chapter05 - React Router
  • React Router v4 简介
  • React Router v4 基础
  • React Router v4 进阶
  • React Router v4 API
• Chapter06 - Flux, Redux
  • Flux入门
  • Redux入门

Editing...

📌 说明

​本教程已使用 Gitbook 生成电子书。👉 react-step-by-step 电子书

• codes ：所有示例代码存放于 codes 目录。

  我在学习 React 过程中，发现网上大部分示例动不动就是一大堆 React 技术整合在一起。这让初学者经常感觉很无力：一个技术还没搞懂，就要学另外一个技术，立不动心啊。

  所以，我建立了一个连续性项目: jigsaw（拼图） 。之所以叫连续性项目，是因为它是一步步引入 React 技术。

  每个 jsgsaw 目录，都是基于前面 chapter 的基础上，引入本 chapter 重点学习的技术。我觉得，通过这种方式，能更加晰的理解，如何搭建一个完整的 React 项目。

• docs ：所有文档存放于 docs 目录。并且文档遵循 GitBook 规范。为了取得更好的阅读效果，建议参照 docs 说明 阅读本教程。

• Git ：采用 gitmoji 规范填写提交信息（带图标的提示信息很有趣）。