首先,看一张前端知识结构图:  (原文: ithomer)

fks-frag

图片的形式具有诸多的不便。缺失源图的我们,无法为此图贡献些什么,随着时间的迁移,或许有些技术点会发生改变,所以有了这个GitHub项目。我们可以通过协作的方式来共同维护这个项目。Git的历史记录也可以见证前端行业的一些变迁。

尽管会变成文字的方式来维护这些内容,但是我承诺写一个小工具帮大家生成更好玩的图形(基于DataV项目)。

前端开发知识结构

  • 前端工程师
    • 浏览器
      • IE6/7/8/9/10/11 (Trident)
      • Firefox (Gecko)
      • Chrome/Chromium (Blink)
      • Safari (WebKit)
      • Opera (Blink)
    • 编程语言
      • Javascript/Node.js
      • CoffeeScript
      • TypeScript
    • 切页面
      • HTML/HTML5
      • CSS/CSS3
      • PhotoShop/Paint.net/Fireworks/GIMP
    • 开发工具
      • 编辑器和IDE
        • VIM/Sublime Text2
        • Notepad++/EditPlus
        • WebStorm
        • Emacs EmacsWiki
        • Brackets
        • Komodo IDE / Edit
        • Eclipse
        • Visual Studio
        • NetBeans
        • Cloud9 IDE
      • 调试工具
        • Firebug/FireCOOKIE
        • YSlow
        • IEDeveloperToolbar/IETester
        • Fiddler
        • Chrome Dev Tools
        • Dragonfly
        • DebugBar
        • Venkman
      • 版本管理
        • Git/SVN/Mercurial
        • Github/Bitbucket/Google Code/Gitorious/GNU Savannah/Launchpad/SourceForge
    • 代码质量
      • Coding style
        • JSLint/JSHint/jscs
        • CSSLint
        • Markup Validation Service
      • 单元测试
        • QUnit/Jasmine
        • Mocha/Should/Chai/Expect
        • Unit JS
      • 自动化测试
        • WebDriver/Karma Runner/Sahi
        • phantomjs
    • 前端库/框架
      • jQuery/Underscore/Mootools/Prototype.js
      • YUI3/Dojo/ExtJS/KISSY
      • Backbone/KnockoutJS/Emberjs
      • AngularJS
        • Batarang
      • Bootstrap
      • Semantic UI
      • Juice UI
      • Web Atoms
    • 前端标准/规范
      • HTTP1.1
      • ECMAScript3/5
      • W3C/DOM/BOM/XHTML/XML/JSON/JSONP
      • CommonJS Modules/AMD
      • HTML5/CSS3
    • 性能
      • JSPerf
      • YSlow 35 rules
      • PageSpeed
      • HTTPWatch
      • DynaTrace’s Ajax
      • 高性能Javascript
    • 编程知识储备
      • 数据结构
      • OOP/AOP
      • 原型链/作用域链
      • 闭包
      • 编程范型
      • 设计模式
      • Javascript Tips
    • 部署流程
      • 压缩合并
        • YUI Compressor
        • Google Clousure Complier
        • UglifyJS
        • CleanCSS
      • 文档输出
        • JSDoc
        • Dox/Doxmate/Grunt-Doxmate
      • 项目构建工具
        • make/Ant
        • GYP
        • Grunt
        • Yeoman
        • FIS
        • Mod
    • 代码组织
      • 类库模块化
        • CommonJS/AMD
        • YUI3模块
      • 业务逻辑模块化
        • bower/component
      • 文件加载
        • LABjs
        • SeaJS/Require.js
      • 模块化预处理器
        • Browserify
    • 安全
      • CSRF/XSS
      • ADsafe/Caja/Sandbox
    • 移动Web
      • HTML5/CSS3
      • 响应式网页设计
      • Zeptojs/iScroll
      • V5/Sencha Touch
      • PhoneGap
      • jQuery Mobile
    • 前沿技术社区/会议
      • D2/WebRebuild
      • NodeParty/W3CTech/HTML5梦工厂
      • JSConf/沪JS(JSConf.cn)
      • QCon/Velocity/SDCC
      • JSConf/NodeConf
      • CSSConf
      • YDN/YUIConf
      • HybridApp
      • WHATWG
    • 计算机知识储备
      • 编译原理
      • 计算机网络
      • 操作系统
      • 算法原理
      • 软件工程/软件测试原理
    • 软技能
      • 知识管理/总结分享
      • 沟通技巧/团队协作
      • 需求管理/PM
      • 交互设计/可用性/可访问性知识
    • 可视化
      • SVG/Canvas/VML
      • SVG: D3/Rapha?l/Snap.svg/DataV
      • Canvas: CreateJS/KineticJS

 

  • 后端工程师
    • 编程语言
      • C/C++/Java/PHP/Ruby/Python/…
    • 网页服务器
      • Nginx
      • Apache
      • Lighttpd
    • 数据库
      • SQL
      • MySQL/PostgreSQL/Oracle
      • MongoDB/CouchDB
    • 数据缓存
      • Redis
      • Memcached
    • 文件缓存/代理
      • Varnish
      • Squid
    • 操作系统
      • Unix/Linux/OS X/Windows
    • 数据结构

前端书籍推荐

★越少越简单,越适合入门,★多的要么是难度比较高,要么是比较适合在后面看,比如讲性能之类的书.

CSS

  • Eric Meyer 谈 CSS(卷二)★★★
  • CSS权威指南 (第3版)★★
  • 精通CSS★★★

Javascript

  • Javascript DOM编程艺术 (第2版)★
  • Javascript高级程序设计(第3版)★★
  • 锋利的jQuery★★
  • 高性能Javascript★★★
  • Javascript语言精粹★★★
  • Javascript权威指南★★★
  • 编写可维护的Javascript★★★
  • Javascript语言精髓与编程实践★★★
  • Effective Javascript★★★
  • Secrets of the Javascript Ninja★★★
  • Javascript模式★★★
  • Javascript设计模式★★★★
  • 基于MVC的Javascript Web富应用开发★★★

版本控制工具

  • 版本控制之道 (git)★★
  • Git权威指南★★★★

后端书籍推荐

Linux管理

  • Linux 系统管理技术手册
  • 鸟哥的 Linux 私房菜
  • Linux 101 Hacks
  • UNIX Shell Scripting
  • The Linux Command Line
  • Linux Network Administrator’s Guide

Linux编程

  • Linux程序设计
  • Linux系统编程
  • Unix环境高级编程
  • Unix编程艺术
  • The Linux Programming Interface
  • 程序员的自我修养
  • 深入理解Linux内核
  • Unix网络编程
  • TCP/IP高级编程

C/C++

  • Linux C编程一站式学习
  • C和指针
  • C陷阱与缺陷
  • C专家编程
  • C语言核心技术
  • 彻底搞定C指针
  • 征服C指针
  • C++编程思想
  • 高质量程序设计指南—C/C++语言
  • Inside the C++ Object Model
  • A Tour of C++
  • The C++ Programming Language
  • The C++ Standard Library – A Tutorial and Reference
  • The C++ Standard (INCITS/ISO/IEC 14882-2011)
  • Overview of the New C++

前端工作面试

  • 前端工作面试问题

 

本文转自: http://blog.ithomer.net/2014/05/front-end-engineer-prerequisite-skills-summary/