【搬运】B站UP主超实用前端学习路线

# 我们把学习分为5个阶段

## 1\. 第一阶段 **html css** 菜鸟教程网学习 html css 别用框架 方法：模仿网站写静态网页 编辑器推荐：vsCode 建议初学者可以关闭代码提示 **js** 数据类型，操作符，变量，函数声明，DOM编程，Ajax等等 **书籍：** JavaScript高级程序设计，api基础介绍的全 DOM编程艺术，案例贯穿，无废话 **总结：** github写静态网站部署 不要学框架，不要学框架，不要学框架

## 2\. 第二个阶段 以node作为辅助工具辅助前端工具使用 npm基本指令 webpack+阮一峰es6教程 在webpack官网上学习到开发 目的是能够以容器的形式访问前端项目，热更新，css预处理

## 3\. 第三个阶段 学习 vue react angular，推荐vue，门槛低，文档友好 可以用对应的 vue-cli crate-react-app ng-cli 的脚手架来创建工程省去webpack的配置 库的学习，vue，react的周边库 AntDesgin Element **建议：**多读官方文档 多读，多想，多练，自己解决最香，因为于你探索的行为作为片段编译到你脑海中记忆更深刻

## 3.5 第三点五个阶段 回归初始技能，做知识的深度拓展，回顾知识点，巩固所学知识 **建议：**总结出自己的知识库，并主动输出

## 4\. 第四个阶段 1\. 在选择css预处理器的时候，为什么会选择Sass，而不是使用Less？ 2\. PostCSS和另外两个又有什么区别？PostCSS是通过js转义样式的工具比如px->rem 3\. css的新方案有了解吗？什么是styled componet css modules 4\. webpack和rollup的区别 5\. snowpack和vite的区别 6\. Vue，React，Angular的区别 7\. 函数式编程的redux还是用响应式编程的mobx 代码风格：eslint prettier 代码质量：编程体验以及更少的错误，类型校验 TS和flow ts的收益>学习成本 所以推荐~ 测试：单元 集成 E2E jest Enzyme puppeteer APP：PWA，混合式开发RN Weex ，flutter 小程序：trao uni-app SSR：Next（React）Nuxt（Vue）

**总结：**提升知识的深度和广度**,**不要停留在技术表面 stay hungry，stay foolish 被乔布斯捧红的一句话意思是"求知若饥,虚心若愚"

B站还有好多教学课程，有需求来领 https://www.bilibili.com/blackboard/activity-20201024m.html