前言

前端工程师是一个出现了10年左右，而颇受重视则是最近这五六年的事情。受到重视到前端从业人员井喷，也就是这一两年而已。因为前端工程师这个职位出现得太晚，导致各大学校均没有系统的相关教学，我们所熟知的各个大牛均是自我研究自我学习的。而随着google推出v8引擎以来，尤其是gmail对ajax的应用，再随着jquery的出现，解决了各大浏览器的兼容问题，而nodejs则将js推向服务器端，javascript从一个边角料的语言变成了一个性能强劲，前后端通吃的强大语言。

技术的发展紧紧是一个方面，更重要的是这几年万众创新，互联网+的概念深入人心，因此大量资金涌入互联网领域，大量的创业公司如雨后春笋一样涌出。大量的公司需要前端工程师的加盟，因此大量后端工程师开始转向前端。

而这些后端工程师因为其深厚的编程思想，他们完全无法忍受毫无逻辑可言的html+css+js的原始编程状态，因此又开发了各种前端工具以及语言。如针对html的jade模板引擎，针对于css的less、sass、stylus等。而为了便于项目部署，又有了所谓的amd、cmd标准。一直发展到browserify、webpack等打包工具。而自从Misko Hevery开发了AngularJS之后，破天荒一样的整出了双向绑定的概念，自此，前端江湖真是百花齐放，争奇斗艳，一发不可收拾。

晕了，真的晕了。难怪真阿当同志在2016年年末在csdn上痛心疾首的指出，这已经乱到乌七八糟，再不是他熟悉的那个亲切的前端世界了。世界潮流浩浩荡荡，不会因为真阿当这样的前朝遗老就停止发展的步伐。在npm上各种组件、框架、工具每天都在上架，已经上架的不断的在升级，甚至，有的升级是以小时计！

而由于前两年前端工程师的紧缺，导致薪资颇为水涨船高，大量不明所以的路人涌入前端行列，以至于在知乎上关于如何入门前端，前端学五个月能不能工作，以及各种咨询如何从事前端行业的奇葩问题如沙滩的贝壳一样俯身可拾。

在这混沌乱世，我不禁要问，到底什么是前端工程师？到底掌握什么技能才能称之为前端工程师？

什么是前端工程师？

现在的前端工程涉及的面实在是太多了。以至于很多人搞不清楚，以为会点html+css就是前端工程师了。我把前端工程师分为以下两类：

前前端工程师

此类工程师的工作主要是和设计师对接，将设计师的设计稿像素级还原成html+css的网页。也就是说，很多所谓的老前端工程师，或者自认为学点html就能成为的前端工程师，只不过是前前端工程师而已。

在html、css、js三门语言中，很多人认为困难的是js语言。对吗？对也不对。

js语言的困难在于他是一门真正的编程语言，所以写js编程是需要逻辑能力的。而这个逻辑能力是相当一部分人欠缺的。所以认为js语言难也就不足为怪了。但是，我认为js语言是这三个语言中最简单的。为什么呢？正因为它是一门逻辑语言，所以他是可以推导的。如果你本身逻辑能力不差，又或者学习过其他编程语言，入手js语言并非一个很困难的事情。

真正的难点在于html、css这两个所谓的语言。很多工程师嘲笑前端工程师说，html、css算编程语言吗？

我回答你——不算！

正因为其逻辑不强，是一个非常松散的语言状态，才导致其无比之难。你没有什么可以推导的。这样写也行，那样写也行，无论怎么写，只要能实现效果就行。问题是，优雅吗？

好比几乎所有中国人都认识3000个以上的汉字，任凭谁都能写点东西，但是真正能够让人感觉写得好的，寥寥无几。这是两门感性的语言，和其他编程语言完全不是一码子事儿，所以，这才是真正的难语言。

有人说，实现效果就行呗！对，正如我们每个人都能把话说清楚，不求堆砌华丽的辞藻一样，这样是能够与人交流了，上街也能买卖东西做生意。但是，在对前端工程师要求越来越高的今年，你还真心以为就会俩标签div+span就可以给自己戴上一个所谓的前端工程师的帽子，然后就月薪过万，当上CEO，迎娶白富美走上人生巅峰了吗？

做梦去吧！

如果你逻辑能力确实不强，但感性，理想化，尤其是文章写得还不错，如果还是个爱浪漫的女生愿意从事前端工作。那么如果你把html+css这两门语言深入进去学习，也是颇有可为的。

另外，虽然现在各种前端框架热火朝天，但是你看看现在主流的大型网站，新浪搜狐网易腾讯，是不是基本上都是老一套，除了页面设计越来越美，我没见哪个大型网站会使用angular、react、vue这些东西。所以前景还是很美好的。

但如果你是个抠脚丫子的糙汉子，咱还是别了，咱们有重体力活儿可以干！

后前端工程师

什么是后前端工程师？上面的前前端工程师其实就是原来的前端工程师，而这两年炒得火热的前端工程师实际上是把原来属于后端工程师的活儿给抢过来了。所以我把它命名为后前端工程师。

后前端工程师需要至少了解一门后端语言，了解json数据交互格式，了解至少一个前端框架，当然js语言基础绝不能差。了解项目构建，路由设定，数据库原理，服务操作等等一系列的基础知识。

具体负责的工作就是将前前端工程师开发好的网页，基于某种前端框架，与后端接口对接，并部署调试等。当然，在大部分公司，是不会把前端工程师分成前前端工程师和后前端工程师的，所以，页面制作的工作也需要由你来实现。

这才使真正的前端工程师。

当然，如果你希望往全栈去发展，那么服务端Node.js编程也需要掌握，我大前端牛逼啦！站在泰山之巅振臂一呼，还TM有谁？！

如果你真心如此牛逼，那早已走上技术巅峰了。只是，纵观火热的前端圈，又有几人能达到如此境界呢？高处不胜寒啊！

我想从事前端，我该如何入手呢？

首先，基础的html+css是必须掌握的，就好比学习中文一样，你必须先掌握3000左右的识字量，才可以说略懂中文。但是，在掌握了html+css基础之后，如何发展，取决于你自身的特点。

如果你比较年轻，大学刚毕业，自认为逻辑能力不错！，那么建议直接进入后前端的学习，深挖js语言，再根据你所在的公司的实际情况，选择一个主流的前端框架进行深入，在js不断深入的过程中不断的开发项目，如果能遇到一个好的公司，好的团队，你将快速的提升自己的技术能力，建议你从后前端的不断深入，然后不断提升前前端技能，最终达到真正的大前端。将来往全栈发展都是很有希望的。

如果你比较年轻，喜好文学，感性浪漫，建议深入学习html+css，再附带了解js语言，如果在一个不错的团队中，可以接触到那些后前端非常厉害的同事，你未必能如它在这些方面如此牛逼，但是你依然可以进步不小。不过，html+css是毫无捷径可言的，都是慢慢打磨出来的实力。你在js方面可能确实不如别人，但是要做到，同样的一个页面，你写的html+css就是比别人的简洁，整齐，优雅，那么你自然有你的存身之道。建议从前前端入手，深入后再往后前端靠拢，具体能提升到何种境界，要看你的天赋与努力的。

我是后端工程师转前端，咱别费那个劲了，以你多年的后端经验可想而知，你的html+css水平一定是垃圾，就是因为你这样的后端工程师的存在，才导致前端工程师奋起争先，往大前端发展的。不过没有关系，你可以扬长避短，利用你无比牛逼的逻辑能力与后端变成语言天赋，直接入手js语言以及某一个前端框架。推荐angular或者react。因为这俩框架就是你们后端写的。你会无比亲切。至于html+css这种小事情，教给别人去写啦！当然，你还可以深入研究node.js，往服务端发展，也是很不错的职业栈。

我是什么类型的前端？

吹了这么多牛逼，肯定有很多人不服。好，我简单说下我的情况。

我学得是中文。前端工程师这块基本全部自学，擅长html+css。目前从事vue技术栈的开发工作。04年入行从事网页切图仔的工作，国内第一批研究所谓div+css的人。擅长seo优化网站，语义化书写网页。12年以前没有关心过js语言。

目前在后前端的路上奋起直追。说我的前端经验，12年从业。但是真正在js语言上用功，也就是这两年的事情。所以，我是一个老菜鸟。

「 需要学习基础知识点 」

• 新手必打基础

1. HTML4\HTML5

2. CSS2\CSS3

3. ES5(原生 js 基本语法)

4. JSON 数据结构

5. 网络请求、AJAX

6. 学会用google，我不能说

• 中级进阶必打基础

1. ES6 语法糖

2. 同步、异步思维

3. chrome devlop 控制台熟练调试

4. 模拟请求工具、抓包分析等

5. vue、react、angular 熟悉

6. scss、less 等css编译

7. 学会用google，我不能说

• 中高级进阶必学

1. 前端自动化配置 webpack、gul 等

2. nodejs简单开发

3. vue、react、angular挑其一熟练开发项目

4. 前后分离思想 + Async、Await 思想认识应用+和后端撕逼如何高效开发

5. 学会用google，我不能说

• 高级开发必学

1. 学会高效率撕逼

2. 学会高效率沟通 + 背锅

3. 学会如何避免长时间加班

4. 想想除了业务开发之外的后路

「 通过什么渠道学 」

1. 培训班

2. 网络自学

3. 在线教育

培训班今天不说，我也写过不少，自己翻一下之前的文。今天主要说自学

「 自学方式」

1. 看文档

2. 看视频

3. 看书 、电子书

我总结的差不多就是普通人自学的方式，牛鼻天才无师自通可以无视，普通人最难熬的并不是技术多难，而且战胜不了另一个自己。很多人半途而废，所以我一般都会劝大家直接干脆放弃IT，没错，我就是那个爱劝离的人。

因为你没有很大兴趣和决心，劝你别浪费钱和精力转行程序员，你坚持不了多久的，如果很有兴趣我一般劝他挑一个靠谱培的训班，这样成才的几率大些，毕竟普通人实在是太懒、太三分热血了。

新手入门：我建议 你用 方式2 看视频，跟着视频学，视频图文并茂、绘声绘影，边看边敲 进步很快，也容易理解，强烈建议 ，建议质量不错的渠道有：慕课、极客学院等，打基础查字典去W3C。

中级者：建议你用 方式 3 多看书，电子书 买基本不错的书，结合文档和资料 学就行了，书还是比文档有趣和好理解一些，而且挑到合适的书会事半功倍。

这里给点建议：凡是 带字眼 ：xxx技术 深入浅出、xxx技术从入门到精通、xxx宝典等这些字眼的书一般别抱希望，你是进去就出不来，或者你压根就进不去，或者讲的比皮毛还皮毛，比流水账还流水账，不但花钱还会误导你，让你放弃。不如直接来一本 xxx从入门到放弃

高级者：直接官方文档吧，比如 vue文档是公认的好，清晰，学 vue 不要在问我要资料和途径，官网文档就是最好 最好的学习途径+ google 就是利器，无需其他了。如果一个中高级开发者 要学新技术 连文档还不会看，懒得读，我劝你直接放弃本行业吧。说话有点毒，不过我真的劝你别浪费时间了。

「 最后声明 」

本文提到的视频网站，没有任何商业利益，只是单纯的推荐给大家，如果x课、x客 官方人员看到想给我广告费，我也可以考虑接受
某课 还总不定时邀请我去出有偿讲座视频，由于太忙，拒了，其中质量把控个人认为在国内还是第一档，比很多散户讲师质量好多了，所以如果看视频首选那里。

最后祝愿大家，早日成才，早日年薪百万，毕竟你们越尽快富有，我越可以得到更多的喜欢不是吗？你们看到这里你们还不懂吗？还不赶紧动手？

我收集和整理了很多这方面的视频教程，讲的基本上通俗易懂，充满风趣，有想学这一门技术的小伙伴，可以来学习和搞资源，web开发学习交流，群; 前面926338675就可以找到我了