从零入门前端学习路线分享（学习方法、推荐书籍）

爆肝日更后端复试后端产业化

👆

我经常会看到很多老师在自学后端的这时候比较迷惘，不晓得到底应该以怎样的自学走线来高阶和高阶后端领域。每天碰到这种难题我也会撷取呵呵自己的自学经验，但发现这是两个问得十分多的共通点难题。作为开发人员，肯定非难多次重复乳白色的劳动，因此我就深入细致归纳撷取呵呵我的后端自学走线，责任编辑为「后端高阶」部分，希望对你能有协助。

序言

后端自学是两个螺旋形上升的过程，既要反反复复地看电视，也要到时候展开两栖作战。只看电视，看了就会忘，所以必须将看电视和写标识符并重。只要你深入细致学，高阶后端的话3～6个月左右就能了。后我还得出了后端高阶走线，协助你提升后端专业技能水平。我把后端高阶和后端高阶一共分为五个期，并对相应期所须要的大体的自学时间展开了标示。责任编辑为「后端高阶」，仅包括前三个期。

后端高阶

高阶后端开发主要须要自学 HTML，CSS 和 JavaScript 三大件。后自学后端主流架构的采用，并如前所述已学内容开发两个小项目展开两栖作战。当你把那些自学并理解有条理以后，也即使真正地高阶后端了。

期一：HTML + CSS

后端对于高阶者相当亲善，因为开始自学的这时候你只须要两个应用程序，所推荐 Chrome。HTML 和 CSS 能直接运转在应用程序中，应用程序是它们的运转环境。你也能采用GUI，所推荐 VSCode，这是后端开发采用最多的GUI。HTML (HyperText Markup Language) 和 CSS (Cascading Style Sheets) 只不过并不是C语言。HTML 英文名叫作LZ77记号语言，只不过是许多条码。CSS 英文名为竹节JSP，也是许多样式的配置。首先自学 HTML，比较简单。HTML 有十分多的条码，刚高阶的这时候不要沉浸于在读懂那些条码中，你也讲错。你只须要总体下载两遍，晓得有什么样条码，各自的作用是什么，总体有两个第一印象xml了。我所推荐跟着MDN 的 HTML 自学方向[1] 过两遍xml。我自学 HTML 的这时候还看完两本，你钟爱也能看呵呵，这是这点较好的书了：《Head First HTML and CSS》《HTML5 与 CSS3 基础教程》看完后能人格检验呵呵，例如常见的条码有什么样，<!DOCTYPE>的作用是什么，什么样条码是行内条码，什么样是块级条码，HTML5 有什么新特性等。这里不要花太多时间，大体过呵呵即可，不用都读懂，后有须要再回来查xml。接下来自学 CSS，直接所推荐目前最适合 CSS 高阶的书：

《精通 CSS（第三版）》

在高阶期，不须要将整本书一字不差地看完，你只须要抓住几块核心内容，例如选择器、竹节、继承、盒模型、Flex 页面布局和网格等。那些内容快速过两遍xml，太细节的内容不用记，后须要了再回来查。最近我又发现了一本 2020 年的新书，《深入解析 CSS》，奇虎团工程师翻译，质量有保证。这本书讲得也十分详细，你也能买这本不买上面那本。有了那些基础知识，你就能展开两栖作战了。这里所推荐百度后端技术学院平台，他们这都是开源免费的后端题目，应该是为了培养后端人才，让自己能够招到更合适的人而创建的。他们的课开了四年：IFE 2015: https://github.com/baidu-ife/ifeIFE 2016: http://ife.baidu.com/2016/static/index.htmlIFE 2017: http://ife.baidu.com/2017IFE 2018: http://ife.baidu.com/现在打开 IFE2018 中的第五题[2] 开始写静态页面吧（只是举例，具体能自己找题目做）。然后你会发现，你根本写不出来。这是很正常的，那你就去看别人的标识符，看一点你就开窍了，就晓得怎么写了。忘掉的属性就回去查 MDN 或者查我所推荐的书，如此反反复复你就读懂了。写完两个页面后别急着往下写。你写的第两个页面肯定有很多难题，例如属性采用错误，标识符缩进不规范等难题。这这时候你应该找两个标识符规范，例如百度后端标识符规范[3]，根据规范重写你的标识符。这个规范我只是举两个例子，自己上网搜呵呵，好的大公司都有自己的规范，这个不是规定死的，风格统一并且可读性强即可。重写标识符后，你再去看看别人提交的标识符，这个页面是怎么写的，如果身边有技术好的后端，能让他帮你指点呵呵。这这时候你应该就晓得如何写两个页面，并且怎样才能写好两个页面了。然后你能自己再去找几个题目，写几个页面熟练呵呵。以上为期一内容，用时 10~20 天左右。CSS 高阶：自学 CSS 核心内容不须要很多时间，但只不过 CSS 是细节十分深的两个技术。前期不要陷入其中，那么你会问如何深入自学 CSS 呢？我所推荐许多较好的权威书刊，基本看那些就够了。《CSS 世界》：张鑫旭大神的书，十多年的 CSS 经验撷取，高阶内容。《CSS 选择器世界》：张鑫旭大神的另一力作，深入讲解 CSS 选择器。《CSS 揭秘》：各种 CSS 奇淫巧技，主要是来开阔视野。《CSS 权威指南》：属于 CSS 的新华字典，很全面，属于一本工具书。

期二：JavaScript

自学了 HTML 和 CSS，能开始自学 JavaScript 了。这也是至关重要的期。JavaScript 主要包括语言基础（ECMAScript）、DOM 和 BOM 三部分，如果你是初学者，会想这到底是啥，咋还三个东西。那就开始学起来，学完你就晓得啦，只不过没那么难。自学这部分，一定要从现代 JavaScript 教程学起：现代 JavaScript 教程是 React 官方文档中与 MDN 并列所推荐的 JavaScript 自学教程。这个教程解决了现存 JavaScript 书刊最大的痛点：实时性。技术领域的书刊在实时性上一直都存在很大的难题，而这个教程却解决了这个难题。并且它为读者搭建了良好的自学走线，图文搭配，由浅入深，内容足够详细也足够全面，你就按着教程顺序自学xml了。此外，每节内容后，还得出了高质量的课后习题和解析。通过做题能帮你检验自己的自学效果，并巩固新学到的知识。教程地址：https://zh.javascript.info/学完这个教程，你就只不过已经学完了 JavaScript。你可能还听说过 ES5/ES6/ES7/ES8……，只不过你也已经学完了，而且还通过这个教程做了很多两栖作战的小例子。教程里还将技术点与实际应用联系起来，让你晓得这个知识点在实际开发中是如何采用的，它解决了什么难题。在学现代 JavaScript 教程的同时，我所推荐你买几本权威书刊，其中红宝书为必看电视籍。只不过那些书所讲的大部分在教程里都有，不过能相互补充取长补短，同时还能巩固知识点，加深你对 JavaScript 的理解：《JavaScript 高级程序设计(第 4 版)》：俗称红宝书，这本书 1~11 章讲的是语言特性，一定要掌握。如果你有其他语言的编程基础，理解起来会更快。第 12、14-17 和 23-26 章是重点内容也要重点看，第 13、19 和 21 章是次重点内容，尽量看呵呵。第 28 章是最佳实践，能在看完前面那些部分来自学呵呵如何写出更好的标识符。第 18 章 Canvas，第 20 章 API，第 22 章 XML 和第 27 章工作者线程，能在学有余力或者用到的这时候看呵呵，不是初期重点内容。书中有大量 API 的章节，不用死记硬背，下载呵呵xml，用到再回来查。所推荐先看《现代 JavaScript 教程》再看这本红宝书，或者搭配着看。因为这里的内容在教程中都有，而且都是最新的，红宝书能用于复习巩固。红宝书对新手不亲善，这是因为其章节编排并非由浅入深，让初学者抓不住重点，什么都想学，什么都讲错，挫败感强。《JavaScript 权威指南（第七版）》：俗称犀牛书，第六版的犀牛书是大而全的工具书，但是第七版做了大幅更新，跟进到了 ES2020，增添了 Node.js 的相关内容，还删掉了很多过时的 JS 特性相关内容。现在能说是十分值得购买阅读的一本书了。《ES6 标准高阶》：你一定听过 ES6 或者 ES2015 吧，只不过指的是两个东西，是 2015 年发布的 ECMAScript 规范，发布的许多语言特性。这本书是阮一峰老师的书，是自学 ES6 必买书刊，当然里面也参杂了许多作者的个人理解。《深入理解 ES6》：尼古拉斯大佬的力作，必买书刊！讲解十分详细且深入。《深入理解 JavaScript 特性》：尼古拉斯大佬的最新书刊，由李松峰老师翻译，主要讲的也是 ES6 的内容。《JavaScript DOM 编程艺术》：DOM 自学书刊，本书主要讲的是 DOM 知识，还会带你通过两栖作战深入理解相关知识。以前大家会很所推荐这本书，但是现在我看完后觉得，你看完其他书能买本下载下。《JavaScript 语言精粹》：俗称蝴蝶书，很薄的一本，里面讲的都是 JavaScript 语言最核心的部分。半天就能看两遍，能买了反反复复看，只是版本有些老。《Head First JavaScript 程序设计》：这本书对于没有编程经验的新手亲善，内容比较简单。期二用时 1~3 个月左右，没有编程经验的老师可能须要更长。如果你有编程经验，学起来会轻松许多。所列出的书不用全都看完，而是挑选重点，相互补充着看。对于 API 相关内容不要死记硬背，大概下载即可，用到的这时候再查，多些标识符就自然读懂了。那些书我都有，也是挑着看，补充着学。

期三：高阶后端架构

学完后端三大件，打好了大树的根基，就能开始扩展专业技能树了，开始自学后端架构。后端的非主流架构目前主要为 React，Vue 和 Angular。选择哪个架构呢？你能去知乎或者其他网站搜一搜，然后根据你的个人喜好展开选择。一般是在 React 和 Vue 中选两个。React 的开发体验更类似于写原生的 JavaScript，要求你有较好的 JavaScript 基础。Vue 则引入了模版，将很多实现封装成了 API，你须要读懂并调用 API 来展开开发，因为很多都是封装好的，所以自学起来较为简单，只是编程的感觉稍微弱了许多。这两个都是十分优秀的架构，新人不必纠结于选择哪个架构，学了两个，另两个也很容易学。如果你不晓得选择哪个，我所推荐你先自学 React。Vue 相对来讲偏向通过模板的方式也是调用 API 来写页面（当然现在 Vue 3.0 也正在跟进 Vue 的 JSX 写法，类似于 React），而 React 则是更偏向于通过写原生 JS 的那种方式写页面，使得逻辑和页面分离开来。我所推荐的自学走线如下：阅读 React 官方文档：先自学文档中核心概念部分，然后跟着官方文档写出文档中的井字棋。然后自己写两个 Todo App。然后自学慕课网 Dell 老师的 React16.4 快速上手[4] 和 React16.4 开发简书项目[5] 课程。还能继续选许多百度后端技术学院里的经典题目来巩固 JavaScript 的基础知识和采用。在这个过程中你会学到很多知识，会用到 React 的高阶知识，那么就把 React 官方文档中的高级指引，API Reference，Hooks 等部分的内容学完。还会学到 React Router，Redux 等内容。会学到从零开发两个完整项目，从项目配置到组件拆分，到项目打包和上线的完整流程，还会学到 React 架构的许多底层源码级知识。如果你选择了 Vue 架构，自学走线也类似：阅读官方文档，写许多简单的 Demo。然后自学慕课网 Dell 老师的 Vue 2.5 高阶[6] 和 Vue 2.5 -> 2.6 -> 3.0 开发去哪儿网 App 从零基础高阶到两栖作战项目开发[7] 课程，中间穿插做许多百度后端技术学院的典型题目巩固 JavaScript 的基础知识。此期用时 1~2 个月左右。至此你已经成功高阶后端开发了，恭喜你 🎉🎉🎉期一到期三共计用时 3~6 个月左右。以上都学差不多了，你就能找许多算法题，例如 LeetCode，找一些自己钟爱的项目，找许多大厂复试题，学起来做起来，不断巩固自己的知识掌握程度。参考资料