前端工程師需要的素質

切頁面

• HTML
• CSS
• PS

程式語言

• JS
• PHP/Python/Perl/BsshShell
• NodeJS/FlashAS

除錯工具

• Firebug/Firbug-lite/Web inspector
• YSlow/Smushit
• IEDeveloperToolBar/IETester
• SuperPreview/JsBeautifier
• Fiddler/WireShark/Tcpdump

開發工具

• Webstrom/VIM/Aptana/Notpad++/EditPlus
• SygWin/svn/git

計算機知識儲備

• 編譯原理、計算機網路
• 作業系統、演算法原理
• 軟體工程、軟體測試原理

前端標準規範

• w3c/DOM/BOM/XHTML/XML/JSON/JSONP
• HTML5/CSS3
• ECMScript/ECMAScript6
• CommonJS/AMD
• HTTP1.1

效能

• WebPageTest
• ShowSlow/YSlow/34Rule
• PageSpeed
• HttpWacth
• DynaTrace`s Ajax

程式設計知識儲備

• 資料結構
• 面向物件/切面程式設計
• 函數語言程式設計
• JS設計模式
• js程式設計模式

瀏覽器相容性

• Chrome/Opeara/Safari
• Firefox3.6/4/5/6/7/8…

前端框架/庫

• jQuery/YUI2/YUI3
• Prototype/Mootoos/ExtJS
• Smarty/Djanggo/Zend
• YUITest/QUnit/Jasmine
• 前端測試、前端MVC

開發流程

• JSLint/CSSlint/YUICompressor
• JSMin/TPacker-minilier
• Ant/Make
• JSDoc/YUIDoc
• LAMP

軟技能

• 知識管理/總結分享
• 溝通技巧/團隊開發/需求管理/PM
• 程式碼模組化管理/程式碼版本管理
• 互動設計/可用性/可訪問性知識

安全

• CSFR/XSS
• ADsafe/Caja/FBJS/Sandbox

移動終端

• jQueryMobile/html5/css3
• iPhone/iPad/iPs/android
• responsive UI Design

前沿技術社群/會議

• YDN/YUIConf/JSConf
• QCon/Velocity
• D2/WebRebuild
• NodeParty/html5研究小組
• UED teams

Web服務

• YQL/Commpany Open Platform
• APP Engine/Cloud
• Google Open API/Github

前端必會技能與參考網站與書籍

前端必會

瀏覽器環境IE6~8 IE9+ Chrome Firefox Safari Opera Edge

• HTTP協議URI Cache Session Cookie Request Response
• HTMLW3C HTML4.01 HTML5 DOM 語義化
• CSSCSS1~3 選擇器 盒模型 Flex 媒體檢測 響應式 渲染引擎
• JavaScriptEcmaScript3~5~6 Lexical-scope prototype-chain AJAX js引擎
• 編輯器Emacs Vim WebStorm Atom Sublime-Text
• 釋出部署合併 壓縮 單元測試 Node.js Grunt Gulp Yeoman Phantom JSLint
• 框架類庫jQuery Zepto UnderScore Backbone Knockout React AngularJS
• 模組管理CommonJS Webpack
• UI框架BootStrap SemanticUI jQueryUI Foundation
• 推送技術WebSocket 輪詢 長連線
• 跨域技術iframe JSONP CORS
• 資料視覺化D3 Echarts HighCharts Canvas
• 非同步程式設計Promise $.Deferred Generator
• CSS前處理器LESS SASS Stylus
• 客戶端模板Handlebars Haml Jade Mustache
• 相關語言CoffeeScript TypeScript Dart
• WebAssemblyWebApp/PCReact-native ionic以上提到的這些，幾乎成了前端程式設計師的標配了，

前端網站與書籍

JavaScript權威指南
JavaScript高階程式設計>
JavaScript語言精粹
JavaScript模式
JavaScript DOM高階程式設計
高效能JavaScript程式設計
JavaScript非同步程式設計
JavaScript忍者的祕密

基於MVC的JavaScript Web富應用開發
jQuery權威指南
犀利開發jQuery核心詳解與實踐
jQuery Mobile權威指南
用AngularJS開發下一代Web應用
Node.js開發指南
高效能網站建設指南
響應式Web設計

快速軟體開發
測試驅動開發
面向模式的軟體架構