时间:2023-06-24 09:44:14 点击次数:12
0. 前端自动化
前端构建工具
[gulp – The streaming build system](https://gulpjs.com/)
[grunt – the JavaScript Task Runner](https://gruntjs.com/)
前端模块管理器
[Bower – A package manager for the web](https://bower.io/)
[Browserify](http://browserify.org/)
[Component](https://github.com/componentjs/component)
[Duo](http://duojs.org/)
[RequireJS](http://requirejs.org/)
[Sea.js](http://seajs.org/)
css预处理器
[Less – Less is More , Than CSS](http://lesscss.org/)
[Sass – Syntactically Awesome Style Sheets](http://sass-lang.com/)
[Stylus – Expressive, dynamic, robust CSS](http://stylus-lang.com/)
1. 前端框架
[Bootstrap](https://github.com/twbs/bootstrap)
[Foundation](https://github.com/zurb/foundation-sites)
[Amaze UI](http://amazeui.org/)
[Semantic UI](https://github.com/semantic-org/semantic-ui)
[Pure CSS](https://purecss.io/)
[topcoat](https://github.com/topcoat/topcoat)
[UIkit](https://github.com/uikit/uikit)
[Material UI](https://github.com/mui-org/material-ui)
[Framework7](http://framework7.io/)
[mui](https://github.com/dcloudio/mui)
[ionic framework](https://ionicframework.com/)
[Fries](https://github.com/jaunesarmiento/fries)
[jQuery Mobile](http://jquerymobile.com/)
2. JavaScript 框架汇总
JavaScript 框架
[Angular](https://github.com/angular/angular)
[jQuery](https://github.com/jquery/jquery)
[Backbone.js](https://github.com/jashkenas/backbone)
[Ractive.js](https://github.com/ractivejs/ractive)
[KISSY](https://github.com/kissyteam/kissy)
[Zepto.js](https://github.com/madrobby/zepto)
[Vanilla JS]()
[Avalon](https://github.com/RubyLouvre/avalon)
轻量级JavaScript框架
[Min.js – Super minimal selector and event library](https://github.com/remy/min.js)
[skel.js – A lightweight responsive framework](https://github.com/ajlkn/skel)
JavaScript 工具库
[underscore.js](https://github.com/jashkenas/underscore)
[Way.js – 双向数据绑定库](https://github.com/gwendall/way.js)
[Keys.js – 应用快捷键](https://github.com/bitwalker/keys.js)
3. 前端游戏框架
[cocos2d-html5](https://github.com/cocos2d/cocos2d-html5)
[Egret Engine](https://www.egret.com/)
[LimeJS](https://github.com/digitalfruit/limejs)
[EaselJS](https://github.com/CreateJS/EaselJS)
[three.js](https://github.com/mrdoob/three.js)
[AlloyStick](https://github.com/AlloyTeam/AlloyStick)
[The-Best-JS-Game-Framework](https://github.com/finscn/The-Best-JS-Game-Framework)
[CanvasEngine](https://github.com/RSamaium/CanvasEngine)
[Quintus](https://github.com/cykod/Quintus)
4. ui组件库
[GMU](https://github.com/fex-team/GMU)
[NEC](http://nec.netease.com/)
[NEJ](http://nej.netease.com/)
[Pure CSS Components](https://github.com/LFeh/css-components/)
[magic-of-css](https://github.com/adamschwartz/magic-of-css)
5. 基础模版
[HTML5 BOILERPLATE](https://github.com/h5bp/html5-boilerplate)
[Modernizr](https://github.com/Modernizr/Modernizr)
[Normalize.css](https://github.com/necolas/normalize.css/)
6. 排版
[yue.css](https://github.com/lepture/yue.css)
[typo.css](https://github.com/sofish/typo.css)
7. 网格系统
[grid](https://github.com/aekaplan/grid)
[Flexbox Grid](https://github.com/kristoferjoseph/flexboxgrid)
8. HTML5 API 应用
[History.js – gracefully supports the HTML5 History/State APIs](https://github.com/browserstate/history.js)
[jquery-pjax – pushState+ajax](http://www.luoxiao123.cn/go/?url=https://github.com/defunkt/jquery-pjax)
[jquery-address – Deep Linking](https://github.com/asual/jquery-address)
[Notify.js(Web Notifications API)](https://github.com/alexgibson/notify.js)
9. UA 识别
[Detector](https://github.com/hotoo/detector)
10. 表单处理
10.1 表单验证(Form Validator)
[Validator](https://github.com/niceue/nice-validator)
[Parsley](https://github.com/guillaumepotier/Parsley.js)
[jquery.form.js – jQuery Form Plugin](https://github.com/jquery-form/form)
[Validform](https://github.com/haiercdboy/Validform)
[validator.js](https://github.com/sofish/validator.js)
[formvalidator.js](https://github.com/victorjonsson/jQuery-Form-Validator)
[Fort.js – 表单填写进度提示](https://github.com/idriskhenchil/Fort.js)
10.2 < select > 相关
[Chosen](https://github.com/harvesthq/chosen)
[Select2](https://github.com/select2/select2)
[bootstrap-select](https://github.com/silviomoreto/bootstrap-select)
10.3 单选框/复选框相关
[iCheck – 增强复选框和单选按钮](https://github.com/fronteed/iCheck)
10.4 上传组件
[jQuery File Upload Plugin](https://github.com/blueimp/jQuery-File-Upload)
[百度 Web Uploader](http://fex-team.github.io/webuploader/)
[Uploadify](http://www.uploadify.com/)
[Plupload](https://github.com/moxiecode/plupload)
[arale-upload – 轻量级 iframe and html5 file uploader](https://github.com/aralejs/upload)
[Dropzone.js – drag’n’drop library拖拽上传](https://github.com/enyo/dropzone)
[flow.js](https://github.com/flowjs/flow.js)
10.5 日期选择
[Both Date and Time picker widget based on twitter bootstrap](https://github.com/smalot/bootstrap-datetimepicker)
[GMU 日历组件]()
[Mobiscroll](https://github.com/acidb/mobiscroll)
10.6 取色
[Colorpicker plugin for Twitter Bootstrap](https://github.com/farbelous/bootstrap-colorpicker)
10.7 标签插件(Tag)
[TaggingJS – 可以灵活定制的 jQuery 标签系统插件](https://github.com/sniperwolf/taggingJS)
11. 图表绘制
[Highcharts](https://github.com/highcharts/highcharts)
[Chart.js – Simple HTML5 Charts using Canvas](https://github.com/chartjs/Chart.js)
[百度 ECharts](https://github.com/apache/incubator-echarts)
[Chartist.js](https://github.com/gionkunz/chartist-js)
[D3.js – A JavaScript visualization library for HTML and SVG.](https://github.com/d3/d3)
[intro-to-d3 – a D3.js tutorial](https://github.com/square/intro-to-d3)
12. 日期格式化
[Moment.js](http://momentjs.com/)
[Smart Time Ago – 显示相对时间](https://github.com/pragmaticly/smart-time-ago)
13. 页面交互
13.1 Slider
[slick – the last carousel you’ll ever need](https://github.com/kenwheeler/slick/)
[Swipe – the most accurate touch slider](https://github.com/thebird/Swipe)
[Swiper – Most modern mobile touch slider](https://github.com/nolimits4web/Swiper)
[iscroll – Smooth scrolling for the web](https://github.com/cubiq/iscroll)
13.2 瀑布流
[Masonry](https://masonry.desandro.com/)
[Isotope – Filter & sort magical layouts](https://isotope.metafizzy.co/)
13.3 图片懒加载/加载监听
[imagesLoaded](https://github.com/desandro/imagesloaded)
[Echo.js](https://github.com/toddmotto/echo)
[lazySizes](https://github.com/aFarkas/lazysizes)
[jquery_lazyload](https://github.com/tuupola/jquery_lazyload)
[lazyload.js](https://github.com/vvo/lazyload)
[waitForImages – 图片加载监听库](https://github.com/alexanderdickson/waitForImages)
13.4 图片轮播/展示
[FlexSlider](https://github.com/woocommerce/FlexSlider)
[unslider – 小而美的轮播库](https://github.com/idiot/unslider)
[prettyPhoto](https://github.com/scaron/prettyphoto)
13.5 图片剪裁
[croppic – an image cropping jquery plugin](https://github.com/sconsult/croppic)
13.6 进度条
[NProgress.js](http://ricostacruz.com/nprogress/)
[progress.js](https://github.com/usablica/progress.js)
[Pace – Automatic page load progress bar](https://github.com/HubSpot/pace)
[jquery-ajax-progress](https://github.com/englercj/jquery-ajax-progress)
13.7 侧滑插件(offcancas)
[pushy – a responsive off-canvas navigation menu](https://github.com/christophery/pushy)
13.8 菜单(Menu)
[SuperFish – 基于jQuery的级联下拉菜单](https://github.com/joeldbirch/superfish)
[Responsive Nav – 响应式导航](https://github.com/viljamis/responsive-nav.js)
13.9 滚动侦测(ScrollSpy)
[jquery-scrollspy(1)](https://github.com/sxalexander/jquery-scrollspy)
[jquery-scrollspy(2)](https://github.com/thesmart/jquery-scrollspy)
[Waypoints](https://github.com/imakewebthings/waypoints)
13.10 滚动加载更多
[jScroll](https://github.com/pklauzinski/jscroll)
13.11 平滑滚动插件(Smooth Scroll)
[jquery-smooth-scroll](https://github.com/kswedberg/jquery-smooth-scroll)
[jquery.scrollTo – 平滑滚动到页面指定位置](https://github.com/flesler/jquery.scrollTo)
13.12 全屏滚动
[pagePiling.js – 全屏滚动效果](https://github.com/alvarotrigo/pagePiling.js)
13.13 分屏滚动
[multiscroll.js – 分屏滚动效果](https://github.com/alvarotrigo/multiscroll.js)
13.14 转场效果
[Animsition – 页面切换时的过渡效果](https://github.com/blivesta/animsition)
13.15 固定元素(Sticky)
[sticky – jQuery Plugin for Sticky Objects](https://github.com/garand/sticky)
[jquery.pin – 固定页面元素](https://github.com/webpop/jquery.pin)
13.16 触控事件
[Hammer.JS](https://github.com/hammerjs/hammer.js)
13.17 拖拽组件
[Draggabilly – 专注于拖拽功能的 JS 库](https://github.com/desandro/draggabilly)
13.18 隐藏或展示页面元素
[Headroom.js – 在不需要页头时将其隐藏](http://www.bootcss.com/p/headroom.js/)
[Readmore.js – 内容显示与隐藏插件](https://github.com/jedfoster/Readmore.js)
13.19 滚动条
[jScrollPane](https://github.com/vitch/jScrollPane)
13.20 视差滚动(Parallax Scrolling)()
[parallax.js](https://github.com/wagerfield/parallax)
[jparallax](https://github.com/stephband/jparallax)
14. 代码高亮插件/代码编辑器
[google-code-prettify]()
[highlight.js](https://highlightjs.org/)
[Rainbow](https://craig.is/making/rainbows)
[ACE](https://github.com/ajaxorg/ace)
[CodeMirror](https://github.com/codemirror/codemirror)
[Crayon Syntax Highlighter](https://github.com/aramk/crayon-syntax-highlighter)
[prism – Lightweight, robust, elegant syntax highlighting.](https://github.com/PrismJS/prism)
15. UI Icon 组件
[Font Awesome](https://fontawesome.com/icons?d=gallery)
[Glyphter: The SVG Font Machine](https://glyphter.com/)
[Perfect Icons](http://perfecticons.com/)
[iconizr](https://iconizr.com/)
[Cikonss – 纯CSS实现的响应式Icon](http://www.bootcss.com/p/cikonss/)
[Simple Icons](https://github.com/simple-icons/simple-icons)
16. 动画
[animate.css – A cross-browser library of CSS animations.](https://github.com/daneden/animate.css)
[Transit – CSS transitions and transformations for jQuery](https://github.com/rstacruz/jquery.transit)
[Move.js – 简化CSS3动画的JS库](https://github.com/visionmedia/move.js)
[ScrollMe – 在网页中加入各种滚动动画效果](https://github.com/nckprsn/scrollme)
[Effeckt.css – A Performant Transitions and Animations Library](https://github.com/h5bp/Effeckt.css)
[NEC动画库](http://nec.netease.com/library/category/)
[csshake – CSS classes to move your DOM](https://github.com/elrumordelaluz/csshake)
[magic – CSS3 Animations with special effects](https://github.com/miniMAC/magic)
[Hover.css](https://github.com/IanLunn/Hover)
[css-loaders](https://github.com/lukehaas/css-loaders)
[SpinKit](https://github.com/tobiasahlin/SpinKit)
17. 本地存储
[cross-storage – Cross domain local storage](https://github.com/zendesk/cross-storage)
[localForage](https://github.com/localForage/localForage)
[pouchdb](https://github.com/pouchdb/pouchdb)
[basil.js](https://github.com/Wisembly/basil.js)
18. 模板引擎
[mustache.js](https://github.com/janl/mustache.js)
[Handlebars.js]()
[artTemplate](https://github.com/aui/art-template)
[baiduTemplate](https://github.com/wangxiao/BaiduTemplate)
[JSRender](https://github.com/BorisMoore/jsrender)
[EJS – JavaScript Templates](https://github.com/tj/ejs)
[Juicer – A Light Javascript Templete Engine.](https://github.com/PaulGuo/Juicer)
[Tempo](https://github.com/twigkit/tempo)
[json2html](https://github.com/moappi/json2html)
19. 通知组件/弹框组件
[alertify.js](https://github.com/fabien-d/alertify.js)
[AlertifyJS](https://github.com/MohammadYounes/AlertifyJS)
[SweetAlert](https://github.com/t4t5/sweetalert)
[Messenger – 非常酷的弹框组件](https://github.com/HubSpot/messenger)
[PNotify](https://github.com/sciactive/pnotify)
20. 提示控件(Tooltips)
[qTip2 – Pretty powerful tooltips](https://github.com/qTip2/qTip2)
[tooltip – CSS Tooltips](https://github.com/HubSpot/tooltip)
[tooltipster – A jQuery tooltip plugin](https://github.com/iamceege/tooltipster)
[grumble.js – 气泡形状的提示(Tooltip)控件](https://github.com/jamescryer/grumble.js)
[Ouibounce – 离站提示控件](https://github.com/carlsednaoui/ouibounce)
21. 对话框/弹出层(lightbox)
[fancyBox – Fancy jQuery lightbox](https://github.com/fancyapps/fancyBox)
[jquery-lightbox – The popular lightbox script, ported to jQuery](https://github.com/krewenki/jquery-lightbox)
[Colorbox – a jQuery lightbox](https://github.com/jackmoore/colorbox)
[artDialog – 经典的网页对话框组件](https://github.com/aui/artDialog)
[DialogEffects](https://github.com/codrops/DialogEffects)
22. 文档/表格
[handsontable – 在线可编辑excel表格](https://github.com/handsontable/handsontable)
[jQuery Bootgrid – 用于ajax生成动态表格](https://github.com/rstaib/jquery-bootgrid)
[DataTables – Table plug-in for jQuery](https://github.com/DataTables/DataTables)
23. 目录树插件
[zTree_v3 – jQuery Tree Plugin](https://github.com/zTree/zTree_v3)
[jstree – jQuery Tree Plugin](https://github.com/vakata/jstree)
[fancytree – Tree plugin for jQuery](https://github.com/mar10/fancytree)
24. Ajax模块
[fetch – A window.fetch JavaScript polyfill](https://github.com/github/fetch)
[reqwest – browser asynchronous http requests](https://github.com/ded/reqwest)
[minAjax.js](https://github.com/argunner/minAjax.js/)
25. 音频/视频
[jPlayer – HTML5 Audio & Video for jQuery](https://github.com/jplayer/jPlayer)
[video.js – HTML5 & Flash video player](https://github.com/videojs/video.js)
[Accessible HTML5 Video Player – PayPal 开源的 HTML5 视频播放器](https://github.com/paypal/accessible-html5-video-player)
[Clappr – 开源的Web视频播放器](https://github.com/clappr/clappr)
[Plyr – A simple HTML5 media player](https://github.com/sampotts/plyr)
[FitVids.js – A lightweight, easy-to-use jQuery plugin for fluid width video embeds.](https://github.com/davatron5000/FitVids.js)
[BigVideo.js – The jQuery Plugin for Big Background Video](https://github.com/dfcb/BigVideo.js)
[BigScreen – A simple library for using the JavaScript Full Screen API](https://github.com/bdougherty/BigScreen)
[Vide – 视频背景](https://github.com/VodkaBears/Vide)
[winamp2-js](https://github.com/captbaritone/winamp2-js)
26. 按钮
[Buttons – A CSS button library](https://github.com/alexwolfe/Buttons)
[ButtonComponentMorph](https://github.com/codrops/ButtonComponentMorph)
[ProgressButtonStyles](https://github.com/codrops/ProgressButtonStyles)
[CreativeButtons](https://github.com/codrops/CreativeButtons)
[CSS3 buttons](https://github.com/ubuwaits/css3-buttons)
27. 富文本编辑器/Markdown编辑器/Markdown解析器
[Simditor – 简单快速的富文本编辑器](https://github.com/mycolorway/simditor)
[BachEditor – 一个有情怀的编辑器](https://github.com/Integ/BachEditor)
[bootstrap-markdown](https://github.com/toopay/bootstrap-markdown)
[marked – markdown解析器](https://github.com/markedjs/marked)
28. 内容提取(Readability)
[Readability]()
[json.human.js – Json Formatting for Human Beings](https://github.com/marianoguerra/json.human.js)
29. 颜色(CSS Colors)/SVG
[CSS Colours](http://colours.neilorangepeel.com/)
[SVGeneration](http://www.svgeneration.com/)
30. 实用工具/其他插件
[jquery-cookie](https://github.com/carhartl/jquery-cookie)
[FastClick – 处理移动端 click 事件 300 毫秒延迟](https://github.com/ftlabs/fastclick)
[screenfull.js – 全屏切换](https://github.com/sindresorhus/screenfull.js)
[Async.js – 异步操作](https://github.com/caolan/async)
[html2canvas – 实现纯JS网页截图](https://github.com/niklasvh/html2canvas)
[jquery.qrcode.js – 生成二维码的 jQuery 插件](https://github.com/jeromeetienne/jquery-qrcode)
[FocusPoint.js 实现图片的响应式裁剪](https://github.com/jonom/jquery-focuspoint)
[DD_belatedPNG.js – 让IE6支持透明PNG图片](http://www.dillerdesign.com/experiment/DD_belatedPNG/)
[nakedpassword – 用脱衣女帮助检测密码强度](https://github.com/platform45/nakedpassword)
前端参考集
[frontend-guidelines – Some HTML, CSS and JS best practices.](https://github.com/bendc/frontend-guidelines)
[Codrops – Useful resources](https://github.com/codrops)
[Front-end Code Standards & Best Practices](https://isobar-us.github.io/code-standards/)