前端開發全面知識庫，包括HTML5，CSS3和js的基本框架知識，以及DOM和BOM操作的基礎知識和一些基本工具和IDE。學習本篇，你將了解到以下知識。

核心 Core

HTML5

W3C
W3C
菜鳥教程
HTML5中文門戶

CSS3

W3C CSS教程
W3C CSS3教程
菜鳥教程CSS教程
菜鳥教程CSS3教程
CSS參考手冊

JS

W3C
菜鳥教程
廖雪峰js教程
js標準參考教程-阮一峰

jQuery

W3C
菜鳥教程
極客學院
廖雪峰
參考手冊
參考手冊

ES6

阮一峰ES6
極客學院
JavaScript 標準參考　阮一峰

插件

: 前后端通用的一個并行庫
: 用于現代瀏覽器的兼容 jQuery 的庫
: 穩定的跨瀏覽器測試工具
: 一個用于模擬人輸入狀態的 JS 庫
: 前端用于實現異步滾動效果的庫，現已不再維護
: 另一款實現一步滾動的開源庫，使用人數眾多，可實現各種狂拽酷炫掉渣天的前端效果，看真相
: 前端框架，是開發人員可以基于 web 技術構建 IOS7 程序
: 用于生成 正則表達式 的可視化流程圖
: 新型 Markdown 解析器，快速，支持插件
: 用于 Javascript 中的多行文本，類似于 Ruby 的 HERE Doc
: 全屏插件，支持各大瀏覽器
: 類似于 Solr, 但是用于瀏覽器上的全文搜索引擎，可以為 JSON 創建索引，離線也可以使用
: jQuery 插件，用于綁定熱鍵
: Javascript 編寫的 Browser (瀏覽器)
: 用于生成 Github 信息卡片的庫
: 用于生成 Github 信息卡片的庫
: 輕量級貨幣轉換庫，web 和 node 皆可用
: 輕量級的數字、貨幣轉換庫
: Javascript 實現的各種算法集合
: 類似于 underscore, 但是會延遲執行，某些場景下，性能會有很大的提升
: 前端模塊加載器，解決模塊化、依賴等問題
: 單頁應用中一個用于處理導航欄的庫
: Javascript 實現的 javascript JIT
: jQuery 團隊開發的 UI 相關的前端庫，功能強大
: 分別基于 AngularJS/EmberJS/Backbone等實現的 TODO List, 幫助開發者選擇前端 MVC 庫
: Mozilla 出品，用于離線存儲，基于IndexedDB, WebSQL 或者 localStorage, 提供一致的接口
: 瀏覽器版的 EventEmitter
: jQuery 插件，用于將 form 表單序列化成 JSON 數據
: 前端 MVVM 框架，用于開發富前端應用
: 可以根據文本生成流程圖，類似于 Markdown 的語法
: 另一款可以根據文本生成流程圖的庫，類似于 Markdown 的語法
: 一個用來檢測 Javascript 語法錯誤的庫， Facebook 出品
: jQuery 插件，用來處理瀏覽器縮放
: 一個用于放大縮小圖片、Web 內容或者多媒體元素的庫，優雅大方
: 輕量型前端 MVC 框架，部分使用場景下性能優于 Angular.js 和 React
: 強大的前端 MVC 庫，鼻祖級前端庫，最初為了配合 Rails 來模塊化前端應用，兼容性良好 (兼容到 IE6)，插件豐富，性能良好
: smartbanner 是從 IOS6 開始支持的一個新特性, 這個插件提供了對早期 IOS4/5 和 Android 的支持
: 在頁面上以一個元素為起始以動畫的方式移動(ScrollTo)到另一個元素， 支持回退等
: 自定義的滾動條，讓所有瀏覽器都顯示一樣的滾動條
: 提供類似于 iPhone6 展示頁類似的效果，適用于單頁應用，兼容到 IE8
: 前端插件用來監控元素的滾動事件(進入、退出等)，性能很好
: 神奇的滾動交互效果插件，可以在滾動的過程中設置各種各樣的動態效果
: 滾動加載，滾動到最下到自動加載， Paul Irish 大神之作
: 僅僅依靠 border-width 和 background-position 實現的各種動態效果，看真相
: 頁面上內嵌圖片的放大縮小效果，類似于 Medium 中的效果
: jQuery 的一個插件，用于校驗 Form 表單
: jQuery 的一個插件, 用于實現大背景(視頻、圖片)效果
: 一款基于 LLVM, 可以將 C/C++ 轉換成 Javascript 的工具，使得 Javascript 可以近乎 Native 的速度
: 各種語言的二維碼生成工具
: 一個可以檢測設備類型的工具，可以讓我們根據不同的設備來為其定制響應的 Javascript 和 CSS
: jQuery 插件，用來生成二維碼
: jQuery 的一個插件，可以用來實現瀑布流的效果
: 可以用來過濾、排列布局，實現美觀的動態布局切換效果，Demo
: 功能強大的圖片延遲加載工具，可以首先加載一個低質量的圖片，然后再加載高質量的圖片
: 簡潔美觀的進度條，扁平化
: 一個由 Javascript 實現的Shell, 將互聯網當做一個大的文件系統, 通過 cd/ls/cat…..等命令, 可以訪問 Facebook/Twitter/Google Drive 等網絡服務
: Js實現的顏色選擇器 (Colorpicker)
: jQuery 倒計時插件
: WYSIWYG 富文本編輯器
: 非常輕型的一個自動補全 JS 庫, 沒有任何依賴, 配置簡單, 美觀
: IOS 7 上 Switch 的 JS 實現, 支持 IE8 及以上瀏覽器
: Basecamp 公司出品的富文本編輯器，簡潔小巧
: 在智能移動設備瀏覽器上，通過HTML5的api使用移動設備的功能。定位、運動、傾斜等
: 用于創建 基于 HTML5 的 演示文稿
: jQuery 插件，用于處理移動端的觸摸事件
: 前端用戶處理文件（拖放、多文件上傳等）
: 現代瀏覽器上用于實現元素拖拽排序的功能，支持 Meteor, AngularJS, React，不依賴 jQuery
: 用于實現瀏覽器上的滑動切換效果，支持硬件加速
: 2D 物理效果引擎，碰撞、彈跳等
: 用于輔助創建手機端的 Web 應用，支持主題、Zepto.js 等
: 一個利用 Javascript 和 CSS transform 的 animation 庫
: 基于 D3 的圖表庫
: 企業級圖表庫，百度開發
: 一個用于響應智能手機 orientation 的庫
: jQuery 動畫庫的一個增強，用于現代瀏覽器
: 富文本編輯器，適用于現代瀏覽器
: 一個通過滑動或者拖拽來操控列表的庫
: 一個矢量圖庫，提供 Ruby/Node 等支持
: JS 的一個圖片展示庫
: 是頁面上一個元素高亮的庫，有圖有真相
: Firefox 在瀏覽器端的實現 —— HTML 版的 Firefox
: jQuery 團隊開發的用于輔助手機端 web app 開發的庫，基于 HTML5
: 基于angularjs和bootstarp的web app開發框架
: 一個適用于現代瀏覽器的，用于處理 手勢、拖放、縮放等的庫
: 實現部分物理效果，Facebook 出品
: 基于 LocalStorage 的資源加載器，可以用來緩存 script 和 css, 手機端使用速度快于瀏覽器直接緩存
: 高性能的滾動(scroll)處理庫，功能強大，支持各種事件，不依賴任何的庫，且插件豐富, 大眾點評的手機端列表滾動就是用這個庫處理的
: 基于 D3 的圖表庫，簡潔、高效，Mozilla 出品
: Paypal 出品的 Video 播放器
: 幾種 Loading 效果，基于 SVG
: 一款能夠漂亮的網頁元素翻轉效果庫，代碼許久不更新，不過作為源碼學習還是不錯的
: 基于 CSS3 的前端動畫框架
: 使元素以非常酷帥的方式進入畫布 (Viewpoint)，看 Demo
: 一個用來檢測 HTML5 和 CSS3 支持情況的庫
: 另一款前端模版框架，類似于 Bootstrap
: Bootstrap 的一款主題，簡潔美觀
: 一款漂亮的 Checkbox 插件
: 非常輕量級的一個圖片滑動切換效果庫, 性能良好, 尤其是對手機的支持, 壓縮后的大小約 5kb
: 功能異常強大的一個圖片滑動切換效果庫
: 漂亮的社交按鈕
: 一個非常美觀的用于替換瀏覽器默認 alert 的庫
: Javascript 實現的 Web Animation API
: 可以動態描繪 SVG 的 JS 庫, 支持多種動畫
: 輕量, 小巧, 美觀的 HTML5 視頻播放器
: 基于 HTML5 & CSS3 時間表
: 一個非常美觀的側滑菜單

包管理工具 Package Managers

NPM

菜鳥教程NPM 使用介紹
淘寶 NPM 鏡像
npm 模塊安裝機制簡介
npm包搜索地址

Bower

Bower中文網
Bower：客戶端庫管理工具-阮一峰

Yarn

yarn中文網
YARN 簡介

編輯器 Text Editors

WebStorm

官網下載
前端網破解版下載

VScode

官網下載
vscode 插件精選 - 獻給所有前端工程師

SublimeText

官網下載
前端網破解版插件版下載
SublimeCodeIntel: Sublime Text 的代碼補全工具，支持多種語言
Emmet：一個用于提高開發效率的編輯器插件，前身是Zen coding
SublimeLinter: 一個提供代碼質量檢測的插件
SublimeTmpl：快速新建指定的模版文件
Syntax-highlighting-for-Sass：sass代碼高亮插件
MarkdownEditing: Sublime Text 強大的 Markdown 擴展, 提供快捷鍵, 主題等
ApplySyntax: 輔助檢測語法插件
CTags: Sublime Text Ctags 支持插件, 需要安裝 ctags
sublime-react: React 代碼高亮

Atom

官網下載

HBuilder

官網下載

JS框架 JS Frameworks

Backbone

Backbone.js API中文文檔

AngularJs

中文官方文檔
angularjs中文網
angularjs教程
Angular 基礎入門
angular-masonry: Masonry 的 AngularJS 插件，用于瀑布流
angular-schema-form: 根據 JSON 生成響應的 Form 表單
restangular: Angular 中用來處理 RESTful API 的插件，可替代 $resource
ng-cordova: Cordova 常用組件的 Angular 版本
angular-translate: Angular 的國際化 (I18n)
ng-inspector: Chrome 插件，用于調試 Angular
angularjs-style-guide: AngularJS 代碼風格
ngReact: React 的 Angular 插件，可以在 Angular 中使用 React Components
material: Google Material Design 效果的 Angular 實現
angular-local-storage: Angular 插件, 提供了對 localStorage 的友好支持, 并對不支持的瀏覽器使用 cookie 優雅降級
angular-filter: 一組有用的 Angular Filters
bindonce: Angular 插件, 用于減少 Watcher 的數量, 提升性能

React

英文官方文檔
中文官方文檔
gitbooks手冊
阮一峰react入門
阮一峰React Router入門
React Router 中文文檔
react-redux 中文文檔
阮一峰Redux 入門教程
: React 框架源代碼
: Facebook 出品的使用 React 開發 IOS 原生應用的框架
: 實時調整 React 組件效果
: React 的 Grunt 組件, 用于將 JSX 編譯成 JS
: 基于 React 的手機應用前端框架
: 基于 React, ES6, React-Router的一個應用腳手架
: React 路由解決方案

Vue

vue官方
vuex官方
vue-router官方

UI框架 UI Frameworks

Bootstrap

最受歡迎的 HTML、CSS 和 JS 框架

Ionic

一款接近原生的Html5移動App開發框架　會html css js就可以開發app//

Foundation

Foundation 中文網 迄今為止最好的響應式前端框架

FrozenUI

移動端服務的前端框架

materializecss

基于Material Design的主流前端響應式框架

mui

最接近原生APP體驗的高性能前端框架

AntDesign

和react配合的UI框架

eleme

和vue配合的UI框架

JS預處理 JS Preprocessors

TypeScript

TypeScript 入門教程 菜鳥教程
TypeScript中文網
TypeScript教程gitbook//

CoffeeScript

CoffeeScript 中文
CoffeeScript 實用手冊 極客學院

過程自動化 Process Automation

Grunt

Grunt中文網

Gulp

gulp.js 中文網
gulp詳細入門教程
前端構建工具gulpjs的使用介紹及技巧
Gulp開發教程

模板引擎 Templating

Handlebars

handlebarsjs官網
Handlebars中文文檔
Handlebars.js 中文文檔
Handlebars的使用方法文檔整理

Haml

haml官方文檔
haml入門

Jade

Jade 官方的英文文檔
Jade的使用
帶你學習Jade模板引擎視頻

構建工具 Build Tools

RequireJS

RequireJS 英文網
RequireJS 中文網
require.js的用法-阮一峰

seajs

seajs文檔
SeaJS從入門到原理

Browserify

官網
github//github.com/substack/node-browserify/

Webpack

Webpack 中文指南
webpack的實例
webpack的入門
一小時包教會 —— webpack 入門指南

CSS預處理器 CSS Preprocessors

Sass

sass入門
sass參考手冊
SASS用法指南-阮一峰

Less

less中文網
less快速入門

stylus

stylus中文文檔-張鑫旭