一大波前端乾貨整合【技術社區、博文、資源、工具】

前端交流站點

大前端       http://www.daqianduan.com/

V2EX        http://www.v2ex.com/

W3cplus    http://www.w3cplus.com/

W3Cfuns   http://www.w3cfuns.com/

Github       https://github.com/

掘金           http://gold.xitu.io/

前端導航     http://jsdig.com/

百度EFE技術體系 http://efe.baidu.com/

前端學習

CSS       CSS參考手冊 http://www.w3school.com.cn/cssref/

JQuery   jQuery API 中文文檔

LESS    http://less.bootcss.com/

SASS   http://sass.bootcss.com/docs/sass-reference/

HTTP協議詳解 http://www.cnblogs.com/li0803/archive/2008/11/03/1324746.html

JSON  $.each遍歷json對象 JSON介紹 JSON詳解

HTML5  http://www.w3school.com.cn/html5/

CommonJS規範  淺析JS中的模塊規範（CommonJS，AMD，CMD）  什麼是CommonJS？

SeaJS  CMD規範  http://seajs.org/docs/

NodeJS   Node.js v4.2.4 手冊 & 文檔 Node.js中文網

ExpressJS          Express 4.x API 中文手冊

BanckBoneJS     Backbone.js(1.1.2) API中文文檔  RequireJS與Backbone簡單整合  

RequireJS           RequireJS中文網

AngularJS           Angular中文網   angular-ui-router   AngularJS移動開發中的坑彙總

ReactJS              深刻理解 React官博文  https://github.com/ruanyf/react-demos

VueJS                 vuejs API

Git                      Git教程——廖雪峯

Gulp                    gulp API 文檔   Gulp中文網入門指南   gulp下靜態資源的合併、壓縮、MD5後綴

Browserhacks       瀏覽器HACKS

webpack              webpack官網  webpack入門

3D前端

 webGL               webGL中文網

 three.js             http://threejs.org/       https://github.com/mrdoob/three.js/

 webVR               https://ngokevin.github.io/ningjs-presentation/ 

                    https://github.com/aframevr/aframe

前端工具

必備工具      http://www.w3cfuns.com/tools.php?mod=bookcss

RunJS 在線js編輯

素材  http://www.dowebok.com/

FIS3                    百度前端構建工具

前端相關工具(Mac)

• 編輯器：Sublime Text 2 / TextMate 2 / Vim / Intellij IDEA
• 命令行：iTerm2
• 瀏覽器調試環境：Chrome / Firefox + Firebug
• 移動設備調試環境：Mozilla Fennec
• 兼容性測試：VirtualBox + Win XP（IE 8）
• 版本控制工具：GitHub for Mac / Versions / SourceTree
• FTP工具：Filezilla / ForkLift
• HTTP抓包及Post/Get模擬：Charles
• PHP集成環境：XAMPP for Mac / MAMP
• SQL數據庫管理：Sequel Pro
• 標註工具：Mark Man / xScope
• 取色拾色器： Frank DeLoupe / Sip / Snip / xScope
• MarkDown編輯器：Mou
• 瀏覽器免刷新開發環境：LiveReLoad / CodeKit
• CSS Sprite切圖工具：SpriteRight
• Less -> CSS 編譯：CodeKit / LiveReLoad / Less
• 配色方案工具：ColorSchemer Studio
• 多瀏覽器Cookie管理：Cookie
• 圖片素材收集：Sparkbox / Pixa

 

前端開發神器

jQuery ligerUI快速開發UI框架

Buttons高度可定製的按鈕CSS樣式庫

SUI —— 基於bootstrap開發的前端組件庫，也是一套設計規範。

Flat UI免費的WEB界面工具組件庫

cublic-bezier貝爾曲線定製

 

前端插件庫

swipejs——移動web頁面內容觸摸滑動類庫

jQuery 插件庫

web動畫

GreenSock動畫庫

Bootstrap

fullpage屏幕滾動插件

 

前端資源庫

百度靜態資源公共庫

Iconfont——阿里巴巴矢量圖標庫

 

前端博文推薦

gulp + webpack工程構建   教你一套gulp+webpack前端工程——齊修

層疊 順序和堆棧上下文  http://www.cnblogs.com/coco1s/p/5899089.html

 移動端web開發技巧 http://www.imooc.com/article/1115

 

2016 年 50 個最佳的輕量級 JavaScript 框架和庫

 https://zhuanlan.zhihu.com/p/24598210

jQuery Plugin

• IE對HTML5標籤支持，以及瀏覽器特性檢測：Modernizr & html5shiv
• <del>IE6 PNG 圖片支持：DD_belatedPNG</del>
• 定製&統一 瀏覽器的滾動條樣式：jquery-scroll & Lionbars
• hover提示效果文字：bootstrap-tooltips & tipsy
• 滾動條跟隨nav效果：bootstrap-scrollspy
• 提示冒泡文字：grumble.js
• 導航欄過渡效果：lavalamp
• 移動設備的滾動效果：iscroll 4
• Mac OS Lion 風格的滾動條：Lionbars
• 彈性SlideShow：kwicks for jQuery
• 瀑布流：isotope
• 抖動效果：jQ shake
• LightBox：fancyBox
• KenDo UI：KenDo UI
• textarea自適應高度：elastic
• 提示區域 & 提示層：noty
• 浮動話題泡：jQuery grumble
• 旋轉進度：jQuery Knob
• jquery的100個小技巧
• 一些jquery插件 http://www.cnblogs.com/fastmover/p/6296022.html
• 淘寶旅行日曆插件
• 酒店價格日曆 http://fgm.cc/learn/calendar/hotel-price-calendar/
• KISSY版-圖片瀏覽組件
• 酒店地圖交通與周邊
• 淘寶實例
• 手機端日曆控件mobiscroll插件

項目構建

gulp + webpack 構建多頁面前端項目

vue-cli多頁面應用