前端资料整理，其中包含手册/工具、常用组件/插件、框架/库、方案荟萃/常见问题、资料/书籍/教程、博客/社区、电子读物/公众号/微博号、活动/会议、Demo等

网址收藏

手册/工具

手册

• HTML ：
  Html.spec、
  Html特殊字符编码对照表、
  HTML5标签速查

• javascript ：
  Jquery、
  JqueryAPI(css88)、
  JqueryAPI(官网)、
  Javascript、
  Javascript秘密花园、
  ES5、
  ES6

• CSS ：
  Css手册、
  Css参考文档、
  Ctrip webkitcss、
  Css3动画手册

• Markdown ：
  Markdown 语法说明、
  Markdown 简明语法手册、
  Markdown 公式指导手册

• 技术图谱 ：
  Platform、
  WebFrontEndStack、
  Frontend Knowledge Structure

• 综合 ：
  Overapi、
  Devdocs、
  Apidocs

工具

• IDE/编辑器 ：
  Sublimetext、
  Webstorm、
  Atom、
  Notepad++、
  Vim、
  Visual Studio、
  HBuilder、
  Dreamweaver、
  Eclipse、
  Editplus、
  Xcode、
  Aptana、
  Coding、
  Brackets

• Markdown编辑器 ：
  Cmd Markdown 编辑阅读器、
  在线编辑器

• 浏览器 ：
  Chrome、
  Firefox、
  IE、
  Safari、
  Opera

• 代码美化/对照 ：
  Fehelper、
  CodeCompare、
  Jscompress、
  Css Beautifier、
  Csscomb、
  Cssfmt

• css处理 ：
  Less(中)、
  Less(英)、
  Less工具est、
  Sass、
  Sass中文文档、
  Stylus、
  Cssgrace、
  Cssreset、
  Postcss、
  Css2less、
  Sublime-Autoprefixer、
  Purifycss、
  Css小工具、
  Css3pie、
  Csslint、
  IE’s css3

• 图片压缩/合并 ：
  Placehold、
  Tinypng、
  Gopng、
  Spritegen、
  Spritecow、
  Zhitu

• 在线制作 ：
  Css3generator、
  Caret、
  Cssarrow、
  Css-Triangle-Generator、
  Css3maker、
  Cubic-Bezier、
  Ceaser、
  Css3button、
  Enjoycss、
  Createcss3、
  Flexyboxes、
  Type-scale、
  Gradient-Editor、
  Csscreator、
  Keyframes Calculator、
  Bootstrap Layoutit、
  FormStyleGenerator

• 转换工具 ：
  Img to Txt、
  Px-Em、
  Onlinefontconverter、
  Freefontconverter、
  Daxiaoxie、
  繁简字体转换、
  Liantu(二维码)、
  Puretext（富文本粘贴为纯文本）、
  Ps to Css、
  Gif-Video、
  Html-Markdown、
  Html-Pdf

• 项目管理 ：
  Grunt、
  Gulp、
  Webpack、
  Fis、
  Npm、
  Packagecontrol

• 版本控制 ：
  Svn、
  Git

• 检测/测试 ：
  IETester、
  IE官方测试大礼包、
  w3c css验证、
  w3c html验证、
  Jslint、
  Html5 Outliner、
  Typetester、
  Nth-test、
  Webfonts、
  Css3test

• 多终端检查/测试 ：
  Responsinator、
  Resizemybrowser、
  Responsive、
  Juicer、
  Responsivepx、
  Browsersync、
  Mobile Validator(移动端代码检测)、
  Mihtool

• 兼容/性能/数据查询 ：
  Screensiz、
  Caniuse、
  Whatwebcando、
  Browserhacks、
  Csstriggers、
  Modernizr、
  Css4-selectors、
  腾讯大数据、
  友盟指数、
  cnzz数据中心

• 性能测试 ：
  Httpwatch、
  Fiddler、
  Gtmetrix、
  Webpagetest、
  Pagespeed

• 综合 ：
  Frontend-tools、
  Fetool、
  Testdrive、
  Tool.css-js、
  Cleancss、
  Atool、
  在线工具大全、
  前端工具集与站点整理、
  Adobe一家、
  设计和前端工具集合

• 其他 ：
  截屏测量UI距离、
  自动刷新浏览器、
  web开发各种性能工具

代码在线演示

Jsfiddle、
Jsbin、
Jsdo it、
Cssdesk、
Runjs、
Online-Code-Editor、
Ideone、
Codepen、
Dabblet

常用组件/插件

• 综合：
  Dowebok、
  KitJs、
  Effeckt
• 触屏滚动：
  TouchSlide、
  Swiper、
  Owlcarousel、
  Superslide2、
  iSlider、
  FullPage、
  Zepto.fullpage
• 日期选择器：
  jquery-frontier-calendar、
  datetimepicker、
  pickadate、
  flipclockjs、
  jq-timeTo、
  glDatePicker、
  calendarsPicker
• 图表：
  Echarts、
  Highcharts(中)、
  Highcharts(英)、
  Jscharts、
  Chart、
  Taucharts
• 弹出层：
  sweetalert、
  animatedModal、
  layer
• 其他：
  下拉刷新、上拉加载 、
  懒加载、
  textarea自适应高度、
  多行文本溢出clamp-js、
  多行文本溢出dotdotdot、
  Letter-by-Letter、
  html5shiv(低版本浏览器的HTML5支持)、
  jquery-placeholder、
  Js复制

框架/库

• UI：
  Bootstrap(英)、
  Bootstrap(中)、
  Yui、
  Foundation、
  Jeasyui、
  Metroui、
  Semantic、
  Purecss、
  Basscss、
  Jqueryui、
  Css3lib、
  Uikit
• js：
  Jquery、
  Zeptojs、
  Angularjs(英)、
  Angularjs(中)、
  Angularjs社区、
  React(英)、
  React(中)、
  Jslite、
  validate表单验证、
  Vuejs官方论坛、
  Backbonejs、
  Avalonjs、
  Thinkjs、
  Expressjs、
  Seajs
• 动画库：
  Animate、
  Anicollection、
  Cssshake、
  Animatable、
  Hover、
  Animations、
  JXAnimate、
  Spinkit、
  Velocity动画、
  AlloyStick骨骼动画引擎、
  Rocket、
  Cssynth、
  Stylie、
  Animo-js、
  Anima、
  Magic_animations、
  Dynamicsjs、
  Anijs、
  Motio、
  Snabbt、
  Textillate、
  Animsition、
  Parallax、
  FakeLoader、
  Wow、
  Bouncejs、
  Move、
  Easie、
  iGrowl、
  Morf、
  Transit、
  Greensock
• 字体图标：
  Loveiconfonts、
  Glyphter、
  Perfecticons、
  Xiconeditor、
  Fontello、
  Iconfont、
  Icomoon、
  Font-Awesome、
  Glyphicons、
  Google Material Design
• 资源库：
  百度静态资源共享库、
  Taobaonpm、
  Bootcdn、
  Javascripting、
  Microjs、
  TodoMVC

方案荟萃/常见问题

方案荟萃

• 布局：
  垂直居中、
  css完全居中、
  居中之美、
  Flexbugs、
  Retina屏1px线、
  多行溢出省略、
  textarea高度自适应、
  页面高度100%、
  网页中的底部foot定位
• 移动端：
  腾讯移动web整体解决方案、
  腾讯移动web前端知识库、
  移动界面尺寸规范、
  点击事件背景框、
  支付宝无线开发经验、
  saber移动web解决方案、
  响应式还是分开写、
  移动端position:fixed问题、
  MetaHandler（网易移动前端适配无痛脚本）
• 其他：
  IF IE ENDIF条件判断之IE10、
  Chrome 翻译插件、
  网页retina优化、
  常用meta、
  树状菜单、
  em vs rem、
  css vs js、
  css解决方案（w3cplus）、
  Textures生成纹理、
  CSSgram、
  [Csscss（检查重复声明等）(http://zmoazeni.github.io/csslib/)]

  常见问题

• 前端指路：
  写给前端面试者（w3cplus）、
  如何成为一名卓越的前端工程师（勾三股四博客）、
  什么是全栈工程师、
  如何跟上前端开发的最新前沿、
  浏览器的工作原理、
  移动前端开发和 Web 前端开发的区别、
  大型网站CSS编写与维护、
  CSS核心技术关键字
• 性能/规范/实践：
  如何阅读W3c规范(王晓轩)、
  如何阅读W3c规范(高博)、
  雅虎web性能优化军规、
  前端规范、
  codeguide、
  权威前端性能指南、
  ecomfe-spec、
  Code Review、
  jquery 使用实践、
  高性能css、
  MDN-Guide、
  BEM、
  BEM-w3cplus、
  NEC、
  JavaScript Style Guide、
  Css-Code-Review、
  Css Frontend Guidelines、
  Node Style Guide、
  React Style Guide、
  Code Guide By Materliu、
  Google设计规范
• 问答社区：
  知乎、
  quora、
  stackoverflow、
  segmentfault问答区、
  前端乱炖问答区

资料、书籍、教程

资料

Awesomes、
Awesome-css、
Awesome-css中文版、
Awesome-javascript中文版、
Webdesignrepo（很棒的英文网址导航）、
wwwhere、
Nodejs中文资料导航、
AngularJS信息资源大全、
Angular学习资源合集、
cNodejs、
ES6 overview、
百度IFE、
前端收藏夹、
Github资源收集、
Responsive resources响应式大全

书籍

• HTML：
  HTML 5与CSS 3权威指南(上册)(第2版)、
  HTML5秘籍(第2版) 、
  HTML5与CSS3基础教程(第8版)
• CSS：
  CSS权威指南(第3版)、
  精通CSS:高级Web标准解决方案(第2版) 、
  CSS禅意花园(修订版) 、
  CSS设计指南（第3版）、
  CSS-Secrets、
  精彩绝伦的CSS、
  图解CSS3:核心技术与案例实战、
  CSS3秘籍(第3版)、
  CSS3实战、
  众妙之门:精通CSS3、
  CSS那些事儿
• Javascript：
  JavaScript高级程序设计(第3版)、
  JavaScript权威指南(第6版)、
  JavaScript DOM编程艺术(第2版) 、
  JavaScript语言精粹(修订版)、
  编写可维护的JavaScript 、
  JavaScript模式、
  JavaScript函数式编程、
  JavaScript框架设计、
  锋利的Jquery、
  jQuery权威指南(第2版)、
  React:引领未来的用户界面开发框架、
  用AngularJS开发下一代Web应用、
  AngularJS权威教程、
  深入浅出Node.js、
  Node.js 官方文档中文版(kindle)、
  Node学习指南 、
  了不起的Node.js: 将JavaScript进行到底、
  ppk谈JavaScript
• 综合：
  编写高质量代码:Web前端开发修炼之道、
  Web前端开发最佳实践、
  高性能网站建设指南:前端工程师技能精髓、
  高性能网站建设进阶指南：Web开发者性能优化最佳实践、
  Web全栈工程师的自我修养、
  重构：改善既有代码的设计
• 在线书籍：
  前端开发手册、
  前端开发笔记、
  Git Community Book 中文版、
  react-webpack-cookbook、
  A Compact React Cookbook 、
  Webpack中文指南、
  ES6入门、
  Eloquentjavascript、
  nodejs入门 （英）、
  nodejs入门 （中）、
  sublime手册
• 参考书单：
  程序员必读书单、
  oozled-books、
  免费的编程中文书籍索引、
  front-end-books-recommend、
  list of javascript books

  教程

• 综合：
  慕课网、
  codeschool、
  codecademy、
  codewars、
  百度前端技术学院、
  w3school、
  runoob、
  busy前端工作室、
  hackr
• 浏览器：
  Chrome基础功能篇、
  Chrome进阶篇、
  Chrome 性能篇、
  Chrome 性能进阶篇、
  Chrome Chrome 移动篇、
  Chrome 插件篇
• IDE/编辑器：
  快乐的sublime、
  Sublime Text 3使用心得、
  Sublime Text3使用总结、
  Sublime Text 3实用功能和常用快捷键收集、
  Sublime Text 全程指南、
  Sublime学习资源、
  Colorsublime配色、
  Sublime-text-github、
  Vim常用插件、
  Atom编辑器快捷键大全
• 版本控制工具：
  Git、
  版本管理工具介绍—Git篇、
  Git 使用规范流程、
  够用一年的Git 技巧、
  Git速查表大全、
  Git tutorials
• lib/布局：
  HTML+CSS基础课程、
  网页布局基础、
  固定层效果、
  回到顶部效果、
  CSS Sprite雪碧图应用、
  CSS深入理解之line-height、
  CSS深入理解之overflow、
  CSS深入理解之float浮动、
  CSS深入理解之absolute、
  Css3-Tutorial、
  Flexbox、
  Flexboxfroggy(小游戏)、
  Atozcss、
  Css-101、
  Cssplay
• javascript：
  JavaScript 标准参考教程（alpha）、
  Jstherightway、
  Superherojs、
  Javascriptissexy、
  Try-Jquery
• 动画：
  CSS动画实用技巧、
  数学知识在CSS动画中的应用、
  全屏切换效果、
  animation rocks
• Sass：
  Sass入门篇、
  Sass进阶篇、
  Sass-Guideline中文网
• Canvas：
  Canvas教程（MDN）、
  Canvas API方法和属性汇总、
  倒计时效果Canvas绘图与动画基础、
  Canvas绘图详解、
  Canvas玩转图像处理
• svg：
  svg系列文章、
  走进SVG
• markdown：
  markdown入门大全、
  markdown教程

  博客社区

  中文综合

  w3c中国、
  w3help、
  w3cplus、
  w3ctech、
  css88、
  div.io、
  前端观察、
  前端乱炖、
  大前端、
  一流前端、
  web前端资源网、
  前端早读课、
  前端开发博客、
  segmentfault、
  IE10开发人员指南、
  blueidea、
  极客标签、
  HTML5中国、
  HTML5学堂、
  imweb、
  前端里、
  前端范、
  最虾米、
  web技术研究所、
  w3cmark、
  w3ctrain、
  web资料站

  英文综合

  smashingmagazine、
  htmldog、
  slideshare、
  MDN、
  csszengarden、
  css-tricks、
  dev opera、
  sitepoint、
  codrops、
  html5devconf、
  webdesignerdepot、
  sixrevisions、
  github、
  oreilly、
  tutorialzine、
  getawesomeness、
  html5rocks、
  tutsplus、
  tutorialrepublic、
  quackit、
  html5andbeyond、
  blogs.windows、
  scotch、
  webresourcesdepot、
  perfectionkills、
  oozled、
  softwareengineeringdaily

  国内团队

  奇舞团、
  携程UED、
  百度FEX、
  迅雷CUED、
  腾讯Alloyteam、
  腾讯TGideas、
  腾讯TID、
  腾讯CDC、
  腾讯ISUX、
  淘宝UED、
  淘宝前端团队、
  1号店MXC、
  大搜车团队、
  alimama、
  微信企业号、
  美团技术团队、
  微博UDC

  国内个人

  winter、
  css森林、
  twinsen、
  尤小右 、
  阮一峰、
  张鑫旭、
  余果、
  贤心、
  大猫、
  franky、
  前端农民工、
  sofish、
  玉伯、
  拔赤、
  堂主、
  嗷嗷、
  一丝、
  一丝new、
  米粽粽、
  勾三股四、
  贺师俊、
  张克军、
  真阿当、
  doyoe、
  css魔法、
  99css、
  Toobug、
  随机、
  三水清、
  严清、
  justjavac、
  叶小钗、
  米随随、
  进步博客、
  练小习、
  小胡子哥、
  情封、
  任平生、
  当耐特、
  豪情、
  小李刀刀、
  Lucida、
  屈光宇、
  luopq、
  涂鸦码龙、
  夏天的森林、
  汤姆大叔、
  老赵、
  三生石上、
  司徒正美、
  丸子、
  阿肆、
  梦想天空、
  ALSOTANG’S、
  马天翼、
  黄玄、
  珍妮、
  丁小倪、
  题叶、
  桑尼真、
  melonh、
  怿飞、
  水墨寒、
  党建、
  zibin、
  materliu、
  笨笨剥壳、
  hzlzh、
  萝卜、
  元彦、
  鬼道、
  白树、
  前端小武、
  spy、
  轩枫阁、
  西门的后花园、
  草依山、
  于江水、
  苏洋、
  周文彬、
  颜海镜、
  崔凯、
  彬Go、
  龙恩0707、
  alien、
  乐小希、
  Dtao、
  hacke2、
  trigkit4、
  dead-horse、
  一米、
  凯凯刘、
  王牧天、
  淡忘~浅思、
  武方博、
  阿安、
  rex、
  羡辙、
  busy

  国外个人

  fullPage.js作者 alvarotrigo、
  《css权威指南》、《精彩绝伦的css》作者，著名css专家 Eric Meyer、
  Flexbugs创建者 philipwalton、
  精通CSS：高级Web标准解决方案 作者之一 cameron moll、
  精通CSS：高级Web标准解决方案 作者之一 andy budd、
  《css secret》作者 Lea Verou、
  Jquery作者 JohnResig 、
  《Javascript高级程序设计》作者 Nicholas C. Zakas、
  IE’s css3作者 useragentman、
  《Learning JavaScript Design Patterns》作者 addyosmani、
  High Performance JavaScript 作者 Nicholas Zakas、
  HTML5 Boilerplate 发起人之一 Paul Irish、
  主要是 JavaScript API Peter Koch、
  JSLint、《语言精粹》作者 Douglas Crockford、
  前 Google，现 Twitter Dustin Diaz、
  Chrome team 成员 Alex Russell、
  ejohn、
  davidwalsh、
  《CSS设计指南》作者 Charles Wyke-Smith

  设计

• 设计名站：
  站酷、
  优设、
  昵图网、
  懒人图库、
  千图网、
  独创意、
  视觉中国、
  idesign设计导航
• 配色方案：
  colorhexa、
  webcolourdata、
  colourlovers、
  color-wheel、
  peise、
  websafecolors

  IT行业

  infoq、
  伯乐在线、
  异步社区、
  推酷、
  久艾分享

  技术刊物、公众号、微博号

  技术刊物

  百度FEX、
  奇舞周刊、
  好东西论坛、
  技术头条、
  javascriptweekly、
  html5weekly、
  feweekly、
  懒懒小报

  公众号

  前端早读课、
  w3ctech、
  w3cplus、
  busy、
  前端开发知识、
  前端周末、
  前端开发博客、

  微博号

• 前端：
  webrebuild、
  jsconfchina、
  cssconf、
  css小组、
  (http://weibo.com/baidujs">js小组]、
  前端技术分享网、
  网易杭州前端技术部、
  w3ctech、
  专注web前端开发、
  移动web前端设计、
  F2E前端技术社区、
  前端开发网站、
  前端开发博客、
  divio前端社区、
  慕课网前端学习小组、
  前端网、
  前端大全、
  前端交流、
  前端早读课、
  SegmentFault、
  w3cplus、
  w3c中国、
  HTML5中国、
  HTML5、
  HTML5kit、
  w3cmark、
  前端乱炖、
  前端快爆、
  前端网W3cfuns
• 设计：
  优秀网页设计、
  UI中国、
  UC优视RED设计中心、
  腾讯CDC体验设计、
  交互设计UI
• 综合：
  稀土圈、
  技术头条、
  好东西传送门

  活动、会议

  活动

  前端圈走进名企、
  Segmentfault D-DAY

  会议

  Webrebuild、
  Cssconf、
  Jsconf、
  Adc·阿里技术嘉年华、
  Feday、
  D2前端技术论坛

  Demo

  Demo

  demo.doyoe、
  one-div、
  w3cplus-demo-list、
  一些有意思小demo、
  ShapesOfCSS、
  css-loaders、
  loaders、
  26字母、
  css-cursor