前端看起来简单,但其实入门曲线是比较陡的,因为涉及的技术面很广、很杂,不容易做到面面俱到并且都能够深入研究。因而业界最容易出现的现象就是:水平一般或者入门的前端工程师很多,优秀的前端工程师却很少。此刻的互联网行业挺缺前端的,但是缺乏的是优秀的前端。如果想在前端发展的话,一定不要浅尝辄止,否则很难找到比较理想的工作。

就前端而言,入门必须学三样东西,HTML 、CSS 和 JavaScript,人称:网页三剑客。学习 HTML、CSS 的目的是能够构建一张具体的网页,有内容,有排版,有样式,并且拥有合理交互的界面。学习 JavaScript 的目的是在于让页面和用户通过鼠标等媒介和网页进行交互。

HTML 比较简单,只需要熟练即可。HTML 要求能够根据内容构建具有语义的标准页面。通过对 W3CSchool 上的文章阅读能够对 HTML 形成初步的印象,并且理解语义 Web 的构建概念,能够简单地构建出一个类类似于博客的页面、内容骨架。如果有时间的话,还是有必要深入学习一下《HTML 权威指南》这类型厚重的书籍,你会发现学习完毕之后你对 HTML 的理解会上升一个层面。

CSS 入门还是挺容易的,根据设计图将 HTML 中的元素进行装饰然后制作出和设计图相一致的页面。但 CSS 要求使用的时候尽可能熟练,最好能够实验一下 CSS 中的每一种属性的作用,以及他们的组合所能够创建的各种效果。然而精通 CSS 绝非容易,这需要大量的实战经验,因为在实战中,项目往往比较复杂,在这种背景下能够大量书写错综复杂的 CSS 语句,能够得到更精细而具体的训练,能够遇到层出不穷的问题,然后在解决这些问题中成长。

CSS 在入门的时候,推荐阅读一些指南类型的书籍,然后尝试做一个简单的个人项目,练好 HTML 和 CSS 的配合。比如:纯静态的个人博客(这个博客就是典型的静态博客,只由 HTML 和 CSS 构成),只有在实践中技术才能够得到历练,才能够快速进步和成长。

在学习完了 HTML、CSS 之后,接下来就要开始进入前端程序设计的世界了。JavaScript 的学习就比较复杂了,毕竟是一门图灵完备的编程语言。如果想成为一个优秀的前端工程师的话, JS 是必备的,而且是要学得非常好的。一般推荐入门的时候啃一本稍微厚一点的,系统一点的书籍,强烈推荐《JavaScript权威指南》这本书。这本书值得坚持并认真看几个月,虽然中途你会有各种疑问,但是你可以暂且跳过,直到隔了几个月有更多的实践经验之后再来读第二遍,这样对 JS 的进步大有好处。值得一提的是,在学习 JavaScript 可以并行熟悉 HTML,达到运用自如的地步,同时不断练习 CSS 的各种技巧的使用。熟能生巧就是这个意思。

等阅读完了这种 Bible 级别的指南书籍之后,推荐阅读 《JavaScript 精粹》一书,这本书讲解了这门程序语言精彩的设计之处以及要避免的雷区。在此之后,《JavaScript 模式》、《JavaScript 设计模式》、《高性能的 JavaScript》、《编写可维护的 JavaScript》、Canvas 技术等相关书籍,用于深造和进阶理解这本表现力极度强大的程序设计语言。

当然,在入门了 JavaScript 之后,推荐学习 jQuery,来理解一个经典的前端工具库是如何造福前端,提高开发效率的。在 jQuery 之后也推荐学习比较火的 React 或是 AngularJS 等 UI 框架或者类库,具体按需取学,框架如此之多,但是慎重选择学习。

在以上的学习过程中,也可以并行插入对前端工具链的学习,包括自动化工作流程的:Gulp,模块化的 Browserify / Webpack,以及神器 Node。除此之外,ES6、函数式编程也是未来的趋势,值得在空余的时候进修跟上时代的步伐。

最后我提供一份自己前端视野的清单,供大家参考,也希望大家能够从中找到自己的发展方向,并探索自己的技术成长路线,欢迎 fork 一份,然后 pull request,让我们共同维护这个知识体系!

参考文档地址:FE