前端網站資源精編!!

目錄:

1-------- 走進前端

2-------- jQuery

3-------- CSS

4-------- Angularjs

5-------- ES6

6-------- React

7-------- 移動端API

8-------- avalon

9-------- Requriejs

10-------- vue

11-------- Seajs

12-------- Less,sass

13-------- Markdown

14-------- D3

15-------- 兼容性

16-------- HTTP

17-------- 其它API

18-------- 圖表類

19-------- 正則

20-------- ionic

21-------- 前端

22-------- PHP

23-------- Android

24-------- 演算法

25-------- JSON

26-------- Html5

27-------- CSS

28-------- 焦點圖

29-------- Ext, EasyUI, J-UI 及其它各種UI方案

30-------- J-UI

31-------- Other

32-------- Amaze UI

33-------- 頁面 社會化 分享功能

34-------- 富文本編輯器

35-------- PC

36-------- Date library

37-------- 綜合效果搜索平台

38-------- 概述

39-------- Gulp

40-------- Grunt

41-------- Fis

42-------- pc圖輪

43-------- 移動端

44-------- 文件上傳

45-------- 模擬select

46-------- 取色插件

47-------- 城市聯動

48-------- 剪貼板

49-------- 簡繁轉換

50-------- 表格 Grid

51-------- 在線演示

52-------- 播放器

53-------- 粒子動畫

54-------- Nodejs

55-------- 常規優化

56-------- 優化工具

57-------- 在線工具

58-------- 前端架構

59-------- 推薦作品

60-------- 國外大牛精品

61-------- 簡歷模板

62-------- 面試題

63-------- iconfont

64-------- 前端開發工具

65-------- Fiddler

66-------- Chrome

67-------- Firebug

68-------- 移動,微信調試

69-------- iOS Simulator

70-------- img

71-------- 生成二維碼

72-------- 瀏覽器同步

73-------- 在線PPT製作

74-------- 前端導航網站

75-------- 常用CDN

76-------- Git

77-------- 優秀JavaScript項目


1--------走進前端!!!!

前端知識體系cnblogs.com/sb19871023/

前端知識結構github.com/JacksonTian/

免費的編程中文書籍索引github.com/justjavac/fr

阮一峰 Javascripthttp://javascript.ruanyifeng.com

精通JavaScript開發study.163.com/course/in

JavaScript中的this陷阱的最全收集--沒有之一segmentfault.com/a/1190

前端開發筆記本li-xinyang.gitbooks.io/

前端開發者手冊dwqs.gitbooks.io/fronte

前端入門教程cnblogs.com/jikey/p/361

前端工程師必備的PS技能——切圖篇imooc.com/view/506

2--------jQuery

jQuery API 中文文檔http://www.jquery123.com

學習jqueryhttp://learn.jquery.com

3--------CSS

CSS 語法參考tympanus.net/codrops/cs

CSS3動畫手冊isux.tencent.com/css3/i

志爺css小工具集合linxz.github.io/tianyiz

bouncejs 觸摸庫http://bouncejs.com

animate.cssdaneden.github.io/anima

4--------Angularjs

Angular.js 的一些學習資源github.com/dolymood/Ang

angularjs中文社區http://angularjs.cn

Angularjs源碼學習cnblogs.com/xuwenmin888

angular對bootstrap的封裝angular-ui.github.io/bo

angularjs + nodejscnodejs.org/topic/51404

呂大豹 Angularjscnblogs.com/lvdabao/tag

AngularJS 最佳實踐infoq.com/cn/news/2013/

Angular的一些擴展指令lovelucy.info/angularjs

Angular數據綁定原理github.com/Pasvaz/bindo

一些擴展Angular UI組件github.com/angular-ui

帶你走近AngularJS - 基本功能介紹

cnblogs.com/powertoolst

Angularjs開發指南angular.duapp.com/docs/

Angularjs學習cnblogs.com/amosli/p/37

angular jq mobilegithub.com/opitzconsult

angular uimgcrea.github.io/angula

有jQuery背景,該如何用AngularJS編程思想blog.jobbole.com/46589/

angular學習筆記zouyesheng.com/angular.

5--------ES6

exploring-es6leanpub.com/exploring-e

exploring-es6翻譯github.com/es6-org/expl

6--------React

react.js 中文論壇http://www.react-china.org

react.js 官方網址facebook.github.io/reac

react.js 官方文檔facebook.github.io/reac

react.js material UImaterial-ui.com/

react.js TouchstoneJS UIhttp://touchstonejs.io

react.js amazeui UIamazeui.org/react

React 入門實例教程 - 阮一峰ruanyifeng.com/blog/201

React Native 中文版wiki.jikexueyuan.com/pr

Webpack 和 React 小書 - 前端亂燉html-js.com/article/Fak

Webpack 和 React 小書 - gitbookfakefish.github.io/reac

webpackgithub.com/webpack/webp

Webpack,101入門體驗html-js.com/article/300

webpack入門教程html-js.com/article/311

基於webpack搭建前端工程解決方案探索segmentfault.com/a/1190

7--------移動端API

99移動端知識集合github.com/jtyjty99999/

移動端前端開發知識庫github.com/AlloyTeam/Ma

移動前端的一些坑和解決方法(外觀表現)caibaojian.com/mobile-w

【原】移動web資源整理cnblogs.com/PeunZhang/p

zepto 1.1.2css88.com/doc/zeptojs_a

zepto 中文注釋cnblogs.com/sky000/arch

移動開發大雜燴github.com/hoosin/mobil

微信webview中的一些問題

lin-chao.github.io/2014

8--------avalon

avalonjshttp://avalonjs.coding.me/

Avalon新一代UI庫: OniUIued.qunar.com/oniui/ind

avalon.oniui-基於avalon的組件庫github.com/RubyLouvre/a

9--------Requriejs

Javascript模塊化編程(一):模塊的寫法

ruanyifeng.com/blog/201

Javascript模塊化編程(二):AMD規範

ruanyifeng.com/blog/201

Javascript模塊化編程(三):require.js的用法

ruanyifeng.com/blog/201

RequireJS入門(一)cnblogs.com/snandy/arch

RequireJS入門(二)cnblogs.com/snandy/arch

RequireJS進階(三)cnblogs.com/snandy/arch

requrie源碼學習cnblogs.com/yexiaochai/

requrie 入門指南oschina.net/translate/g

requrieJS 學習筆記cnblogs.com/yexiaochai/

requriejs 其一cyj.me/why-seajs/requir

require backbone結合cnblogs.com/yexiaochai/

10--------vue

Vuehttp://cn.vuejs.org

Vue 入門指南cnblogs.com/aaronjs/p/3

Vue 的一些資源索引segmentfault.com/a/1190

awesome-vuegithub.com/vuejs/awesom

11--------Seajs

seajshttp://seajs.org

seajs 中文手冊cyj.me/why-seajs/zh

12--------Less,sass

sassw3cplus.com/sassguide

Sass 中文文檔http://sass.bootcss.com

lesshttp://less.bootcss.com

13--------Markdown

Markdown 語法說明 (簡體中文版)wowubuntu.com/markdown

markdown入門參考

github.com/LearnShare/L

gitbookhttps://www.gitbook.com國外的在線markdown可編輯成書

mdeditorzybuluo.com/mdeditor一款國內的在線markdown編輯器

stackedithttps://stackedit.io國外的在線markdown編輯器,功能強大,同步雲盤

mditorbh-lay.github.io/mditor一款輕量級的markdown編輯器

lepture-editorgithub.com/lepture/edit

markdown-editorgithub.com/jbt/markdown

14--------D3

d3 Tutorialsgithub.com/mbostock/d3/

Gallerygithub.com/mbostock/d3/

lofterdatavisual.lofter.com/p

iteyealanland.iteye.com/blog

ruanyifengjavascript.ruanyifeng.com

15--------兼容性

esma 兼容列表kangax.github.io/compat

W3C CSS驗證服務jigsaw.w3.org/css-valid

caniusecaniuse.com/#

csscreatorcsscreator.com/properti

microsoft[https://msdn.microsoft.com/zh-cn/library/cc351024(v=vs.85.aspx](https://msdn.microsoft.com/zh-cn/library/cc351024(v=vs.85.aspx)

在線測兼容-移動端http://www.responsinator.com

emulatorsmanymo.com/emulators

16--------HTTP

HTTP API 設計指南segmentfault.com/bookma

17--------其它API

驗證apiniceue.com/validator/de

underscore 中文手冊css88.com/doc/underscor

underscore源碼分析html-js.com/article/Und

underscore源碼分析-亞里士朱德的博客yalishizhude.github.io/

underscrejs en apihttp://underscorejs.org

lodash - underscore的代替品https://lodash.com

ext4apiextjs-doc-cn.github.io/

qwrap手冊http://dev.qwrap.com/resource/js/docs/_youa/#/qw/base/loadJs.htm

緩動函數easings.net/zh-cn

svg 中文參考w3school.com.cn/svg/svg

svg mdn參考developer.mozilla.org/e

svg 導出 canvasgithub.com/gabelerner/c

svg 導出 pnggithub.com/exupero/save

localStorage 庫github.com/machao/local

18--------圖表類

Highcharts 英文APIapi.highcharts.com/high

ECharts 百度的圖表軟體echarts.baidu.com/

高德地圖lbs.amap.com/api

開源的矢量圖腳本框架http://paperjs.org

svg 地圖http://jvectormap.com

19--------正則

JS正則表達式元字元segmentfault.com/a/1190

正則表達式30分鐘入門教程deerchao.net/tutorials/

MDN-正則表達式developer.mozilla.org/z

ruanyifeng - RegExp對象javascript.ruanyifeng.com

小鬍子哥 - 進階正則表達式div.io/topic/764?

is.jsgithub.com/Cedriking/is

正則在線測試http://regexper.com

20--------ionic

ionicgithub.com/ychow/ionic-

21--------前端

通過分析github代碼庫總結出來的工程師代碼書寫習慣alloyteam.github.io/Cod

HTML&CSS編碼規範 by @mdohttp://codeguide.bootcss.com

團隊合作的css命名規範-騰訊AlloyTeam前端團隊alloyteam.com/2011/10/1

前端編碼規範之js - by yuwenhuihttp://yuwenhui.github.io

前端編碼規範之js - by 李靖cnblogs.com/hustskyking

前端開發規範手冊zhibimo.com/read/Ashu/f

Airbnb JavaScript 編碼規範(簡體中文版)github.com/yuche/javasc

AMD與CMD規範的區別zhihu.com/question/2035

AMD與CMD規範的區別cnblogs.com/tugenhua070

KISSY 源碼規範docs.kissyui.com/1.4/do

bt編碼規範http://codeguide.bootcss.com

規範加強版github.com/Suxiaogang/C

前端代碼規範 及 最佳實踐blog.jobbole.com/79075

百度前端規範coderlmn.github.io/code

百度前端規範isobar-idev.github.io/c

百度前端規範zhuanlan.zhihu.com/fuyu

ECMAScript6 編碼規範--廣發證券前端團隊github.com/gf-rd/es6-co

JavaScript 風格指南/編碼規範(Airbnb公司版)blog.jobbole.com/79484

網易前端開發規範nec.netease.com/standar

css模塊https://thinkjs.org/

前端規範資源列表github.com/ecomfe/spec

22--------PHP

最流行的PHP 代碼規範segmentfault.com/a/1190

最流行的PHP 代碼規範github.com/hfcorriez/fi

23--------Android

【敏捷開發】Android團隊開發規範cnblogs.com/lcw/p/36191

Android 開發規範與應用jianshu.com/p/4390f4fe1

24--------演算法

數據結構與演算法 JavaScript 描述. 章節練習github.com/Ralph-Wang/a

常見排序演算法(JS版)github.com/twobin/twobi

經典排序github.com/luofei2011/j

常見排序演算法-js版本github.com/hechangmin/j

JavaScript 演算法與數據結構 精華集github.com/lightningtgc

面試常考演算法題精講nowcoder.com/live/cours

25--------JSON

模擬生成JSON數據http://beta.json-generator.com

26--------Html5

HTML5 有哪些讓你驚艷的 demo?zhihu.com/question/2439

27--------CSS

browserhackshttp://browserhacks.com

28--------焦點圖

myfocusgithub.com/koen301/myfo

myfocus-官方演示站chhua.com/myfocus

SuperSlidev2.1 -- 大話主席http://www.superslide2.com

soChangebujichong.com/sojs/soCh

29--------Ext, EasyUI, J-UI 及其它各種UI方案

extjssencha.com/products/ext

ext4英文apidocs.sencha.com/extjs/4

ext4中文apiextjs-doc-cn.github.io/

30--------J-UI

J-UIhttp://jui.org

31--------Other

MUI-最接近原生APP體驗的高性能前端框架dcloudio.github.io/mui

32--------Amaze UI

中國首個開源 HTML5 跨屏前端框架

淘寶 HTML5 前端框架http://m.sui.taobao.org

KISSY - 阿里前端JavaScript庫http://docs.kissyui.com

網易Nej - Nice Easy Javascripthttp://nej.netease.com

Kendo UI MVVM Demodemos.telerik.com/kendo

Bootstraphttp://www.bootcss.com

33--------頁面 社會化 分享功能

百度分享http://share.baidu.compc端

JiaThishttp://jiathis.compc端

社會化分享組件developer.baidu.com/soc移動端

ShareSDK 輕鬆實現社會化功能mob.com/#移動端

友盟分享dev.umeng.com/social/an移動端

34--------富文本編輯器

功能齊全 tinymcehttps://www.tinymce.com

百度 ueditorueditor.baidu.com/websi

經典的ckeditorhttp://ckeditor.com

經典的kindeditorhttp://kindeditor.net

wysiwygbootcss.com/p/bootstrap

一個有情懷的編輯器。Bachs Editorinteg.github.io/BachEdi

tower用的編輯器github.com/mycolorway/s

summernote 編輯器github.com/summernote/s

html5編輯器neilj.github.io/Squire

wangEditorgithub.com/wangfupeng19

35--------PC

經典my97my97.net/dp/demo/index.

強大的獨立日期選擇器cnblogs.com/gbin1/archi

fullcalendarhttp://fullcalendar.io

fullcalendar日曆控制項知識點集合blog.csdn.net/francisla

農曆日曆github.com/zzyss86/Luna

日期格式化http://momentjs.com

我群某管理作品github.com/Iamlars/date

input按位替換-官網digitalbush.com/project

input按位替換-githubgithub.com/digitalBush/

bootstrap-daterangepickergithub.com/dangrossman/

國外30個插件集合vandelaydesign.com/30-b

JavaScript datepickerdbushell.com/2012/10/09

Datepair.jsjonthornton.github.io/D

一個風格多樣的日曆github.com/glad/glDateP

彈出層式的全日曆amsul.ca/pickadate.js/d

jquery雙日曆http://www.daterangepicker.com

36--------Date library

Datejsgithub.com/datejs/Datej

sugarjssugarjs.com/api/Date

37--------綜合效果搜索平台

效果網http://www.jq22.com

17素材http://www.17sucai.com

常用的JavaScript代碼片段http://microjs.com

38--------概述

前端工具大全http://www.awesomes.cn

什麼是前端工程化github.com/fouber/blog/

39--------Gulp

Gulp官網http://gulpjs.com

Gulp中文網http://www.gulpjs.com.cn

gulp資料收集github.com/Platform-CUF

Gulp:任務自動管理工具 - ruanyifengjavascript.ruanyifeng.com

Gulp插件gulpjs.com/plugins

Gulp不完全入門教程ido321.com/1622.html

為什麼使用gulp?github.com/hjzheng/CUF_

Gulp安裝及配合組件構建前端開發一體化dbpoo.com/getting-start

Gulp 入門指南github.com/nimojs/gulp-

Gulp 入門指南 - nimojsgithub.com/nimojs/blog/

Gulp入門教程

markpop.github.io/2014/

Gulp in Actionimooc.com/video/5692

Gulp開發教程(翻譯)w3ctech.com/topic/134

前端構建工具gulpjs的使用介紹及技巧cnblogs.com/2050/p/4198

40--------Grunt

gruntjshttp://gruntjs.com

Grunt中文網http://www.gruntjs.net

41--------Fis

fis 官網fex-team.github.io/fis-

fishttp://fis.baidu.com

42--------pc圖輪

左右按鈕多圖切換bxslider.com/examples/c

fullpage全屏輪播github.com/alvarotrigo/

43--------移動端

滑屏效果idangero.us/swiper

全屏fullpagegithub.com/peunzhang/fu

單個圖片切換github.com/qiqiboy/touc

單個全屏切換github.com/peunzhang/sl

單個全屏切換github.com/peunzhang/iS

滑屏效果github.com/saw/touch-in

旋轉拖動設置baijs.com/tinycirclesli

類似於swipe切換http://touchslider.com

支持多種形式的觸摸滑動swiper.com.cn/demo/inde

滑屏效果github.com/joker-ye/mai

大話主席pc移動圖片輪換http://www.superslide2.com

滑屏效果github.com/hahnzhu/para

基於zepto的fullpagegithub.com/yanhaijing/z

[WebApp]定寬網頁設計下,固定寬度布局開發WebApp並實現多終端下WebApp布局自適應

cnblogs.com/plums/archi

判斷微信客戶端的那些坑loo2k.com/blog/detectin

可以通過javascript直接調用原生分享的工具github.com/JefferyWang/

JiaThis 分享到微信代碼jiathis.com/help/html/w

聊聊移動端跨平台開發的各種技術fex.baidu.com/blog/2015

前端自動化測試zhihu.com/question/2992

多種輪換圖片ajccom.github.io/nicesl

滾動條組件ajccom.github.io/nicesc

滑動側邊欄mango.github.io/slideou

fastclickgithub.com/ftlabs/fastc

no-click-delaygithub.com/mmastrac/jqu

44--------文件上傳

百度上傳組件fex.baidu.com/webupload

上傳blueimp.github.io/jQuer

flash 頭像上傳http://www.hdfu.net

圖片上傳預覽http://www.dropzonejs.com

圖片裁剪elemefe.github.io/image

圖片裁剪-shearphotohttp://www.shearphoto.com

jQuery圖片處理oschina.net/project/tag

45--------模擬select

糖餅 selectaui.github.io/popupjs/d

flexselectgithub.com/rmm5t/jquery

雙selecthttp://loudev.com

select2http://select2.github.io

46--------取色插件

類似 Photoshop 的界面取色插件jq22.com/plugin/367

jquery colorgithub.com/jquery/jquer

取色插件集合oschina.net/project/tag

farbtastic 圓環+正方形github.com/mattfarina/f

47--------城市聯動

jquery.cityselect.js基於jQuery+JSON的省市或自定義聯動效果ijquery.cn/?

48--------剪貼板

剪貼板github.com/zeroclipboar

不是Flash的剪貼板github.com/zenorocha/cl

49--------簡繁轉換

簡繁轉換github.com/BYVoid/OpenC

50--------表格 Grid

facebook表格facebook.github.io/fixe

類似於Excel編輯表格-handsontablehttp://handsontable.com

bootstrap-table插件http://bootstrap-table.wenzhixin.net.cn

datatableshttps://www.datatables.net

51--------在線演示

js 在線編輯 - runjshttp://runjs.cn

js 在線編輯 - jsbinhttp://jsbin.com

js 在線編輯 - codepenhttp://codepen.io

js 在線編輯 - jsfiddlehttp://jsfiddle.net

java 在線編輯 - runjshttp://ideone.com

js 在線編輯 - hchartshttp://code.hcharts.cn

js 在線編輯 - jsdmhttp://jsdm.com

sql 在線編輯 - sqlfiddlehttp://sqlfiddle.com

mozilla 在線編輯器https://thimble.mozilla.org

52--------播放器

Html5 VideoPlayergithub.com/zmmbreeze/De

53--------粒子動畫

Proton 煙花a-jie.github.io/Proton/#

54--------Nodejs

Node.js 包教不包會github.com/alsotang/nod

nodejs定時任務my.oschina.net/u/568264

一個nodejs博客http://60sky.com

【NodeJS 學習筆記04】新聞發布系統cnblogs.com/yexiaochai/

過年7天樂,學nodejs 也快樂cnblogs.com/qqloving/p/

七天學會NodeJSgithub.com/nqdeng/7-day

Nodejs學習筆記(二)--- 事件模塊cnblogs.com/zhongweiv/p

nodejs入門cnblogs.com/liusuqi/p/3

angularjs nodejsgithub.com/zensh/jsgen

從零開始nodejs系列文章blog.fens.me/series-nod

理解nodejsdebuggable.com/posts/un

nodejs事件輪詢blog.mixu.net/2011/02/0

node入門nodebeginner.org/index-

nodejs cmsourjs.com/detail/53e1f2

Node初學者入門,一本全面的NodeJS教程

ourjs.com/detail/529ca5

NodeJS的代碼調試和性能調優barretlee.com/blog/2015

55--------常規優化

Javascript高性能動畫與頁面渲染infoq.com/cn/articles/j

移動H5前端性能優化指南isux.tencent.com/h5-per

給網頁設計師和前端開發者看的前端性能優化uisdc.com/front-end-per

複雜應用的 CSS 性能分析和優化建議orzpoint.com/profiling-

張鑫旭——前端性能zhangxinxu.com/wordpres

web前端性能優化進階路aliued.cn/2013/01/20/we

前端技術:網站性能優化之CSS無圖片技術my.eoe.cn/tuwandou/arch

頁面載入中的圖片性能優化w3ctech.com/p/1503

Hey——前端性能feelcss.com/tag/%E5%89%

YSLOW中文介紹cnblogs.com/yslow

轉一篇Yahoo關於網站性能優化的文章,兼談本站要做的優化360ito.com/article/40.h

Yahoo!團隊實踐分享:網站性能360doc.com/content/10/0

網站性能優化指南:什麼使我們的網站變慢?blog.jiasule.com/i/153

網站性能優化實踐,減少載入時間,提高用戶體驗powereasy.net/helpyou/k

淺談網站性能優化 前端篇umtry.com/archives/747.

前端重構實踐之如何對網站性能優化?adinnet.cn/blog/designv

前端性能優化:使用媒體查詢載入指定大小的背景圖片gbin1.com/technology/ja

網站性能系列博文mykuer.com/post/factors

載入,不只是少一點點

tgideas.qq.com/webplat/

分享網頁載入速度優化的一些技巧?

gbin1.com/technology/ht

頁面載入中的圖片性能優化f2es.com/images-bytes-o

【高性能前端1】高性能HTMLalloyteam.com/2012/10/h

【高性能前端2】高性能CSSalloyteam.com/2012/10/h

由12306談談網站前端性能和後端性能優化coolshell.cn/articles/6

AlloyTeam——前端優化alloyteam.com/webfronte

毫秒必爭,前端網頁性能最佳實踐cnblogs.com/developersu

網站性能工具Yslow的使用方法blog.sina.com.cn/s/blog

前端工程與性能優化(上):靜態資源版本更新與緩存

infoq.com/cn/articles/f

前端工程與性能優化(下):靜態資源管理與模板框架

infoq.com/cn/articles/f

HTTPS連接的前幾毫秒發生了什麼blog.jobbole.com/48369

Yslowuicss.cn/yslow/#

YUISlide,針對移動設備的動畫性能優化jayli.github.io/blog/da

讓網站提速的最佳前端實踐segmentfault.com/a/1190

Why Website Speed is Importantsixrevisions.com/web-de

Need for Speed – How to Improve your Website Performancedevbridge.com/articles/

阿里無線前端性能優化指南 (Pt.1 載入期優化github.com/amfe/article

56--------優化工具

JavaScript 性能分析新工具 OneProfilehtml-js.com/article/308

JavaScript 堆內存分析新工具 OneHeaphtml-js.com/article/309

57--------在線工具

阿里-免費測試服務http://itest.aliyun.com

阿里-F2etest多瀏覽器兼容性測試解決方案github.com/alibaba/f2et

js性能測試http://jsperf.com

58--------前端架構

技術架構zhihu.com/topic/1961264

前端架構saito.im/note/The-Archi

如何成為前端架構師zhihu.com/question/2409

關於前端架構-張克軍hikejun.com/sharing/201

百度騰訊offer比較(騰訊遊戲VS百度基礎架構)zhihu.com/question/2558

59--------推薦作品

fgmfgm.cc/learn

岑安作品集github.com/hongru/hongr

當耐特demo集合http://kmdjs.github.io

米空格 js作品laoshu133.com/Lab

SeaJS組件庫panxuepeng.github.io/se

顏海鏡作品yanhaijing.com/myProjec

腳兒網作品jo2.org/category/mywork

javascript個人作品cnitblog.com/yemoo/cate

妙味的雷東升遊戲作品bbs.miaov.com/forum.php?

javascript作品集bbs.csdn.net/topics/380

雲五筆,灰度產生生成工具github.com/TooBug/works

項目主頁http://koen301.github.io

個性的作品主頁http://zaole.net

智能社zhinengshe.com/works_li

實例陳列架http://demos.shizuwu.cn

jyg 遊戲案例http://www.lovewebgames.com

很多jquery插件helloweba.com/list.html

不羈蟲 - soJs 作品系列bujichong.com/sojs/api/

frozenuifrozenui.github.io/case

黑白棋js-game.github.io/othel

fromoneyansm.github.io/fromone

60--------國外大牛精品

pazguillehttp://pazguille.me

61--------簡歷模板

不錯的個人簡歷learnshare.github.io/ab

簡歷hcy2367.github.io/resum

簡歷github.com/hacke2/Resum

翁天信blog.dandyweng.com/2013

動畫方式的簡歷webhek.com/misc/interac

組件豐富簡歷linqing07.com/resume.ht

haorooms博客haorooms.com/about

Justin Younghttp://cv.youngdze.com

62--------面試題

那幾個月在找工作(百度,網易遊戲)nowcoder.com/discuss/31

2014最新面試題html-js.com/article/174

2016校招內推 -- 阿里巴巴前端 -- 三面面試經歷cnblogs.com/imwtr/p/468

年後跳槽那點事:樂視+金山+360面試之行cnblogs.com/lvdabao/p/3

拉勾網js面試題cnblogs.com/52cik/p/js-

前端面試cnblogs.com/allenxing/p

前端開發面試題segmentfault.com/a/1190

2014最新前端面試題github.com/markyun/My-b

百度面試github.com/fex-team/int

前端開發面試題segmentfault.com/a/1190

5個經典的前端面試問題ourjs.com/detail/5%E4%B

如何面試一名前端開發工程師?html-js.com/article/Lar

前端實習生面試總結cnblogs.com/xiaoruo/p/4

史上最全 前端開發面試問題及答案整理github.com/hawx1993/Fro

BAT及各大互聯網公司2014前端筆試面試題:JavaScript篇blog.jobbole.com/78738

前端開發面試題大收集github.com/paddingme/Fr

收集的前端面試題和答案github.com/qiu-deqing/F

如何面試前端工程師zhihu.com/question/1956

前端開發面試題github.com/markyun/My-b

牛客網-筆試面經nowcoder.com/discuss?

63--------iconfont

中文字體zhihu.com/question/2125

淘寶字型檔http://iconfont.cn

字體mux.alimama.com/fonts

製作教程iconfont.cn/help/platfo

zhangxinxu-icommonzhangxinxu.com/wordpres

icommonicomoon.io/app

用字體在網頁中畫ICON圖標(推薦教程imooc.com/learn/243

字體壓縮工具http://font-spider.org

64--------前端開發工具

IntelliJ IDEA 簡體中文專題教程github.com/judasn/Intel

SublimeTextgithub.com/jikeytang/su

Atomhttps://atom.io

visual studio codehttps://code.visualstudio.com

65--------Fiddler

Fiddler調試使用知多少(一)深入研究cnblogs.com/tugenhua070

微信fiddlecnblogs.com/strick/p/45

微信fiddlegaoboy.com/article/26.h

66--------Chrome

Chrome - 基礎cnblogs.com/constantinc

Chrome - 進階cnblogs.com/constantinc

Chrome - 性能cnblogs.com/constantinc

Chrome - 性能進階cnblogs.com/constantinc

Chrome - 移動cnblogs.com/constantinc

Chrome - 使用技巧cnblogs.com/liyunhua/p/

Chrome - Console控制台不完全指南cnblogs.com/Wayou/p/chr

Chrome - Workspace使瀏覽器變成IDEc7sky.com/chrome-devtoo

network面板html-js.com/article/Not

chrome開發工具快捷鍵anti-code.com/devtools-

chrome調試工具常用功能整理html-js.com/article/232

Chrome 開發工具 Workspace 使用

iinterest.net/2014/05/0

Chrome神器Vimium快捷鍵學習記錄

cppblog.com/deercoder/a

sass調試-w3cplusw3cplus.com/sassguide/d

如何更專業的使用Chrome開發者工具-w3cplus

w3cplus.com/tools/how-t

chrome調試canvassentsin.com/web/253.htm

chrome profiles3oschina.net/translate/p

chrome的調試cnblogs.com/QLeelulu/ar

查看事件綁定cnblogs.com/xiaoyao2011

神器——Chrome開發者工具segmentfault.com/a/1190

奇趣百科性能優化(Chrome DevTools 中的 Timeline Profils 等工具使用介紹

xinranliu.me/2015-05-22

chrome 開發者工具的 15 個小技巧frontenddev.org/link/15

Chrome開發者工具不完全指南1ke.co/course/361

Chrome 開發者工具使用技巧segmentfault.com/a/1190

67--------Firebug

firebug視頻教程imooc.com/learn/137

firefox 模擬器developer.mozilla.org/z

Firebug入門指南ruanyifeng.com/blog/200

Firebug控制台詳解ruanyifeng.com/blog/201

68--------移動,微信調試

瀏覽器端調試安卓https://openstf.github.io

移動端前端開發調試yujiangshui.com/multide

mac移動端調試plus.uc.cn/document/web

mac移動端調試http://www.mihtool.com

無線調試攻略thx.github.io/mobile/de

無線調試攻略yanhaijing.com/mobile/2

屌爆了,完美調試 微信webview(x5jianshu.com/p/ccf124f1f

微信調試的那些事liyaodong.com/2015/07/0

遠程consolehttp://jsconsole.com

微信調試工具http://blog.qqbrowser.cc

各種真機遠程調試方法匯總github.com/jieyou/remot

69--------iOS Simulator

Simulatordeveloper.apple.com/lib

Xcode中的iOS模擬器(iOS Simulator的介紹和使用心得

crifan.com/intro_ios_si

70--------img

loading imgpreloaders.net/en/circu

智圖-圖片優化平台http://zhitu.isux.us

在線png優化https://tinypng.com

71--------生成二維碼

生成二維碼http://cli.im

72--------瀏覽器同步

puergithub.com/leeluolee/pu

liveReloadhttp://livereload.com

f5http://getf5.com

File Watchersgeek100.com/2608

73--------在線PPT製作

nodePPTjs8.in/2013/11/16/%E6%8

PPTgithub.com/ksky521/node

revealgithub.com/hakimel/reve

slippygithub.com/Seldaek/slip

74--------前端導航網站

前端導航http://whycss.com

前端網址導航daqianduan.com/nav

前端名錄sentsin.com/daohang

前端導航http://123.jser.us

前端開發資源css88.com/nav

前端開發倉庫 - 眾多效果的收集地http://code.ciaoca.com

前端資源導航github.com/jnoodle/f2e-

F2E 前端導航f2e.im/static/pages/nav

75--------常用CDN

新浪CDNhttp://lib.sinaapp.com

百度靜態資源公共庫http://cdn.code.baidu.com

360網站衛士常用前端公共庫CDN服務http://libs.useso.com

Bootstrap中文網開源項目免費 CDN 服務http://www.bootcdn.cn

開放靜態文件 CDN - 七牛http://staticfile.org

CDN加速 - jq22jq22.com/cdn

jQuery CDNhttp://code.jquery.com

微軟CDNasp.net/ajax/cdn

76--------Git

git-scmhttp://git-scm.com

廖雪峰-Git教程

liaoxuefeng.com/wiki/00

git-for-windowshttps://git-for-windows.github.io

GitHub 添加 SSH keysdaemon369.github.io/git

gogithubworldhello.net/gotgithu

git常規命令練習pcottle.github.io/learn

git的資料整理github.com/xirong/my-gi

我所記錄的git命令(非常實用)cnblogs.com/fanfan259/p

企業開發git工作流模式探索部分休整

github.com/xirong/my-gi

GitHub 漫遊指南github.com/phodal/githu

GitHub秘籍github.com/tiimgreen/gi

使用git和github進行協同開發流程livoras.com/post/28

77--------優秀JavaScript項目

Angular和Webpack種子文件github.com/AngularClass

Fis3面向前端的工程構建系統github.com/fex-team/fis

Fis3 DEMOgithub.com/fex-team/fis

前端JQuery系列:源碼剖析github.com/JsAaron/jQue

avalon框架github.com/RubyLouvre/a

Microsoft ChakraCore 微軟的Chakra引擎github.com/Microsoft/Ch

Quintus HTML遊戲引擎github.com/cykod/Quintu

一個用node.js搭建的有趣博客github.com/STRML/strml.

Web前端助手--FeHelper(Chrome擴展)github.com/zxlie/FeHelp

百度前端技術學院github.com/baidu-ife/if

Cheerio(node.js中的jQuery)github.com/cheeriojs/ch

nodejs的一個聊天軟體 類似微信github.com/BryanYang/fr

使用html5和node.js構建的網易雲音樂github.com/stkevintan/C

babel ES6轉換為ES5github.com/babel/babel

一個JS富文本編輯器github.com/fex-team/ued

一個JS腦圖可視化工具github.com/fex-team/kit

一個JS寫的Flappy Bird Gamegithub.com/ellisonleao/

一個JS寫的GBA模擬器github.com/taisel/Iodin

SegmentFault寫的Markdown解析器github.com/SegmentFault

基於node.js的Ghost博客github.com/TryGhost/Gho

學習react的demosgithub.com/ruanyf/react


推薦閱讀:

知乎上很多前端大佬說,要做好前端的話html和css基礎必須夯實。那麼,達到什麼水平才能叫基礎夯實呢?
如何實現 div的大小由背景圖片的大小決定?
這是我的前端學習路線,大家幫忙看看有什麼不好的地方?
Razor 生成的html格式可以調整嗎?
零基礎的人如何在一個月內做出令人驚訝的網站?

TAG:前端開發 | jQuery | HTMLCSS |