摘要：資源不斷更新中。。。主頁(yè)前端工具簡(jiǎn)介雖然不是第一個(gè)任務(wù)執(zhí)行工具，它卻很快成為了最受歡迎的。官方網(wǎng)站網(wǎng)易框架是網(wǎng)易推出的開(kāi)源前端框架，提供了豐富代碼庫(kù)和插件，可以極大的幫助開(kāi)發(fā)人員提高開(kāi)發(fā)效率。

資源不斷更新中。。。

動(dòng)畫(huà)庫(kù)
1.Animate.css
說(shuō)明：一個(gè)簡(jiǎn)單易用的跨瀏覽器CSS動(dòng)畫(huà)庫(kù)。
GitHub主頁(yè)： https://github.com/daneden/an...

2.CSShake
說(shuō)明：用CSS實(shí)現(xiàn)各種顛顫動(dòng)畫(huà)效果DOM！
GitHub主頁(yè)： https://github.com/elrumordel...

3.Hover.css
說(shuō)明：將鼠標(biāo)Hover效果快速應(yīng)用在你的網(wǎng)頁(yè)元素或創(chuàng)意設(shè)計(jì)上。
GitHub主頁(yè)：https://github.com/IanLunn/Hover

4.Velocity.js
說(shuō)明：幫你加速JavaScript動(dòng)畫(huà)。
GitHub主頁(yè)：https://github.com/julianshap...

5.DynCSS
說(shuō)明：用動(dòng)態(tài)CSS來(lái)打造你的網(wǎng)頁(yè)。
GitHub主頁(yè)：https://github.com/vzaccaria/...

6.Magic Animations
說(shuō)明：可創(chuàng)造CSS3動(dòng)畫(huà)特效。
GitHub主頁(yè)：https://github.com/miniMAC/magic

7.Bounce.js
說(shuō)明：即時(shí)創(chuàng)造漂亮的CSS3動(dòng)畫(huà)。
GitHub主頁(yè)： https://github.com/tictail/bo...

前端框架和類庫(kù)
1.lodash.js
簡(jiǎn)介：具有一致接口、模塊化、高性能等特性的 JavaScript 工具庫(kù)
GitHub主頁(yè)：https://github.com/lodash/lod...

2.Underscore.js
簡(jiǎn)介：JavaScript 工具庫(kù)，它提供了一整套函數(shù)式編程的實(shí)用功能，但是沒(méi)有擴(kuò)展任何 JavaScript 內(nèi)置對(duì)象。 他解決了這個(gè)問(wèn)題：“如果我面對(duì)一個(gè)空白的 HTML 頁(yè)面，并希望立即開(kāi)始工作，我需要什么？” 他彌補(bǔ)了 jQuery 沒(méi)有實(shí)現(xiàn)的功能，同時(shí)又是 Backbone 必不可少的部分。

3.AngularJS
簡(jiǎn)介：AngularJS是為了克服HTML在構(gòu)建應(yīng)用上的不足而設(shè)計(jì)的。HTML是一門(mén)很好的為靜態(tài)文本展示設(shè)計(jì)的聲明式語(yǔ)言，但要構(gòu)建WEB應(yīng)用的話它就顯得乏力了。
GitHub主頁(yè)：https://github.com/angular/an...

4.React
簡(jiǎn)介：React 是一個(gè)用于構(gòu)建用戶界面的 JAVASCRIPT 庫(kù)。主要用于構(gòu)建UI，很多人認(rèn)為 React 是 MVC 中的 V（視圖）。
GitHub主頁(yè)：https://github.com/facebook/r...

5.Vue.js
簡(jiǎn)介：Vue.js是一個(gè)用于構(gòu)建用戶界面的輕量級(jí)漸進(jìn)框架。它提供了一個(gè)類似React的虛擬DOM驅(qū)動(dòng)視圖層，可以與其它類庫(kù)集成，用于構(gòu)建強(qiáng)大的單頁(yè)面應(yīng)用。該框架是由之前在AngularJS工作過(guò)的Evan You創(chuàng)建的，他提取了AngularJS中自己喜歡的部分。

Vue.js使用HTML模板語(yǔ)法將DOM綁定到實(shí)例數(shù)據(jù)。Model是在數(shù)據(jù)改變時(shí)更新view的純JavaScript對(duì)象。
GitHub主頁(yè)：https://github.com/vuejs/vue
官方地址：https://cn.vuejs.org/

6.Backbone.js
簡(jiǎn)介：Backbone.js是提供服務(wù)器端框架中常見(jiàn)的MVC結(jié)構(gòu)的最早客戶端選項(xiàng)之一。它唯一的依賴是Underscore.js。
Backbone.js聲稱是一個(gè)類庫(kù)，因?yàn)樗梢耘c其它項(xiàng)目集成，但是我覺(jué)得大多數(shù)開(kāi)發(fā)人員都認(rèn)為它是一個(gè)框架。
GitHub主頁(yè)：https://github.com/jashkenas/...

7.Ember.js
簡(jiǎn)介：Ember.js是基于Model-View-ViewModel（MVVM）模式的框架之一。它在單個(gè)包中實(shí)現(xiàn)模板化、數(shù)據(jù)綁定和類庫(kù)。
GitHub主頁(yè)：https://github.com/emberjs/em...

前端工具
1.Gulp.js
簡(jiǎn)介：雖然Gulp不是第一個(gè)任務(wù)執(zhí)行工具，它卻很快成為了最受歡迎的。Gulp使用易于閱讀的JavaScript代碼，將源文件加載到流中，并在將數(shù)據(jù)輸出到構(gòu)建文件夾之前，通過(guò)各種插件管理數(shù)據(jù)。在任何其它選項(xiàng)之前檢查Gulp.js是簡(jiǎn)單、快速和有趣的。
GitHub主頁(yè)：https://github.com/gulpjs/gulp

2.NPM
簡(jiǎn)介：npm是Node.js包管理器，但其腳本工具可用于運(yùn)行通用任務(wù)。對(duì)于具有少量依賴關(guān)系的簡(jiǎn)單項(xiàng)目來(lái)說(shuō)，這是一個(gè)很好的選擇。然而，更復(fù)雜的任務(wù)可能會(huì)變得不太適用。
GitHub主頁(yè)：https://github.com/npm/npm

3.Grunt
簡(jiǎn)介：Grunt是第一批被大規(guī)模采用的JavaScript任務(wù)執(zhí)行工具之一，但其速度和復(fù)雜的JSON配置卻導(dǎo)致了Gulp的興起?，F(xiàn)在這些問(wèn)題已經(jīng)得到了解決，Grunt仍然是一個(gè)受歡迎的選擇。
GitHub主頁(yè)：https://github.com/gruntjs/grunt

4.WebPack
簡(jiǎn)介：Webpack支持所有流行的模塊選項(xiàng)，并已成為React開(kāi)發(fā)的代名詞。雖然Webpack聲稱是一個(gè)模塊捆綁程序，但是已經(jīng)可以用作通用任務(wù)運(yùn)行程序了。
GitHub主頁(yè)：https://github.com/webpack/we...

5.Browserify
簡(jiǎn)介：Browserify支持Node.js正在使用的CommonJS模塊，它將所有模塊編譯成單個(gè)瀏覽器兼容的文件。
GitHub主頁(yè)：https://github.com/substack/n...

6.RequireJS
簡(jiǎn)介：RequireJS是一種瀏覽器中的模塊加載器，它也可以在Node.js中使用。
GitHub主頁(yè)：https://github.com/jrburke/r.js

7.ESLint
簡(jiǎn)介：ESLint是一種可插拔的代碼分析工具。每個(gè)規(guī)則都是一個(gè)插件，因此可以根據(jù)個(gè)人喜好進(jìn)行配置。
GitHub主頁(yè)：https://github.com/eslint/eslint

8.JSHint
簡(jiǎn)介：JSHint是一個(gè)靈活的JavaScript代碼分析工具，它很好的平衡了真正的錯(cuò)誤和老舊的語(yǔ)法。
GitHub主頁(yè)：https://github.com/jshint/jshint

9.JSLint
簡(jiǎn)介：JSLint是最早的代碼分析工具之一，它實(shí)現(xiàn)了一套嚴(yán)格的默認(rèn)規(guī)則。
GitHub主頁(yè)：https://github.com/reid/node-...

10.Jasmine
簡(jiǎn)介：Jasmine是一個(gè)行為驅(qū)動(dòng)的測(cè)試工具，可以在瀏覽器中自動(dòng)測(cè)試UI和交互。
GitHub主頁(yè)：https://github.com/jasmine/ja...

11.QUnit
簡(jiǎn)介：QUnit是一個(gè)單元測(cè)試框架，可以在輸入特定參數(shù)時(shí)，檢查函數(shù)結(jié)果。它還上報(bào)測(cè)試結(jié)果，確保沒(méi)有錯(cuò)過(guò)特定的代碼分支。
GitHub主頁(yè)：https://github.com/kof/node-q...

CSS框架
1.Bootstrap – 最流行的Web前端UI框架
Bootstrap是由twitter推出的Web前端UI框架，它由Twitter的設(shè)計(jì)師Mark Otto和Jacob Thornton合作開(kāi)發(fā),是一個(gè)CSS/HTML框架。它使用了最新的瀏覽器技術(shù)，Bootstrap提供了時(shí)尚的排版樣式，表單，buttons，表格，網(wǎng)格系統(tǒng)等等。
官方網(wǎng)站：http://getbootstrap.com/

2.jQuery UI Bootstrap
它是jQuery UI和Bootstrap的集成，它是Bootstrap樣式的，因此外觀比較漂亮，同時(shí)它擁有jQuery UI的控件功能，這也方便開(kāi)發(fā)者快速地創(chuàng)建一個(gè)網(wǎng)頁(yè)控件。

3.BootMetro - Metro風(fēng)格的CSS框架
BootMetro是一款基于Bootstrap的前端UI框架，BootMetro的特點(diǎn)是可以很方便地構(gòu)建類似Windonws 8扁平化風(fēng)格的網(wǎng)頁(yè)界面，效果非常不錯(cuò)。
官方網(wǎng)站：http://aozora.github.io/bootm...

4.Flat UI - 扁平風(fēng)格 UI 工具包
Flat UI是一套精美的扁平風(fēng)格 UI 工具包，基于 Twitter Bootstrap 實(shí)現(xiàn)。這套界面工具包含許多基本的和復(fù)雜的 UI 部件，例如按鈕，輸入框，組合按鈕，復(fù)選框，單選按鈕，標(biāo)簽，菜單，進(jìn)度條和滑塊，導(dǎo)航元素等等。
官方網(wǎng)站：https://github.com/designmodo...

5.網(wǎng)易CSS框架 NEC
NEC是網(wǎng)易推出的開(kāi)源前端CSS框架，NEC提供了豐富UI代碼庫(kù)和插件，可以極大的幫助開(kāi)發(fā)人員提高開(kāi)發(fā)效率。即使你并非前端專業(yè)開(kāi)發(fā)人員，利用NEC你也可以快速地構(gòu)建屬于自己的網(wǎng)頁(yè)應(yīng)用。
官方網(wǎng)站：http://nec.netease.com/

6.Alloy UI – 功能強(qiáng)大的CSS UI框架
Alloy UI是基于YUI 3的前段UI框架，包含一套豐富的（超過(guò)60）UI 部件，如圖片庫(kù)，對(duì)話框，樹(shù)形結(jié)構(gòu)，面板，自動(dòng)完成，按鈕，日歷控件，工具條等。
官方網(wǎng)站：http://alloyui.com/

7.Cardinal – 移動(dòng)端的CSS UI框架
Cardinal 是一個(gè)小型的移動(dòng)優(yōu)先的 CSS 框架，提供很多有用的默認(rèn)樣式、可縮放排版、可重用模塊和一個(gè)簡(jiǎn)單的響應(yīng)式表格系統(tǒng)。
官方網(wǎng)站：http://cardinalcss.com/

8.快速開(kāi)發(fā)CSS的框架 CSScaffold
不同于許多CSS框架，它必須依靠PHP與Apache的mod_rewrite來(lái)執(zhí)行，但也因?yàn)樾枰@兩種東西，讓CSScaffold變得很神奇、很方便，寫(xiě)起CSS來(lái)又快又輕松！
官方網(wǎng)站：http://www.w3avenue.com/2009/...

9.后臺(tái)UI開(kāi)發(fā)框架 MuseUI
一款基于bootstrap風(fēng)格，兼容于主流瀏覽器（包括IE6）的后端UI開(kāi)發(fā)組件。
官方網(wǎng)站：http://git.oschina.net/muse/m...

前端教程
1.D3.js 入門(mén)教程

2.ECMAScript 6 入門(mén) --阮一峰

3.React入門(mén)教程

4.TypeScript入門(mén)教程

5.Velocity.js中文文檔

6.Webpack 2.2 中文文檔

7.七天學(xué)會(huì)NodeJS

8.廖雪峰-Git教程

9.廖雪峰-javascript教程

前端常用插件
1.jQuery內(nèi)容滾動(dòng)插件-BoxSlider

2.jQuery artDialog對(duì)話框插件

3.移動(dòng)端日期選擇組件

4.圖像延遲加載庫(kù)Echo.js

5.輪播圖FlexSlider插件

6.Slick.js幻燈片使用方法

7.JavaScript響應(yīng)式輪播圖插件–Flickity

8.Intro.js 分步向?qū)Р寮褂梅椒?/p>

9.ScrollReveal-元素隨頁(yè)面滾動(dòng)產(chǎn)生動(dòng)畫(huà)的js插件

10.支持移動(dòng)觸摸的jQuery圖片Lightbox插件

11.Owl Carousel幻燈片插件

12.kissui.scrollanim頁(yè)面滾動(dòng)動(dòng)畫(huà)庫(kù)插件

13.jQuery cxSelect 聯(lián)動(dòng)下拉菜單

14.jQuery cxCalendar 日期選擇器

15.jQuery Transit 過(guò)渡效果插件

16.lightslider-支持移動(dòng)觸摸的輕量級(jí)jQuery幻燈片插件

17.WOW.js滾動(dòng)頁(yè)面產(chǎn)生動(dòng)畫(huà)

18.FullPage.js全屏插件

19.animate.css動(dòng)畫(huà)庫(kù)

手冊(cè)大全
1.jQuery API 中文文檔
http://www.jquery123.com/

2.seajs手冊(cè)
http://cyj.me/why-seajs/zh

3.vue api
https://cn.vuejs.org/v2/api/

4.bootstrap4手冊(cè)
http://www.jqhtml.com/bootstr...

5.CSS 語(yǔ)法參考
https://tympanus.net/codrops/...

6.mozilla js參考
https://developer.mozilla.org...

參考：www.cnblogs.com/powertoolsteam/p/front_end_framework_2017.html
http://www.codeceo.com/articl...