匯總前端網站資源

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

前端知識體系
前端知識架構
免費的程式中文書籍索引
阮一峰Javascript
精通JavaScript開發
JavaScript中的this陷阱的最完整收藏--沒有之一
前端開發筆記本https://li-xinyang.gitbooks.io/frontend-notebook/content
前端開發者手冊https://dwqs.gitbooks.io/frontenddevhandbook/content
前端入門教學
前端工程師必備的PS技能－切圖篇

2--------jQuery

#jQuery API 中文文件
學習jquery

##3--------CSS

CSS 文法參考
CSS3動畫手冊
志爺css小工具集合http://linxz.github.io/tianyizone
bouncejs 觸碰函式庫
animate.csshttp://daneden.github.io/animate.css

4--------Angularjs

Angular.js 的一些學習資源
angularjs中文社群
Angularjs原始碼學習
angular對bootstrap的封裝http://angular-ui.github.io/bootstrap
angularjs + nodejs
呂大豹Angularjs
AngularJS最佳實踐
Angular的一些擴充指令http://www.lovelucy.info/angularjs-best-practices.html
Angular資料綁定原理
一些擴充Angular UI元件
帶你走近AngularJS - 基本功能介紹

Angularjs開發指南
Angularjs學習
angular jq mobile
angular uihttp://mgcrea.github.io/angular-strap
有jQuery背景，該如何用AngularJS程式設計思想
angular學習筆記

#5--------ES6

#exploring-es6
exploring-es6翻譯

6--------React

react.js 中文論壇
react.js 官方網址https://facebook.github.io/react/index.html
react.js官方文件https://facebook.github.io/react/docs/getting-started.html
react.js material UI
react.js TouchstoneJS UIhttp://touchstonejs.io
react.js amazeui UI
React 入門實例教學- 阮一峰

React Native 中文版

Webpack 和React 小書- 前端亂燉

Webpack 和React 小書- gitbookhttps://fakefish.github.io/react -webpack-cookbook

webpack
Webpack，101入門體驗
webpack入門教學

基於webpack搭建前端工程解決方案探索

7--------手機端API

99行動端知識集合
行動端前端開發知識庫
行動前端的一些坑與解決方法（外觀表現）
【原】行動web資源整理
zepto 1.1.2
zepto 中文註釋
行動開發大雜燴
微信webview中的一些問題
http://lin-chao.github.io/2014/11/14/%E5%BE% AE%E4%BF%A1webview%E4%B8%AD%E7%9A%84%E4%B8%80%E4%BA%9B%E9%97%AE%E9%A2%98

8 --------avalon

avalonjshttp://avalonjs.coding.me/

Avalon新一代UI函式庫：OniUI

avalon.oniui-基於avalon的元件庫

9--------Requriejs

Javascript模組化程式設計（一）：模組的寫法

Javascript模組化程式設計（二）：AMD規格

#Javascript模組化程式設計（三）：require.js的用法

RequireJS入門（一）

RequireJS入門（二）

RequireJS進階（三）

requrie原始碼學習

requrie 入門指南
requrieJS 學習筆記
requriejs 其一http://cyj.me/why-seajs/requirejs/

require backbone結合

10------ --vue

Vue
Vue 入門指南
Vue 的一些資源索引
awesome-vue

11--------Seajs

seajs

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

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

#sass
Sass 中文文件
less

13--------Markdown

Markdown 文法說明(簡體中文版）

markdown入門參考

gitbook國外的線上markdown可編輯成書
mdeditor一款國內的線上markdown編輯器
stackedithttps://stackedit.io國外的線上markdown編輯器，功能強大，同步雲盤
mditorhttp://bh -lay.github.io/mditor一款輕量級的markdown編輯器
lepture-editor

markdown-editor

14--------D3

d3 Tutorials

Gallery

lofter

iteye
ruanyifeng

15--------相容性

esma 相容清單http://kangax .github.io/compat-table/es6
W3C CSS驗證服務
caniusecsscreatormicrosoft[(v=vs.85.aspx]((v=vs.85.aspx)
線上測相容-行動端
emulators

16--------HTTP

#HTTP API 設計指南

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

驗證api
underscore 中文手冊
underscore源碼分析
underscore源碼分析-亞里斯朱德的博客http://yalishizhude.github.io/tags/ underscore
underscrejs en api

lodash - underscore的替代品

ext4apihttp://extjs-doc-cn.github.io/ext4api

qwrap手冊###docs/_youa/#/qw/ base/loadJs###.htm###緩動函數###svg 中文參考###svg mdn參考###svg 匯出canvas###svg 匯出png###localStorage 函式庫#####18 --------圖表類別######Highcharts 英文API###ECharts 百度的圖表軟體###高德地圖###開源的向量圖腳本框架###svg 地圖### ###19--------正規###

JS正規表示式元字元
正規表示式30分鐘入門教學
MDN-正規表示式
ruanyifeng - RegExp物件
小鬍子- 進階正規表示式http:// div.io/topic/764?page=1
is.js
正則線上測試

#20--------ionic

##ionic

21--------前端

透過分析github程式碼庫總結出來的工程師程式碼書寫習慣http://alloyteam.github.io/CodeGuide

HTML&CSS編碼規格by @mdo
團隊合作的css命名規範-騰訊AlloyTeam前端團隊
前端編碼規範之js - by yuwenhuihttp://yuwenhui.github.io
前端編碼規範之js - by 李靖
前端開發規範手冊
Airbnb JavaScript 編碼規格（簡體中文版）
AMD與CMD規範的差異
AMD與CMD規範的差異
KISSY 原始碼規格
bt編碼規格
#規格加強版
前端程式碼規格及最佳實踐
百度前端規範http://coderlmn.github.io/code-standards
百度前端規格http://isobar-idev.github.io/code-standards
百度前端規格
ECMAScript6 編碼規格--廣發證券前端團隊
JavaScript 風格指南/編碼規格（Airbnb公司版）
網易前端開發規格
css模組
前端規格資源列表

22--------PHP

最受歡迎的PHP 程式碼規格

最受歡迎的PHP 程式碼規格

23------ --Android

【敏捷開發】Android團隊開發規格

Android 開發規格與應用程式

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

#資料結構與演算法JavaScript 描述.章節練習

常見排序演算法（JS版）
經典排序
常見排序演算法-js版本
JavaScript 演算法與資料結構精華集
面試常考演算法題精講

25--------JSON

模擬產生JSON資料

26--------Html5

HTML5 有哪些讓你驚豔的demo？

27--------CSS

browserhacks

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

myfocus

myfocus-官方示範站
SuperSlidev2.1 -- 大話主席
soChange

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

extjs

ext4英文api
ext4中文apihttp://extjs-doc-cn.github.io/ext4api

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

J-UI

31--------Other

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

32--------Amaze UI

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

淘寶HTML5 前端框架
KISSY - 阿里前端JavaScript庫
網易Nej - Nice Easy Javascript
Kendo UI MVVM Demo
Bootstrap

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

百度分享端

JiaThis端
社會化分享元件行動端
ShareSDK 輕鬆實現社會化功能行動端
友盟分享行動端

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

功能齊全tinymce

百度ueditor
經典的ckeditor
經典的kindeditor
wysiwyg
一個有情懷的編輯器。 Bach's Editorhttp://integ.github.io/BachEditor
tower使用的編輯器
summernote 編輯器
html5編輯器http://neilj.github.io/Squire
wangEditor

35--------PC

經典my97

強大的獨立日期選擇器
fullcalendarhttp://fullcalendar.io
fullcalendar日曆控制項知識點集合
農曆日曆
日期格式化
我群某管理作品
input按位替換-官網
input按位替換-github
bootstrap-daterangepicker
國外30個外掛程式集合
JavaScript datepicker
Datepair.jshttp://jonthornton.github.io/Datepair.js
一個風格多樣的日曆
彈出層式的全日曆http://amsul.ca/pickadate. js/date
jquery雙日曆

36--------Date library

Datejs

sugarjs

#37------ --綜合效果搜尋平台

效果網

17素材
常用的JavaScript程式碼片段

#38--------概述

前端工具大全

什麼是前端工程化

39--------Gulp

Gulp官網

Gulp中文網
gulp資料收集
Gulp ：任務自動管理工具- ruanyifeng
Gulp外掛
Gulp不完全入門教學
為什麼要使用gulp?
Gulp安裝及配合元件建立前端開發一體化
Gulp 入門指南
Gulp入門指南- nimojs
Gulp入門教學
http://markpop.github.io/2014/09/17/Gulp%E5%85%A5%E9%97%A8%E6%95%99%E7 %A8%8B
Gulp in Action
Gulp開發教學課程（翻譯）
前端建置工具gulpjs的使用介紹及技巧

40--------Grunt

gruntjs

Grunt中文網

41--------Fis

fis 官網http://fex-team.github.io/fis-site/ index.html

fis

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

左右按鈕多圖切換

fullpage全螢幕輪播

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

滑屏效果http://www.idangero.us/swiper
全螢幕fullpage
單一圖片切換
單一全螢幕切換
單一全螢幕切換
滑屏效果
旋轉拖曳設定
類似於swipe切換
支援多種形式的觸控滑動
滑動螢幕效果
大話主席pc移動圖片輪替
滑幕效果
基於zepto的fullpage
[WebApp]定寬網頁設計下，固定寬度佈局開發WebApp並實現多終端下WebApp佈局自適應

#判斷微信客戶端的那些坑
可以透過javascript直接呼叫原生分享的工具
JiaThis 分享到微信代碼
聊聊行動端跨平台開發的各種技術
前端自動化測試
多種輪替圖片http://ajccom.github.io/niceslider
捲軸組件http://ajccom.github.io/nicescroller
滑動側邊欄https://mango.github.io/slideout
fastclick
no-click-delay

#44-- ------檔案上傳

百度上傳元件
上傳https://blueimp.github.io/jQuery-File-Upload
flash 頭像上傳
圖片上傳預覽
圖片裁切http://elemefe.github.io/image-cropper
圖片裁切-shearphoto
jQuery圖片處理

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

糖餅selecthttp://aui.github.io/popupjs/doc/selectbox.html
flexselect
雙select
select2http://select2.github.io

46- -------取色外掛

類似Photoshop 的介面取色外掛
jquery color
取色外掛程式集合
farbtastic 圓環＋方塊

47 --------城市連動

jquery.cityselect.js基於jQuery+JSON的省市或自訂連動效果

48--------剪貼簿

剪貼簿
不是Flash的剪貼簿

49--------簡繁殖

簡繁殖

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

facebook表格http://facebook.github.io/fixed-data-table
#類似於Excel編輯表格-handsontable
bootstrap-table插件
datatables

51--------線上示範

js 線上編輯- runjs
js 線上編輯- jsbin
js 線上編輯- codepenhttp:/ /codepen.io
js 線上編輯- jsfiddle
java 線上編輯- runjs
js 線上編輯- hcharts
js 線上編輯- jsdm
sql 線上編輯- sqlfiddle
mozilla 線上編輯器

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

Html5 VideoPlayer

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

Proton煙火http://a-jie.github.io/Proton/#example

54--------Nodejs

Node.js 套件教不包會
nodejs定時任務
一個nodejs部落格
【NodeJS 學習筆記04】新聞發布系統
過年7天樂，學nodejs 也快樂
七天學會NodeJS
Nodejs學習筆記（二）-- -事件模組
nodejs入門
angularjs nodejs
從零開始nodejs系列文章http://blog.fens.me/series-nodejs
理解nodejs:4bd98440-45e4-4a9a-8ef7-0f7ecbdd56cb
nodejs事件輪詢
node入門
nodejs cms
Node初學者入門，一個全面的NodeJS教程

NodeJS的程式碼調試和效能調優

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

Javascript高效能動畫與頁面渲染
行動H5前端效能最佳化指南
給網頁設計師與前端開發者看的前端效能最佳化
複雜應用的CSS 效能分析與最佳化建議
張鑫旭－前端效能
web前端效能優化進階路
前端技術：網站效能優化CSS無圖片技術
網頁載入中的圖片效能最佳化
Hey－前端效能
YSLOW中文介紹
轉一篇Yahoo關於網站效能優化的文章，兼談本站要做的最佳化
Yahoo!團隊實作分享：網站效能
網站效能優化指南：什麼使我們的網站變慢？
網站效能優化實踐，減少載入時間，提高使用者體驗
淺談網站效能優化 前端篇
前端重構實務如何對網站效能優化？
前端效能優化：使用媒體查詢加載指定大小的背景圖片
網站效能係列博文
加載，不只是少一點點

分享網頁加載速度優化的一些技巧？

頁面載入中的圖片效能最佳化
【高效能前端1】高效能HTML
【高效能前端2】高效能CSS
由12306談談網站前端效能與後端效能最佳化
AlloyTeam－前端最佳化
毫秒必爭，前端網頁效能最佳實務
網站效能工具Yslow的使用方法
前端工程與效能最佳化（上）：靜態資源版本更新與快取

前端工程與效能最佳化（下）：靜態資源管理與模板框架

HTTPS連接的前幾毫秒發生了什麼
Yslow
YUISlide,針對行動裝置的動畫效能最佳化http://jayli.github.io/blog/data/2011/12/23/yuislide.html
讓網站提速的最佳前端實踐
Why Website Speed is Important
Need for Speed – How to Improve your Website Performance
阿里無線前端效能最佳化指南(Pt.1 載入期優化

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

JavaScript 效能分析新工具OneProfile
JavaScript 堆記憶體分析新工具OneHeap

57--------線上工具

阿里-免費測試服務
Ali-F2etest多瀏覽器相容性測試解決方案
js效能測試

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

技術架構
前端架構http://saito.im/note/The-Architecture-of-F2E
如何成為前端架構師
關於前端架構-張克軍
百度騰訊offer比較（騰訊遊戲VS百度基礎架構）

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

fgmhttp://www.fgm.cc/learn
岑安作品集
當耐特demo集合http://kmdjs.github.io
米空格js作品
SeaJS元件庫http://panxuepeng.github.io/seajslib
顏海鏡作品
腳兒網路作品
javascript個人作品
妙味的雷東昇遊戲作品
javascript作品集
雲五筆，灰階產生生成工具
專案首頁http://koen301.github.io
個性的作品首頁
智能社
實例陳列架
jyg 遊戲案例
很多jquery外掛程式
不羈蟲- soJs 作品系列
frozenuihttp://frozenui.github.io/ case.html
黑白棋http://js-game.github.io/othello
fromonehttp://yansm.github.io/fromone/index.html

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

pazguillehttp://pazguille.me

61--------履歷範本

#不錯的個人履歷http: //learnshare.github.io/about/index.html
簡歷http://hcy2367.github.io/resume
簡歷
翁天信
動畫方式的簡歷
組件豐富簡歷
haorooms部落格
Justin Young

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

那幾個月在找工作（百度，網易遊戲）
2014最新面試題
2016學校招內推-- 阿里巴巴前端-- 三面面試經驗
年後跳槽那點事：樂視+金山+360面試之行
拉勾網js面試題
前端面試
前端開發面試題
2014最新前端面試題
百度面試
前端開發面試題
5個經典的前端面試問題
如何面試一名前端開發工程師？
前端實習生面試總結
史上最全前端開發面試問題及答案整理
BAT及各大互聯網公司2014前端筆試面試題：JavaScript篇
前端開發面試題大收集
收集的前端面試題和答案
如何面試前端工程師
前端開發面試題
牛客網-筆試面經

63--------iconfont

中文字體
淘寶字庫
字體
製作教學
zhangxinxu-icommon
icommonhttps://icomoon.io/app
用字體在網頁中畫ICON圖示(推薦教學
字型壓縮工具

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

IntelliJ IDEA 簡體中文專題教學
SublimeText
Atomhttps://atom. io
visual studio code

65--------Fiddler

Fiddler調試使用知多少(一)深入研究
微信fiddle
微信fiddle

66--------Chrome

Chrome - 基礎
Chrome - 進階
Chrome - 效能
Chrome - 效能進階
Chrome -移動
Chrome - 使用技巧
Chrome - Console控制台不完全指南
Chrome - Workspace使瀏覽器變成IDE
network面板
chrome開發工具快捷鍵
chrome調試工具常用功能整理
Chrome 開發工具Workspace 使用

Chrome神器Vimium快捷鍵學習記錄

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

chrome調試canvas
chrome profiles3
chrome的調試
查看事件綁定
神器－Chrome開發者工具
奇趣百科效能最佳化(Chrome DevTools 中的Timeline Profils等工具使用介紹
https://xinranliu.me/2015-05-22-qiqu-performance
chrome 開發者工具的15 個小技巧
Chrome開發者工具不完全指南http:// 1ke.co/course/361
Chrome 開發者工具使用技巧

67--------Firebug

firebug影片教學
firefox 模擬器
Firebug入門指南
Firebug控制台詳解

68--------行動,微信偵錯

瀏覽器端偵錯安卓https://openstf.github.io
行動端前端開發偵錯
mac行動裝置偵錯
mac行動裝置偵錯
無線偵錯攻略http://thx.github.io/mobile/debugging-in-mobile
無線偵錯攻略
屌爆了,完美調試微信webview(x5
微信調試的那些事
遠端console
微信調試工具http://blog.qqbrowser.cc
各種真機遠端調試方法總結

69--------iOS Simulator

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

#70--------img

loading img
智圖-圖片優化平台http://zhitu.isux.us
線上png優化

# 71--------產生二維碼

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

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

puer
liveReload
f5
File Watchers

73--------線上PPT製作

nodePPThttp://js8.in/ 2013/11/16/%E6%8E%A8%E8%8D%90nodeppt%EF%BC%9A%E4%BD%BF%E7%94%A8markdown%E8%AF%AD%E6%B3%95%E6 %9D%A5%E5%86%99%E7%BD%91%E9%A1%B5ppt
PPT
reveal
slippy

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

前端導航
前端網址導覽
前端名錄
前端導覽http://123.jser.us
前端開發資源
前端開發倉庫- 眾多效果的收集地
前端資源導航
F2E 前端導覽http://f2e.im/static/pages/nav/index.html

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

新浪CDN
百度靜態資源公共庫
360網站衛士常用前端公共庫CDN服務
Bootstrap中文網開源專案免費CDN 服務
開放靜態檔案CDN - 七牛
CDN加速- jq22
jQuery CDN
微軟CDN

76--------Git

git-scm
廖雪峰-Git教學

#git-for-windowshttps://git-for-windows.github.io
GitHub 加SSH keyshttp://daemon369.github.io/git/2015/03/10/add-ssh-keys-for- github
gogithub
git常規指令練習http://pcottle.github.io/learnGitBranching
git的資料整理
我所記錄的git指令（非常實用）
企業開發git工作串流模式探索部分休息

GitHub 漫遊指南
GitHub秘技
使用git和github進行協同開發流程

77--------優秀JavaScript專案

Angular與Webpack種子檔案
Fis3面向前端的工程建置系統
Fis3 DEMO
前端JQuery系列:原始碼剖析
avalon框架
Microsoft ChakraCore 微軟的Chakra引擎
Quintus HTML遊戲引擎
一個用node.js搭建的有趣部落格
Web前端助手--FeHelper（Chrome擴充）
百度前端技術學院
Cheerio（node.js中的jQuery）
nodejs的一個聊天軟體類似微信
使用html5和node.js建構的網易雲音樂
babel ES6轉換為ES5
一個JS富文本編輯器
一個JS腦圖視覺化工具
一個JS寫的Flappy Bird Game
一個JS寫的GBA模擬器
SegmentFault寫的Markdown解析器
基於node.js的Ghost部落格
學習react的demos

以上是匯總前端網站資源的詳細內容。更多資訊請關注PHP中文網其他相關文章！