如何成为一名优秀的前端工程师

标签： 程序设计 前端 | 发表时间：2013-03-15 17:53 | 作者：标点符
出处：http://www.biaodianfu.com

一、技术的必须的

作为一名最基础的前端工程师你必须掌握HTML、CSS和JavaScript。三者必须同时精通，类似我字样对前端知识一知半解的，一遇到问题就停下工作就四处搜索解决方案的，首先就算不上一个合格的前端人员。像我这样的如果当了前端工程师那工期肯定是不能保证的。合格的前端工程师第一要学会的就是在没有任何外来帮助的情况下（包括搜索引擎），能够完成大多数任务。

以下知识点是作为一个前端工程师必须了解和熟悉的：

  • DOM结构——两个节点之间可能存在哪些关系以及如何在节点之间任意移动。
  • DOM操作——怎样添加、移除、移动、复制、创建和查找节点。
  • 事件——怎样使用事件以及IE和DOM事件模型之间存在哪些主要差别。
  • XMLHttpRequest——这是什么、怎样完整地执行一次GET请求、怎样检测错误。
  • 严格模式与混杂模式——如何触发这两种模式，区分它们有何意义。
  • 盒模型——外边距、内边距和边框之间的关系，IE < 8中的盒模型有什么不同。
  • 块级元素与行内元素——怎么用CSS控制它们、它们怎样影响周围的元素以及你觉得应该如何定义它们的样式。
  • 浮动元素——怎么使用它们、它们有什么问题以及怎么解决这些问题。
  • HTML与XHTML——二者有什么区别，你觉得应该使用哪一个并说出理由。
  • JSON——它是什么、为什么应该使用它、到底该怎么使用它，说出实现细节来。

上述这些知识点都应该是你“想都不用想”就知道的东西。除了上述的前端知识，也还需学会至少一门后端编程语言，让你自己学会如何与后端进行更好的交互。

很多前端工程师对一些库非常的熟悉，jQuery，Bootstrap等，但是对于库的熟悉并不能提现你的优秀，整整优秀的是那些理解库背后的机制，特别是能够徒手写出一个自己的库的人。

真正合格的前端工程师是能实现具体的功能要求，而优秀的前端工程师需要解决的问题是寻找一个最优的解决方案。

二、沟通很重要

优秀的前端工程师需要具备良好的沟通能力，因为你的工作与很多人的工作息息相关。在任何情况下，前端工程师至少都要满足下列四类客户的需求。

  1. 产品经理——这些是负责策划应用程序的一群人。他们能够想象出怎样通过应用程序来满足用户需求，以及怎样通过他们设计的模式赚到钱（但愿如此）。一般来说，这些人追求的是丰富的功能。
  2. UI设计师——这些人负责应用程序的视觉设计和交互模拟。他们关心的是用户对什么敏感、交互的一贯性以及整体的好用性。他们热衷于流畅靓丽但并不容易实现的用户界面。
  3. 项目经理——这些人负责实际地运行和维护应用程序。项目管理的主要关注点，无外乎正常运行时间——应用程序始终正常可用的时间、性能和截止日期。项目经理追求的目标往往是尽量保持事情的简单化，以及不在升级更新时引入新问题。
  4. 最终用户——当然是应用程序的主要消费者。尽管我们不会经常与最终用户打交道，但他们的反馈意见至关重要；没人想用的应用程序毫无价值。最终用户要求最多的就是对个人有用的功能，以及竞争性产品所具备的功能。

不要在没有作出评估之前就随便接受某项任务。你必须始终记住，一定先搞清楚别人到底想让你干什么，不能简单地接受“这个功能有问题”之类的大概其的说法。而且，你还要确切地知道这个功能或设计的真正意图何在。“加一个按钮”之类的任务并不总意味着你最后会加一个按钮。还可能意味着你会找产品经理，问一问这个按钮有什么用处，然后再找UI设计师一块探讨按钮是不是最佳的交互手段。要成为优秀的前端工程师，这种沟通至关重要。

那么，前端工程师应该最关注哪些人的意见呢？答案是所有这四类人。优秀的前端工程师必须知道如何平衡这四类人的需求和预期，然后在此基础上拿出最佳解决方案。由于前端工程师处于与这四类人沟通的交汇点上，因此其沟通能力的重要性不言而喻。如果一个非常酷的新功能因为会影响前端性能，必须删繁就简，你怎么跟产品经理解释？再比如，假设某个设计如果不改回原方案可能会给应用程序造成负面影响，你怎么才能说服UI设计师？作为前端工程师，你必须了解每一类人的想法从何而来，必须能拿出所有各方都能接受的解决方案。从某种意义上说，优秀的前端工程师就像是一位大使，需要时刻抱着外交官的心态来应对每一天的工作。

专业技术可能会引领你进入成为前端工程师的大门，但只有运用该技术创造的应用程序以及你跟他人并肩协同的能力，才会真正让你变得优秀。

三、提升无止境

优秀的前端工程师应该具备快速学习能力。推动Web发展的技术并不是静止不动的，这些技术几乎每天都在变化，如果没有快速学习能力，你就跟不上Web发展的步伐。你必须不断提升自己，不断学习新技术、新模式；仅仅依靠今天的知识无法适应未来。Web的明天与今天必将有天壤之别，而你的工作就是要搞清楚如何通过自己的Web应用程序来体现这种翻天覆地的变化。

四、前端开发知识架构

参考链接：

http://www.cn-cuckoo.com/2010/01/10/nicholas-c-zakas-talk-about-what-makes-a-good-front-end-engineer-1356.html

https://github.com/jacksontian/fks

http://julying.com/blog/how-to-become-a-good-web-front-end-engineer/

Related posts:

  1. 面向移动设备的HTML5开发框架梳理
  2. jquery.blockUI.js
  3. JSON 轻量级的数据交换格式

相关 [前端 工程师] 推荐：

前端工程师技能汇总

- - 博客园_新闻
还记得@jayli 的这幅前端知识结构图么. 缺失源图的我们，无法为此图贡献些什么，随着时间的迁移，或许有些技术点会发生改变，所以有了这个 github 项目. 我们可以通过协作的方式来共同维护这个项目. Git 的历史记录也可以见证前端行业的一些变迁. 尽管会变成文字的方式来维护这些内容，但是我承诺写一个小工具帮大家生成更好玩的图形（基于 DataV 项目）.

【xxx】前端技能汇总（Jackson Tian） 前端工程师们，珍重！

- - 王跸西的生命体验blog-WangBiXi.com
Frontend Knowledge Structure 项目起源. 还记得@jayli 的这幅前端知识结构图么. 缺失源图的我们，无法为此图贡献些什么，随着时间的迁移，或许有些技术点会发生改变，所以有了这个github项目. 我们可以通过协作的方式来共同维护这个项目. Git的历史记录也可以见证前端行业的一些变迁.

前端工程师的编码遭遇战

- Zacky - Taobao UED Team
导语：由于历史原因，淘宝网的页面编码一直都是gbk，F2E手册中也有明确规范，刚开始的一段时间，F2E们并未遭遇太麻烦的乱码问题，大家相安无事，但随着淘宝的合作方越来越多，合作方的API接口编码可谓五花八门，淘宝的系统和第三方的数据对接之后就暴露出各式各样的乱码问题. 我想，可能是在做第一个淘宝网的页面时，工程师只顾写代码，而忘了看一看编辑器的默认编码设置，再后来就将错就错直到今天，如果稍微留神，可能就不会犯下这么一个低级错误.

黄锦诚：前端工程师新手必读

- - 博客 - 伯乐在线
公司招了几个刚毕业的学生，作为 重构的新手让我来带. 首先感谢感谢党、感谢国家、感谢公司给了我这样的一个机会，对我工作的肯定和认可，让我带这样的一个重构团队，同时我也明白任务的艰巨，但我一定会将工作做好，不负公司对我的期望. （哈哈，好像从小到大，老师都是教育我们要这样先说的. 在网站的发展史上，初期的网站建设根本不需要网页重构这个职位，WEB1.0时代的网页，只需要 程序员，一堆堆的表格嵌套就完成，或者美工进行配合完成，先由美工负责设计好，再用一些自动化的软件拉伸几下，直接将设计好的图就可以通过软件输出表格的布局了，根本不需要重构这个多余的职位.

支付宝、腾讯前端开发工程师谈实战HTML5

- - 脚本爱好者
如今大热的 HTML5 到底美在哪里. HTML5到底能为实际的移动开发带来哪些改变. 来自支付宝和腾讯的前端开发工程师们有他们自己的看法. 　　上周，在一场名为“技术风云会”的定期讨论活动中，HTML5小组杭州联盟的同学、阿里巴巴集团 HTML5 爱好者，以及支付宝浙大校友会的会员集中讨论了 HTML5 对前端开发带来的直接改变.

前端工程师的编码遭遇战

- - 博客 - 伯乐在线
导语：由于历史原因，淘宝网的页面编码一直都是gbk，F2E手册中也有明确规范，刚开始的一段时间，F2E们并未遭遇太麻烦的乱码问题，大家相安无事，但随着淘宝的合作方越来越多，合作方的API接口编码可谓五花八门，淘宝的系统和第三方的数据对接之后就暴露出各式各样的乱码问题. 我想，可能是在做第一个淘宝网的页面时，工程师只顾写代码，而忘了看一看编辑器的默认编码设置，再后来就将错就错直到今天，如果稍微留神，可能就不会犯下这么一个低级错误.

前端工程师面试问题列表

- - 博客 - 伯乐在线
前言：@ darcyclarke 在 GitHub 上分享了一个 repo，其中包括了不少前端面试问题，可用于检验潜在的候选人. 绝不推荐在单个候选人身上用上所用的问题（那样会花费好几个小时滴）. 从这个列表选择一些，应该能从候选人身上，检测出你所需要的技能. 请记住，下面的很多问题都是开放式的，无标准答案，并能引发有趣的讨论.

前端工程师的价值体现在哪里？

- - 博客 - 伯乐在线
注：原问答贴来自 知乎，由 CSDN整理. 这是一个很老的话题“前端工程师的价值体现在哪里. 有人说：“前端工程师之于网站的价值犹如化妆师之于明星的价值. ”一位好的Web前端开发工程师在知识体系上既要有广度，又要有深度. 当然，Web前端工程师并不是设计师，每天接触最多的是代码，代码，还是代码.

如何成为一名优秀的前端工程师

- - 标点符
作为一名最基础的前端工程师你必须掌握HTML、CSS和JavaScript. 三者必须同时精通，类似我字样对前端知识一知半解的，一遇到问题就停下工作就四处搜索解决方案的，首先就算不上一个合格的前端人员. 像我这样的如果当了前端工程师那工期肯定是不能保证的. 合格的前端工程师第一要学会的就是在没有任何外来帮助的情况下（包括搜索引擎），能够完成大多数任务.