Web前端开发技术栈（前端干货）

Web前端开发技术栈

浏览器

Internet Explorer（需要了解，需不需要看公司业务需求）

Chrome（建议学习使用）

Firefox（建议学习使用）

Safari（建议学习使用）

Opera

Edge

Netscape

协议（前端学到一定阶段后学习比较好）

HTTP/1.1

链接

会话

授权

请求

响应

HTTP/2

压缩

打包

服务器端推送

WebSocket

Web三剑客（必须学会，而且要精通，JavaScript一定要精通，推荐红宝书）

HTML (HyperText Markup Language)

CSS (Cascading Style Sheets)

JavaScript

标准

W3C（推荐到W3Cschool看文档）

HTML

CSS

XHTML

XML

核心概念

HTML

DOM

Element

Attribute

JavaScript

Prototype

Scope

Closure

JSON (JavaSript Object Notation)

AJAX (Asynchronous JavaScript and XML)

CSS

Selector

Priority

Specificity

Box Model

渲染引擎

Trident (IE)

Blink / prev. WebKit (Chrome)

Gecko (Firefox)

WebKit (Safari)

Blink / prev. Presto (Opera)

EdgeHTML (Edge)

脚本引擎

JScript (IE8- / ASP)

Chakra (IE9+ / Edge)

V8 (Chrome / Opera / Nodejs / MongoDB)[GitHub]

SpiderMonkey (Firefox)

JavaScriptCore (Safari)

运行时

Cookie

Local Cache

Session Storage

Local Storage

Components

Extensions

Plugins

Resources

Images

Icons

Fonts

Audios

Videos

编辑器

Sublime Text

WebStorm

Atom

Vim

Emacs

Visual Studio（电脑要好）

Visual Studio Code（推荐使用，简单易用）

Dreamweaver ;（电脑要有一定的性能）

编译任务

精简

编译

合并

混淆

图像优化

单元测试

编译工具

Grunt

Gulp

Brunch

Yeoman

Broccoli

调试

Developer Tools

Firebug

基础工具

Node.js（前端一定要会，一定要会，如果学php什么的可以只要了解一下node就可以，但要会基础使用）

Phantom.js

SpiderMonkey

质量控制

JSLint

JSHint

jscs

Closure Linter

包管理

npm（要先学node.js，node.js是现在很多前端工程师都必须掌握的一项技能）

Bower[GitHub]

测试

工具

QUnit

Jasmine

Mocha

Selenium

WebDriverIO

Protractor

Sinon.JS

Karma

nodeunit

tape

nightmare

在线工具

Sauce Labs

Browser Stack

Browser Shots

Browserling

Browser Sandbox

Cross Browser Testing

Browsera

SortSite

库 / 框架

基础库

jQuery （主要是为了让操作DOM更加简单，需要了解，毕竟JavaScript暂时不会过时，操作DOM的简化有一定的价值，但是最好不要和vue一起用）

Prototype

Zepto

MooTool

模块化

ES6 Module

CommonJS

webpack

browserify

AMD

RequireJS

UMD

umd

框架

AngularJS

Ember

React

Deft.js

Vue.js（推荐学习，有中文文档）

Riot

UI框架（可以都了解一下，百度一下，看看官网，喜欢那个玩哪个）

Bootstrap（推荐学习，简单上手）

Semantic UI

Foundation

Material UI

WinJS

Pure

Amaze UI

WebSocket

Socket.io

web-socket-js

数据可视化

Echarts（推荐学习，简单易用，前提是要会JavaScript）

HighCharts

WebGL

Three.js

Babylon.js

Pixi.js

CSS3 动画

Animate.css（有官网，推荐看看）

bounce.js

Effeckt.css

move.js

流程控制

ES6

Promise

Generator

ES7

yield

await

async

co

Promise

Bluebird

q

when.js

函数式编程

bacon.js

immutable.js

ramda

underscore.js

lodash

ReactiveX

手机 UI 框架

jQuery Mobile

Jo

Dojo Mobile

Lungo

CSS 预处理器

LESS

LESS

Hat

Sass(SCSS)

Compass

Bourbon

Gumby

Stylus

nib

未来标准

babel

模板引擎

Handlebars

Slim

Jade

Ejs

Spacebars

mustache

统一化

Normalize

Reset

最佳实践

SEO

Responsiveness

CDN

安全

Sandbox

XSS

CORS

中间语言

CoffeeScript

TypeScript

ClojureScript

JSX (Facebook)

移动应用开发

PhoneGap / Cordova

MUI

React Native

Ionic

桌面应用开发

Electron

NW.js