# 前端工程师技能图谱

## 浏览器
- 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
- Sass/LESS/Stylus
- PhotoShop/Paint.net/Fireworks/GIMP/Sketch

## 开发工具

### 编辑器和IDE
- VIM/Sublime Text2
- Notepad++/EditPlus
- WebStorm
- Emacs EmacsWiki
- Brackets
- Atom
- Lime Text
- Light Table
- Codebox
- TextMate
- Neovim
- Komodo IDE / Edit
- Eclipse
- Visual Studio/Visual Studio Code
- NetBeans
- Cloud9 IDE
- HBuilder
- Nuclide

### 调试工具
- Firebug/Firecookie
- YSlow
- IEDeveloperToolbar/IETester
- Fiddler/Charles
- Chrome Dev Tools
- Dragonfly
- DebugBar
- Venkman

### 版本管理
- Git/SVN/Mercurial
- Github/GitLab/Bitbucket/Gitorious/GNU Savannah/Launchpad/SourceForge/TeamForge

## 代码质量

### Coding style
- Eslint/JSLint/JSHint/jscs
- CSSLint
- Markup Validation Service
- HTML Validators

### 单元测试
- QUnit/Jasmine
- Mocha/Should/Chai/Expect
- Unit JS

### 自动化测试
- WebDriver/Protractor/Karma Runner/Sahi
- phantomjs
- SourceLabs/BrowserStack

## 前端库/框架
- jQuery/Underscore/Mootools/Prototype.js
- YUI3/Dojo/ExtJS/KISSY
- Backbone/KnockoutJS/Emberjs
- AngularJS
- Batarang
- Bootstrap
- Semantic UI
- Juice UI
- Web Atoms
- Polymer
- Dhtmlx
- qooxdoo
- React
- Brick
- Vue.js

## 前端标准/规范
- HTTP/1.1: RFCs 7230-7235
- HTTP/2
- ECMAScript 5/6/7
- W3C: DOM/BOM/XHTML/XML/JSON/JSONP/...
- CommonJS Modules/AMD
- HTML5/CSS3
- Semantic Web
- MicroData
- RDFa
- Web Accessibility
- WCAG
- Role Attribute
- WAI-ARIA

## 性能
- JSPerf
- YSlow 35 rules
- PageSpeed
- HTTPWatch
- DynaTrace's Ajax
- 高性能JavaScript

## SEO

## 编程知识储备
- 数据结构
- OOP/AOP
- 原型链/作用域链
- 闭包
- 编程范型
- 设计模式
- Javascript Tips

## 部署流程

### 压缩合并
- YUI Compressor
- Google Clousure Complier
- UglifyJS
- CleanCSS

### 文档输出
- JSDoc
- Dox/Doxmate/Grunt-Doxmate

### 项目构建工具
- make/Ant
- GYP
- Grunt
- Gulp
- Yeoman
- FIS
- Mod
- Webpack

## 代码组织

### 类库模块化
- CommonJS/AMD/ES6 Module
- YUI3模块

### 业务逻辑模块化
- bower/component

### 文件加载
- LABjs
- SeaJS/Require.js/Webpack

### 模块化预处理器
- Browserify

## 安全
- CSRF/XSS
- CSP
- Same-origin policy
- ADsafe/Caja/Sandbox

## 移动Web
- HTML5/CSS3
- 响应式网页设计
- Zeptojs/iScroll
- V5/Sencha Touch
- PhoneGap (Cordova)
- Ionic
- jQuery Mobile
- W3C Mobile Web Initiative
- W3C mobileOK Checker
- Open Mobile Alliance
- React Native/Weex

## 前沿技术社区/会议
- D2/WebRebuild
- NodeParty/W3CTech/HTML5梦工厂
- JSConf/沪JS(JSConf.cn)
- QCon/Velocity/SDCC
- JSConf/NodeConf
- CSSConf
- YDN/YUIConf
- HybridApp
- WHATWG
- MDN
- codepen
- w3cplus
- CNode

## 计算机知识储备
- 编译原理
- 计算机网络
- 操作系统
- 算法原理
- 软件工程/软件测试原理
- Unicode

## 软技能
- 知识管理/总结分享
- 沟通技巧/团队协作
- 需求管理/PM
- 交互设计/可用性/可访问性知识

## 可视化
- SVG/Canvas/VML
- SVG: D3/Raphaël/Snap.svg/DataV
- Canvas: CreateJS/KineticJS
- WebGL/Three.JS

前端工程师技能图谱skill-map的更多相关文章

  1. Java软件工程师技能图谱

    原文链接:Java软件工程师技能图谱 最近在考虑"拥有怎样的技能才能算一名合格的java软件工程师呢?"这个问题.碰巧在github发现一个很棒的开源项目--程序员技能图谱.@Zh ...

  2. 从程序员到CTO的Java技术路线图 JAVA职业规划 JAVA职业发展路线图 系统后台框架图、前端工程师技能图 B2C电子商务基础系统架构解析

    http://zz563143188.iteye.com/blog/1877266在技术方面无论我们怎么学习,总感觉需要提升自已不知道自己处于什么水平了.但如果有清晰的指示图供参考还是非常不错的,这样 ...

  3. PHP 工程师技能图谱

    # PHP 工程师技能图谱## 基础知识 - HTTP - HEADER - REQUEST - RESPONSE - GET/POST/PUT/DELETE/PATCH/CONNECT/OPTION ...

  4. Python 工程师技能图谱skill-map

    # **Python 工程师技能图谱** ## **入门**- 笨办法学Py- 官方教程- Hitchhiker- coursera * codeskulptor.org ## **进阶/脚本** # ...

  5. 前端工程师技能之photoshop巧用系列第三篇——切图篇

    × 目录 [1]切图信息 [2]切图步骤 [3]实战 前面的话 前端工程师除了使用photoshop进行测量之外,更重要的是要使用该软件进行切图.本文是photoshop巧用系列的第三篇——切图篇 切 ...

  6. 前端工程师技能之photoshop巧用系列第二篇——测量篇

    × 目录 [1]测量信息 [2]实战 [3]注意事项 前面的话 前端工程师使用photoshop进行的大量工作实际上是测量.本文是photoshop巧用系列第二篇——测量篇 测量信息 在网页制作中需要 ...

  7. 前端工程师技能之photoshop巧用系列第一篇——准备篇

    × 目录 [1]作用 [2]初始化 [3]常用工具[4]快捷键 前面的话 photoshop是前端工程师无法回避的一个软件,这个软件本身很强大,但我们仅仅需要通过这个工具来完成基本的切图工作即可.本文 ...

  8. web前端工程师技能总结

    编辑器: 1 webstorm(建议版本10.0), 2 sublimeTEXT(建议版本3), 3 dreamweaver (建议版本CS6, CC2015)  浏览器: 1 firefox  建议 ...

  9. 前端工程师技能之photoshop巧用系列第四篇——图片格式

    × 目录 [1]图片格式 [2]保存设置 前面的话 对于前端来说,图片格式是需要重要掌握的知识.本文是photoshop巧用系列第四篇——图片格式 图片格式 目前在前端的开发中常用的图片格式有jpg. ...

随机推荐

  1. [CSP-S模拟测试]:v(hash表+期望DP)

    题目背景 $\frac{1}{4}$遇到了一道水题,又完全不会做,于是去请教小$D$.小$D$看了$0.607$眼就切掉了这题,嘲讽了$\frac{1}{4}$一番就离开了.于是,$\frac{1}{ ...

  2. UPLOADIFY用法

    把下面代码 this.settings.upload_url = SWFUpload.completeURL(this.settings.upload_url);  this.settings.but ...

  3. DomainObjectUtility

    using System; using System.Collections; using System.Collections.Generic; using System.Collections.S ...

  4. LeetCode 求众数 II

    题目链接:https://leetcode-cn.com/problems/majority-element-ii/ 题目大意: 略. 分析: k个一起删, 最后check一下即可. 代码如下: #d ...

  5. idea配置svn正确步骤(下载svn的过程就不写了)

    打开----->File------>Settings 2. 3在vcs中选择 4进入此界面 5选择 这样svn就配置好了

  6. 洛谷 P1119 灾后重建——dijstra

    先上一波题目 https://www.luogu.org/problem/P1119 这道题我们可以将询问按时间排序 然后随着询问将相应已经重建成功的点进行操作 每次更新一个点就以他为起点跑一遍dij ...

  7. poj3216 Prime Path(BFS)

    题目传送门  Prime Path The ministers of the cabinet were quite upset by the message from the Chief of Sec ...

  8. 关于dom获取元素的几种方式

    原文链接:https://blog.csdn.net/levinhax/article/details/71274456 获取元素DOM对象有很多种方法,以前一直在用getElementById和ge ...

  9. java 线程安全并发Queue

    并发Queue 在并发的队列上jdk提供了两套实现,一个是以ConcurrentLinkedQueue为代表的高性能队列,一个是以BlockingQueue接口为代表的阻塞队列,无论在那种都继承自Qu ...

  10. day01 python初识、数据类型、流程控制

    今日内容大纲:1,计算机基础. cpu,内存,硬盘,操作系统.2,python的发展与应用.3,python的历史. 2008年python同时更新了两个版本 1,python2x python3x ...