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

发现一篇不错的博文，和大家分享一下，为有志成为一名优秀前端工程师的童鞋们提供一个参考。 :)~

本文来源：http://www.biaodianfu.com/what-makes-a-good-front-end-engineer.html

一、技术的必须的

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

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

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

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

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

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

二、沟通很重要

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

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

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

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

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

三、提升无止境

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

四、前端开发知识架构

前端工程师
- 浏览器
  - IE6/7/8/9
  - Firefox
  - Chrome/Safari/Opera
- 编程语言
  - JavaScript/Node.js
  - JavaScript语言精粹
- 切页面
  - HTML/HTML5
  - CSS/CSS3
  - PhotoShop/Paint.net
- 开发工具
  - IDE
    - VIM/Sublime Text2
    - Notepad++/EditPlus
    - WebStorm
  - 调试工具
    - Firebug/Firecookie
    - YSlow
    - IEDeveloperToolbar/IETester
    - Fiddler
  - 版本管理
    - Git/SVN
    - Github/Bitbucket/Google Code
- 代码质量
  - Coding style
    - JSLint/JSHint
    - CSSLint
    - Markup Validation Service
  - 单元测试
    - QUnit/Jasmine
    - Mocha/Should/Chai
  - 自动化测试
    - WebDriver
- 前端库/框架
  - jQuery/Underscore/Mootools/Prototype.js
  - YUI3/Dojo/ExtJS
  - Backbone/KnockoutJS/Emberjs
- 前端标准/规范
  - HTTP1.1
  - ECMAScript3/5
  - W3C/DOM/BOM/XHTML/XML/JSON/JSONP
  - CommonJS/AMD
  - HTML5/CSS3
- 性能
  - JSPerf
  - YSlow 35 rules
  - PageSpeed
  - HTTPWatch
  - DynaTrace’s Ajax
  - 高性能JavaScript
- 编程知识储备
  - 数据结构
  - OOP/AOP
  - 原型链/作用域链
  - 闭包
  - 函数式编程
  - 设计模式
  - Javascript Tips
- 部署流程
  - 压缩合并
    - YUI Compressor
    - Google Clousure Complier
    - CleanCSS/UglifyJS
  - 文档输出
    - JSDoc
    - Dox/Doxmate
  - 项目构建工具
    - make/Ant
    - GYP
    - Grunt
    - Yeoman
- 代码组织
  - 类库模块化
    - CommonJS/AMD
    - YUI3模块
  - 业务逻辑模块化
  - 文件加载
    - LABjs
    - SeaJS/Require.js
- 安全
  - CSRF/XSS
  - ADsafe/Caja/Sandbox
- 移动Web
  - HTML5/CSS3
  - 响应式设计
  - Zeptojs/iScroll
  - V5/Sencha Touch
  - PhoneGap
  - jQuery Mobile
- JavaScript生态
  - MongoDB/CouchDB
- 前沿技术社区/会议
  - D2/WebRebuild
  - NodeParty/W3CTech/HTML5梦工厂
  - JSConf/沪JS(JSConf.cn)
  - QCon/Velocity/SDCC
  - JSConf/NodeConf
  - YDN/YUIConf
- 计算机知识储备
  - 编译原理
  - 计算机网络
  - 操作系统
  - 算法原理
  - 软件工程/软件测试原理
- 软技能
  - 知识管理/总结分享
  - 沟通技巧/团队协作
  - 需求管理/PM
  - 交互设计/可用性/可访问性知识
- 可视化
  - SVG/Canvas/VML
  - D3/Raphaël/DataV
后端工程师
- 编程语言
  - C/C++/Java/PHP/Ruby/Python/…
- 数据库
  - SQL
  - MySQL/MongoDB/Oracle
- 操作系统
  - Unix/Linux/OS X/Windows
- 数据结构

参考链接：

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/

如何成为一名优秀的前端工程师 (copy) - 段华建相关推荐

阿里P8前端工程师：如何成为一名优秀的前端工程师！
前后端分离的开发模式让前端开发者的地位日益提升,待遇水涨船高,这又吸引了一拨人慕名学习前端课程,希望能在前端领域大展宏图. 但一个残酷的现实是市场上不缺普通前端开发,缺的是掌握专业技能的优秀前端工程师 ...
如何成为优秀的前端工程师
如何成为一名优秀的前端工程师 (share) 发现一篇不错的博文,和大家分享一下,为有志成为一名优秀前端工程师的童鞋们提供一个参考. :)~ 本文来源:http://www.biaodianfu.co ...
自学前端开发：想要学习成为一名优秀的前端开发者，代码之外需要关注的问题
不要只知道蒙着头写代码,想要学习成为一名优秀的前端开发者,你还有许多代码之外值得关注的问题. 学好英语一定要学好英语,虽然英文不好也可以学会前端.但你一定会遇到比英语好的人更多的困难.因为你只能看中 ...
想成为一名合格的前端工程师，需要掌握哪些技能？
前端工程师已经成为目前互联网企业极具竞争力的人才,企业不断提升薪资水平为了招聘到优秀的Web前端开发工程师.因此,越来越多的人想要学习Web前端.那么呢?Web前端的学习路线是什么? 简单来说就是, ...
优秀web前端工程师必备_优秀的Web工程师的技能和素质
优秀web前端工程师必备 In this one-on-one episode of the Versioning Show, Tim and David talk about what makes ...
黑马程序员教你如何写出优秀的前端工程师简历
对于一名想找工作的前端开发工程师而言,简历直接关系到面试概率甚至薪资水平,其重要性已不用多说.在HR快速筛选简历的情况下,你的简历要脱颖而出,就得在短时间内将自己的亮点展示给招聘方.具体怎么做?黑马程 ...
如何成为一名合格的前端工程师
如何成为一名合格的前端工程师现如今,前端已经是一个异常响亮的行业名词,正汇聚各方好汉,华山论剑日益激烈.据2019最新的编程语言排行显示JavaScript已排名第七,由此可见,前端的未来不是梦. ...
飞桨 AI Studio 课程学习可以成为一名优秀的算法工程师
如何成为一名算法工程师从事 AI 行业需要学习哪些课程最为高效的学习路线是什么样很多对人工智能领域感兴趣的同学都会关注这些问题.不论是出于个人的专业兴趣或者是市场高薪资的吸引,算法工程师岗位已经 ...
如何做一名优秀的电子工程师[zz]
如何做一名优秀的电子工程师成为一个杰出工程师最重要的因素就是"热爱自己的职业".毕竟兴趣是最好的老师,许多优秀的电子工程师都是从小作为电子爱好者的.爱好不仅要体现在行动中更要深 ...

如何成为一名优秀的前端工程师 (copy) - 段华建

如何成为一名优秀的前端工程师 (copy) - 段华建相关推荐

最新文章

热门文章