poetries / mywiki

:books:收集整理日常发现的好资源、前端资源汇总。关注公众号「前端进阶之旅」，一起学习

收录日常发现的好的文章和资源>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

缓解疲劳的网站

• Calm
• donothingfor2minute
• A Soft Murmur

时间笔记项目管理

• 为知笔记
• 番茄时间管理
• 奇妙清单-解决问题：明确每日工作目标和清单
• trello-清单管理系统
• 高效To Do-解决问题：每日待办的轻重缓急一目了然
• 坚果云-解决问题：工作资料的同步备份和快速搜索
• 永硕e盘：在线网络硬盘--拥有自己独立二级域名，小额存储数据非常方便
• Pocket-解决问题：工作时间看到的好内容收集
• XMind
• 百度脑图
• processon
• 幕布：便捷的在线思维工具--简直不能再爱
• Teambition-项目管理
• 小书匠
• stackedit

参考类

• 秀米 XIUMI | 秀米 XIUMI
• 易企秀|免费移动场景应用自营销管家
• 云来·**最大的移动APP云服务提供商

---

导航类

• 前端

  • 一个很酷炫的前端网站搜集器--推荐
  • 最牛前端
  • 大前端
  • 前端导航网址
  • 前端开发仓库
  • 前端收藏夹
  • F2E 前端导航 - 前端工程师专用的导航
  • 菜鸟教程
  • 菜鸟导航
  • 前端工程师专用的导航站
  • 各种框架汇总
  • 伯乐在线
  • fks_chart
  • 前端工具汇集

• 速查表

  • 开发者速查表
  • Linux命令搜索引擎

• 大数据

  • 大数据工具导航

• 设计

  • 设计导航
  • admire-每天发现一个好链接
  • 优设网导航
  • 专注于PPT设计的导航站
  • 图灵创意导航
  • 网站设计-自动给出最佳配色
  • 用户体验导航
  • 产品经理运营导航
  • 图标管理  

• 综合

  • 优秀网站集结地
  • 静态网页生成工具-把md文件生成网页
  • github emoji提交表情
  • 计算机学习笔记-优秀

---

在线学习好去处

• 国内：

  • 实验楼
  • 慕课网
  • 网易云课堂
  • 极客学院

• 国外：

  • 可汗学院
  • coursera
  • codeschool
  • Edx

分类

• ToolBox
• Front-End-develop-Tools
• Blog-国内前端博客
• HTML
• CSS
• Javascript
• UED
• UI
• VPN
• IP-Info
• 设计-ICON资源
• 前端工程构建
• 实用参考手册
• 兼容性
• 移动前端开发
• 性能
• 数据管理
• 在线代码运行
• 插件库
• 常用组件
• sublime专题
• Sublime常用插件总结
• 速查表
• 常用库与框架的使用文档
• 编码规范
• Git--SVN-Github
• 开发工具类
• 各大公司开源项目
• 作品集
• 程序员简历模板系列
• 很不错的在线个人简历

---

收藏面试题地址 http://interview.poetries.top，精选海量面试题型

mywiki's Issues

常用 Chrome 插件

WEB前端助手(FeHelper) - Chrome 网上应用店

FE助手：包括字符串编解码、图片base64编码、代码压缩、美化、JSON格式化、正则表达式、时间转换工具、二维码生成器、编码规范检测、页面性能检测、栅格检测、JS运行效率分析等
作者：zhaoxianlie
官网：http://www.baidufe.com/fehelper

Quick source viewer - Chrome 网上应用店

查看当前页面引入的 js 和 css

Visual Event - Chrome 网上应用店

查看绑定的 js 事件

JSView - Chrome 网上应用店

查看页面内的 js 和 css 使用

PrettyPrint - Chrome 网上应用店

查看源码的时候格式化代码

Infinity新标签页 - Chrome 网上应用店 ——首推 Infinity新标签页，基于Chrome的云应用服务，让你更优雅、轻松地使用Chrome。

DevTools Autosave - Chrome 网上应用店 ——Saves changes in CSS and JS that was made via Chrome DevTools

Wappalyzer - Chrome 网上应用店 ——查看网站使用的技术和框架

Save to Pocket - Chrome 网上应用店 —— 保存文章、视频等的最佳方式

view Source Chart --FireFox

---

• Neater Bookmarks

收藏夹插件！好用方便又简洁，刚使用 Chrome 的时候找到的，一直用到现在

• 网页截图:注释&批注

正如名字所言，就是用来网页截图的，还可以设置快捷键、保存的格式

• 阅读模式
  浏览文章的时候，点击进入沉浸式的阅读模式。可以调节背景、字体等，怎么愉快怎么来。

• 我的右键

同样强烈推荐的增强型插件，提供搜索、二维码、翻译、分享以及网络工具的功能。（在评论被推荐了一个功能更全面的，值得一试。）

---

• 浏览器插件-OK记 一款国产的设计灵感收藏工具，整体界面非常的清爽好用，兼容chrome浏览器与360浏览器。
• 浏览器插件-花瓣采集插件 花瓣采集工具与OK记类似，都是一款灵感收集的工具，我们可以使用花瓣去全网收集我们各种各样喜欢的图片

---

• Avatars for Github一句话介绍：在 GitHub feed 页展示你关注人的头像
• Axure RP Extension for Chrome一句话介绍：web 版的 Axure 客户端。
• Chrome Sniffer Plus一句话介绍：网页下的类库探测器。使用：探测当前网页正在使用的开源软件或者 JS 类库。其实一个网站或者应用，技术栈一般会涉及到很多的技术，这个扩展可以检测一些基本的开源类库，作为日常的探测够用了。
• hosts文件管理工具一句话介绍：host 管理及切换工具。
  使用：主要用来进行 ip 与 host 之间的绑定，另外可以对域名 ip 进行分组，非常适合用来进行切换环境。另外一个主要功能就是显示当前 ip ，在没有挂代理的情况下，可以显示当前页面的服务器 ip
• JSON Editor一句话介绍：JSON 在线解析及编辑器。
  使用：http://jsoneditoronline.org/ 的 chrome 扩展版本，可以用来修改 JSON 数据，并实时验证 JSON 数据的合法性，构造复杂的 JSON 数组、对象、字符串。
• JSONView一句话介绍：JSON 查看器
  使用：适合用来查看 JSON ，但是由于在解析当前页面时，如果发现是 JSON ，会再次请求一次页面，所以不适合查看、测试对多次请求结果不一致的 api 。之前写过一篇文章，介绍的就是 使用 JSONView 配合进行 Debug

前端学习方法

---

必备基础技能

前端技能汇总（https://github.com/JacksonTian/fks）这个项目详细记录 了前端工程师牵涉到的各方面知识。在具备基本技能之后可以在里面找到学习 的方向，完善技能和知识面。

frontend-dev-bookmarks（https://github.com/dypsilon/frontend-dev-bookmarks）是老外总结的前端开发资源。覆盖面非常广。包括各种知识点、工具、技术，非常全面。

以下是入门阶段应该熟练掌握的基础技能：

• HTML4，HTML5语法、标签、语义
• CSS2.1，CSS3规范，与HTML结合实现各种布局、效果
• Ecma-262定义的javascript的语言核心，原生客户端javascript，DOM操作，HTML5新增功能
• 一个成熟的客户端javascript库，推荐jquery
• 一门服务器端语言：如果有服务器端开发经验，使用已经会的语言即可，如果没有服务器端开发经验，熟悉Java可以选择Servlet，不熟悉的可以选PHP，能实现简单登陆注册功能就足够支持前端开发了，后续可能需要继续学习，最基本要求是实现简单的功能模拟，
• HTTP

在掌握以上基础技能之后，工作中遇到需要的技术也能快速学习。

基本开发工具

恰当的工具能有效提高学习效率，将重点放在知识本身，在出现问题时能快速定位并 解决问题，以下是个人觉得必备的前端开发工具：

• 文本编辑器：推荐Sublime Text，支持各种插件、主题、设置，使用方便
• 浏览器：推荐Google Chrome，更新快，对前端各种标准提供了非常好的支持
• 调试工具：推荐Chrome自带的Chrome develop tools，可以轻松查看DOM结构、样式，通过控制台输出调试信息，调试javascript，查看网络等
• 辅助工具：PhotoShop编辑图片、取色，fireworks量尺寸，AlloyDesigner对比尺寸，以及前面的到的Chrome develop tools，
• 翻墙工具：lantern, 壁虎漫步

学习方法和学习目标

方法：

• 入门阶段反复阅读经典书籍的中文版，书籍中的每一个例子都动手实现并在浏览器中查看效果
• 在具备一定基础之后可以上网搜各种教程、demo，了解各种功能的实际用法和常见功能的实现方法
• 阅读HTML，CSS，Javascript标准全面完善知识点
• 阅读前端牛人的博客、文章提升对知识的理解
• 善用搜索引擎

目标：

• 熟记前面知识点部分的重要概念，结合学习经历得到自己的理解
• 熟悉常见功能的实现方法，如常见CSS布局，Tab控件等。

入门之路

以下是入门阶段不错的书籍和资料

• HTML先看《HTML & CSS: Design and Build Websites》1-9章，然后《HTML5: The Missing Manual》1-4章。
• CSS先看《CSS: The Missing Manual》，然后《CSS权威指南》
• javascript先看《javascript高级程序设计》，然后《javascript权威指南》
• HTTP看HTTP权威指南
• 在整个学习过程中HTML JavaScript会有很多地方需要互相结合，实际工作中也是这样，一个简单的功能模块都需要三者结合才能实现。
• 动手是学习的重要组成部分，书籍重点讲解知识点，例子可能不是很充足，这就需要- 利用搜索引擎寻找一些简单教程，照着教程实现功能。以下是一些比较好的教程网址
• 可以搜索各大公司前端校招笔试面试题作为练习题或者他人总结的前端面试题还有个人总结的面试题（带参考答案）
• http://code.tutsplus.com有各种各样的教程
• MDN也有很多教程，更重要的是里面有详细的文档，需要查找某个功能时在Google搜索：xxx site:https://developer.mozilla.org
  http://www.html5rocks.com/zh/也有很多优质教程
  http://www.sitepoint.com/
  http://alistapart.com/
• 原生javascript是需要重点掌握的技能，在掌握原生javascript的基础上推荐熟练掌握jQuery，在实际工作中用处很大，这方面的书籍有《Learning jQuery》或者去jQuery官网
• 建一个https://github.com/账号，保存平时学习中的各种代码和项目。
• 有了一定基础之后可以搭建一个个人博客，记录学习过程中遇到的问题和解决方法，方便自己查阅也为其他人提供了帮助。也可以去http://www.cnblogs.com/或者http://www.csdn.net/这样的网站注册账号，方便实用
• 经常实用Google搜索英文资料应该经常找到来自http://stackoverflow.com/的高质量答案，与到问题可以直接在这里搜索，如果有精力，注册一个账号为别人解答问题也能极大提高个人能力。
• 经典书籍熟读之后，可以打开前面必备基础技能部分的链接。认真读对应标准，全面掌握知识

继续提高

有了前面的基础之后，前端基本算是入门了，这时候可能每个人心中都有了一些学习方向，如果还是没有。 可以参考前面必备技能部分提到的那两个项目，从里面选一些进行发展学习。以下是一些不错的方面：

• Grunt：前端自动化工具，提高工作效率
• less css：优秀的CSS预处理器
• bootstrap：优秀的CSS框架，对没有设计师的团队很不错，与less结合使用效果完美
• requirejs：AMD规范的模块加载器，前端模块化趋势的必备工具
• Node.js：JavaScript也可以做后台，前端工程师地位更上一步
• AngularJS：做Single Page Application的好工具
• 移动端web开发：智能手机的普及让移动端的流量正在逐步赶超PC端
• Javascript内存管理：SPA长期运行需要注意内存泄露的问题
• High Performance JavaScript(Build Faster Web Application Interfaces)
• Best Practices for Speeding Up Your Web Site：重要技能

一些学习经历

工具

• chrome dev tools：前端开发调试利器，着重注意几个功能：
• console（重要）
• elements:元素样式调整，很常用
• sources：代码中添加断点，单步调试，以及单步调试过程中查看内存中的对象
• watch expression：通过表达式查看当前内存中的值
• call stack：查看调用栈，开启async，可以看异步调用栈（这个非常有用，尤其是ajax调试的时候）
• scope variables：作用域链上的变量，非常有用
• network：抓包查看每个请求，非常重要，前后端联调必备
• timeline：分析渲染、js执行等等各个阶段，性能优化利器
• emulation：模拟移动端环境，mobile页面开发必备

一些插件:

• liveload: 修改页面后自动刷新，不用按F5
• dimensions：直接在页面上测量的利器
• livestyle：css样式修改后自动起效果，不需要刷新，elements修改后也能同步到代码中
• image tool：测量，取色
• UC二维码：移动端调试扫码必备
• pagespeed，YSlow：页面性能分析和优化插件
• 马克飞象：优秀的在线markdown编辑器，快速写周报，做记录
• sublime text2：编码方便，插件多，速度快，性能好
• emmet：提升html编码速度必备
• sublimelinter + 各种语言的lint和hint：代码纠错
• 一些snippets：自动补全，提升开发效率
• Intellij IDEA和WebStorm：集成开发环境，集成了各种功能，开发比sublime要方便，但会比较吃性能
• Mark Men：测量、取色、标注利器，拿到视觉稿之后第一个打开的软件
• GFW Fucker：我用红杏，可以的话买个虚拟服务器当梯子
• iHosts：非常优秀的hosts管理软件，轻松修改hosts，开发调试必备
• Charles：Mac 平台最好用的抓包分析工具
• Rythem：AlloyTeam出品的代理抓包软件，非常轻量，安装简单，移动端（真机）开发调试很好用
• Wunderlist：一个非常不错的Todo List，任务、需求多的时候管理起来很方便

技能

前端的技能其实除了JavaScript（包括NodeJS）、HTML、CSS以外，还有很多。其实前端的技能树很大，这里只能列一些我开发中见到的说一说

语言基础

JavaScript：

• 作用域链、闭包、运行时上下文、this
• 原型链、继承
• NodeJS基础和常用API

CSS：

• 选择器
• 浏览器兼容性及常见的hack处理
• CSS布局的方式和原理（盒子模型、BFC、IFC等等）
• CSS 3，如animation、gradient、等等

HTML：

• 语义化标签

---

进阶

JavaScript:

• 异步控制（Promise、ES6 generator、Async）
• 模块化的开发方式（AMD、CMD、KMD等等）
• JavaScript解释器的一些相关知识
• 异步IO实现
• 垃圾回收
• 事件队列

常用框架使用及其原理

• jQuery：基于选择器的框架，但个人认为不能叫框架，应该算工具库，因为不具备模块加载机制，其中源码很适合阅读钻研
• AngularJS/Avalon等MVVM框架：着重理解MVVM模式本身的理念和双向绑定的实现，如何解耦
• underscore：优秀的工具库，方便的理解常用工具代码片段的实现
• polymer/React: 组件化开发，面向未来，理解组件化开发的原理
• CSS和HTML：主要是CSS3的特性和HTML5的特性，以及浏览器处理的流程和绘制原理
• DOM树、CSSOM树、渲染树的构建流程及页面渲染的过程
• 解析HTML、CSS、JavaScript时造成的阻塞

HTML5相关

• SVG及矢量图原理
• Canvas开发及动画原理（帧动画）
• Video和Audio
• flex box布局方式
• icon fonts的使用

常用NodeJs的package：

• koa
• express
• underscore
• async
• gulp
• grunt
• connect
• request

一些理念：

• 响应式Web
• 优雅降级、渐进增强
• dont make me think
• 网页可用性、可访问性、其中的意义
• SEO搜索引擎优化，了解搜索引擎的原理
• SPA的好处和问题

性能优化：

• 减少请求数量（sprite、combo）
• 善用缓存（application cache、http缓存、CDN、localstorage、sessionstorage，备忘录模式）
• 减少选择器消耗（从右到左），减少DOM操作（DOM和JavaScript解释器的分离）
• CSS的回流与重绘

项目

• 版本管理：首推Git，用过Git都不会想用SVN了
• Git：本地版本管理的机制
• SVN：远程中心的版本管理机制
• 自动化构建：主要就是less、模板、coffee等的预处理以及对代码压缩和合并
• Gulp：基于流构建，速度快、模块质量好
• Grunt：独立任务构建，速度慢，配置蛋疼，灵活性高
• 预处理和模板引擎
• less：语法简单，但功能有限
• jade、ejs、velocity等模板引擎，各有各的长处
• coffee：python工程师最爱，还没用过
• 环境搭建：主要是将线上代码映射到本地，并在本地启动一个demo服务器，至于模拟数据的mock，见仁见智了
• 本地代理：ihosts
• 自动化测试：在业务较为稳定的情况下，可以通过自动化测试来减少测试的事件，但需求较多的时候，维护测试用例的成本会很高，可能用自动化测试会起到反效果
• jasmine
• mocha
  生态系统
• npm
• bower
• spm
  搭建一个属于自己的博客
• git pages
• hexo
• jekyll

未来

• Web Componets：面向未来的组件化开发方式
• HTML模板
• Shadow DOM
• Custom Elements
• HTML Import
• 移动端Native开发：这也是需要了解的，以后前端工程师会经常地和webview打交道，也要了解native开发

其他

有些东西不是考敲码就能弄好的，也要重视自己的素质发展

• 对于业务的思考：我个人这方面非常欠缺，所以放在最前面，在敲码前要多思考业务
  交流和沟通能力：这个非常重要，前端同时需要与项目经理、产品、交互、后台打交道，沟通不善会导致很多无用功，延缓项目
• 知识管理、时间管理：input和output的平衡，output是最好的input。如何做好分享，参与社区，做好交流，作好记录
• 对新技术的渴望，以及敢于尝试

入门书

入门可以通过啃书，但书本上的东西很多都已经过时了，在啃书的同时，也要持续关注技术的新动态。这里推几本觉着不错的书：

• 《JavaScript高级编程》：可以作为入门书籍，但同时也是高级书籍，可以快速吸收基础，等到提升再回来重新看
• 《JavaScript权威指南》：不太适合入门，但是必备，不理解的地方就去查阅一下，很有帮助
• 《编写可维护的JavaScript》和：
• 《Node.js开发指南》：不错的Nodejs入门书籍
• 《深入浅出Node.js》：Nodejs进阶书籍，必备
• 《JavaScript异步编程》：理解JS异步的编程理念
• 《JavaScript模式》和《JavaScript设计模式》：JavaScript的代码模式和设计模式，将开发思维转变到JavaScript，非常好的书
• 《JavaScript框架设计》：在用轮子同时，应当知道轮子是怎么转起来的，讲解很详细，从源码级别讲解框架的各个部分的实现，配合一个现有框架阅读，可以学到很多东西
• 《Dont make me think》：网页设计的理念，了解用户行为，非常不错
• 《CSS禅意花园》：经久不衰的一部著作，同样传递了网页设计中的理念以及设计中需要注意的问题
• 《高性能JavaScript》和《高性能HTML5》：强调性能的书，其中不只是性能优化，还有很多原理层面的东西值得学习
• 《HTML5 Canvas核心技术》：我正在读的一本书，对于canvas的使用，动画的实现，以及动画框架的开发都非常有帮助
• 《HTTP权威指南》：HTTP协议相关必备，前端开发调试的时候也会经常涉及到其中的知识
• 《响应式Web设计》：技术本身不难，重要的是响应式网页的设计理念，以及移动先行的**
• 《JavaScript语言精粹》：老道的书，也是普及JavaScript的开发思维的一本好书，非常适合入门

一些不错的网站

• github：没啥好说的，多阅读别人的源码，多上传自己的源码，向世界各地的大牛学习
• codepen：感受前端之美的必选之地，里面有很多酷炫的效果和优秀的插件
• echojs：快速了解js新资讯的网站
• stackoverflow和segmentfault：基本上各种问题都能在上面获得解答
• google web fundamentals：每篇文章都适合仔细阅读
• static files：开放的CDN，很好用
• iconfont：阿里的矢量图标库，非常不错，支持CDN而且支持项目
• html5 rocks: 一个不错的网站，很多浏览器的新特性以及前沿的技术，都能在这上面找到文章
• css tricks：如何活用CSS，以及了解CSS新特性，这里可以满足你
• JavaScript 秘密花园 JavaScript初学必看，非常不错
• w3cplus：一个前端学习的网站，里面的文章质量都挺不错的
• node school：一个不错的node学习网站
• learn git branch：一个git学习网站，交互很棒
• 前端乱炖：一个前端文章分享的社区，有很多优秀文章
• 正则表达式：一个正则表达式入门教程，非常值得一看
• 阮一峰的博客和张鑫旭的博客：快速了解某些知识的捷径，但是如果需要深挖，还需要其他的资源
• 各路大牛的博客：这个太多了，就不贴了，知乎上有很全的
• 各种规范的官方网站，不懂得时候读规范

byr论坛yiyizym的建议

• 与grunt相比，学习gulp会比较简单
• 做SPA的话，推荐backbone.js和 backbone.marionette.js
• 翻墙不用折腾，花十块钱买一个月的 红杏。
• 把基础打扎实了再学这些都没问题。
• html 没什么好说的，有空学学html5。
• css 尽量看文档 ，因为很多中文资料都各执一辞，看多了反而会糊涂。
• 有个网站可以查找html/css标签、属性在各个浏览器中的支持情况，挺好用的。
• javascript 就看 javascript高级程序设计 。不过这么厚的书看过就会忘。对javascript核心概念的讲解：对象/原型链/ 构造函数/执行上下文/作用域链/闭包/this，这里有篇不错的文章。
• 有闲情可以看看 ecmascript 6，计划明年6月就发布啦。阮一峰的网站有入门资料。
• jquery 有很多 API,这个网站可以方便查到。有时间弄清楚jquery deferred 的用法。
• 多给 sublimetext 装插件，比如说检查代码错误的，新建目录文件的，整理代码的

SqlServer2005学习笔记

数据库学习大纲

---

第一部分：数据库相关概念

什么是数据库

• 狭义:
  • 存情数据的仓库
• 广义:
  • 可以对数据进行存储和管理的软件以及数据本身统称为数据库

数据库是由表、 关系、 操作组成

为什么需要数据库

• 几乎所有的应用软件的后台都需要数据库
• 数据库存储数据占用空间小容易持久保存
• 存储比较安全
• 容易维护和升级
• 数据库移植比较容易
• 简化对数据的操作
• 为将来学习0racle做准备
• B/s架构里面包含数据库

数据库的安装和卸载

• sq12000
• 解决挂起的问题

预备知识

• 学习SqlServer2005必须的先学一门编程语言么
• 不需要,但是懂一门编程语言的话会有助于学习sqlserver2005 的TL SQ

数据结构和数据库的区别

• 数据库是在应用软件级别研究数据的存储和操作数据结构是在系统软件级别研究数据的存储和操作

什么是连接 【重点】

• 有了编程语言为什么还需要数据库
• 对内存数据操作是编程语言的强项, 但是对硬盘数据操作却是编程语言的弱项对硬盘数据操作是数据库的强项, 是数据库研究的核心同题

建议初学者从三个方面学习数据库数据库是如何存储数据的

• 字段记录表约束(主键外键唯一键非空 check default触发器)
• 数据库是如何操作数据的
  insert update delete T-SQL 存储过程函数触发器
• 数据库是如何显示数据的
  select(重点的重点)

必各的一些操作

• 如何建数据库
• 如何删除数据库
• 如何附加和分高数据库
• 设置登录用户名和密码
• 如何创建用户

数据库是如何解决数据存储问题的 【最基础内容, 必须掌握】

1.表的相关数据

• 字段
  • 一个事物的某一个特征
• 记录
  • 字段的组合表示的是一个具体的事物
• 表
  • 记录的组合表示的是同一类型事物的集合

表和字段、记录的关系

• 字段是事物的属性
• 记录是事物本身
• 表是事物的集合
• 列
  • 字段的另一种称谓
• 属性
  • 字段的另一种称谓
• 元组
  • 记录的另一种称谓

2. create table命令

• 通过图形化界面建表
  create table最后一个字段的后面建议不要写逗号说明:简単掌握后面我们会再详细的介绍

3. 什么是约束

• 定义
  • 对一个表中属性操作的限制叫做约束
• 分类
  • 主键约束
    不允许重复元素選免了数据的冗余
• 外键约束
  • 通过外键约束从语法上保证了本事物所
  • 关联的其他事物一定是存在的

事物和事物之间的关系是通过外键来体现的

• check约束
  • 保证事物属性的取值在合法的范围之内
• default约束
  • 保证事物的属性一定会有一个值
• 唯一约束
  • 保证了事物属性的取值不允许重复,,但允许其中有一列且只能有一列为空

间题:

ul,i que键是否允许多列为空?

答:

• SqlServer2005只允许一个uni que列为空
• Oracle1 IG允许多个uni que列为空

not null

• 要求用户必须的为该属性赋一个值,否则语法出错!
• 如果一个字段不写n,11也不行not n,11
• 则默认是rm11即默认允许为空,用户可以不给该字段赋值
• 如果用户没有为该字段赋值,则该字段的值默认是nd1

要注意nu11和 default的区别

• 相同点:
  • 都允许用户不赋值
• 不同点:
  • nu11修饰的字段如果用户不赋值则默认是nu1 1
  • default修饰的字段如果用户不赋値则默认是default指定的那个值

4. 表和约束的异同

• 数据库是通过表来解决事物的存備同题的
• 数据库是通过约束来解决事物取值的有效性和合法性的问题
• 建表的过程就是指定事物属性及其事物属性各种约束的过程
• 什么是关系
  • 定义:
    表和表之间的联系
• 实现方式
  • 通过设置不同形式的外键来体现表和表的不同关系
• 分类(假设是A表和B表)
  • 一对一
    既可以把表A 的主键充当表B的外键
    也可以把表B的主键充当表A的外键
  • 一对多【重点】
    把表A 的主键充当表B的外键
    或者讲: 把A表的主键添加到B表来充当B表的外键

在多的一方添加外键

• 多对多
  多对多必须的通过単独的一张表来表示

例子

• 班级和教师
• 班级是一张表
• 教师是一张表
• 班级和教师的关系也是一张表

6. 主键

• 定义
  • 能够唯一标示一个事物的一个字段或者多个字段的组合, 被称为主键
• 主键的特点【重点】:
  • 含有主键的表叫做主键表
  • 主键通常都是整数不建议使用字符串当主體(如果主體是用于集群式服务,才可以考虑用字符串当主體)
  • 主键的值通常都不允许修改, 除非本记录被删除
  • 主键不要定义成i d, 而要定义成表名 Id或者表名_i d
  • 要用代理主键,不要用业务主键
  • 任何一张表, 强烈建议不要使用有业务含义的字段充当主键
  • 我们通常都是在表中単独添加一个整型的编号充当主键字段
  • 主键是否连续增长不是十分重要

7. 外键

• 定义:
  • 如果一个表中的若干个字段是来自另外若干个表的主键或唯一键
    则这若干个字段就是外键

注意:

• 外键通常是来自另外表的主键而不是唯一键, 因为唯一键可能为M11
• 外键不一定是来自另外的表, 也可能来自本表的主键
• 含有外键的表叫外建表, 外键字段来自的那一张表叫做主键表

问题:

• 先删主键表还是外建表?

答集: 先删外建表
如果先删主键表,会报错,因为这会导致外建表中的数据引用失败

---

第二部分：查询

査询【最重要难度最大,考试必考内容,强烈建议所有的学生都要熟练掌握査询的内容】

1.计算列

select* from emp;

• -- *表示所有的
• -- from emp 表示从emp表査询

select empno, ename from emp

seleot ename, sa1 from emp;

• select ename, sa1*12 as″年薪″ from emp;
• --as可以省略记住:″年薪″不要写成'年薪'也不要写成年薪
• select ename, sa1*12 as″年薪″, sa1″月薪″, job from emp;

select888 from emp;
--ok
-一输出的行数是emp表的行数 每行只有一个字段,

select5; --ok
-一不推荐

注意:

• 在0racle中字段的别名不允许用单引号括起来
• 但是sqlserver2005却允许,,因此为了兼容性 -最好字段别名用双引号括起来, 不要用单引号

2. distinct【不允许重复的】

select distinct deptno from emp;
--distince deptno会过滤掉重复的deptno
select distinct comm from emp;
--distinct也可以过滤掉重复的nu11 或者说如果有多个nu11只输出一个
select distinct comm, deptno from emp;-一把comm和deptno的组合进行过滤select deptno, distinct comn from emp1--error逻辑上有冲突

3. between【在某个范围】

• -一査找工资在1 500到3000之间(包括和)的所有的员工的信息
  select* from e1lIp where sa1>=1500 and sa1<=3000
  等价于
  selelit* from emp where sa1 between1500 and3000
• -一査找工资小于3ooo或大于1 5oo的所有的员工的信息select* from emp where sa1<1500 or sa1>3000
  等价于
  select* from emp where sa1 not between1500 and3000

4. in【属于若干个弧立的值】

`selectfrom emp where sa1 in(1500, 3000, 5000)等价于select from emp
where sa1=1500 or sa1=3000 or sa1=5000``

select*from emp where salnot in(1500, 3000, 5000)

• -一把sa1既不是也不是也不是的记录输出等价于

select* from enp where sa1〇1500 and sat〇3000 and sat〇5000

• -一数据库中不等于有两种表示: != <> 推荐使用第二种
• -一对或取反是并且对并且取反是或

5. top【最前面的若干个记录专属于sqlserver的语法,不可移植到其他数据库】

select top5 *from emp;
`select top15 percent* from emp;-一输出的是3个,不是2个 select top5 from emp;``` --error

6. nu11【没有值空值】

• 零和rm11是不一样的, nu11表示空值,投有值,零表示一个确定的值
• nu11不能参与如下运算: 〇 != =
• n111可以参与如下运算: is not is
• select* from emp where comm is nu11; -一输出奖金为空的员工的信息
  select* from emp where comm is not nu11;
• 一输出奖金不为空的员工的信息

select* from e叩 where comm 〇 null;-一输出为空error
select*from emp where comm !=nu11;-一输出为空error
select* from emp where comm = nu11; -一输出为空error

• 任何类型的数据都允许为 nu1 1

create table t1 (:l,lamenvarchar(20), cnt int, riqi datetime); insert into t1 values(nu1l, nu11, nu11); -0K

• 任何数字与rm1 1参与数学运算的结果永远是nu1 1
• 一输出每个员工的姓名年薪(包含了奖金) comn假设是一年的奖金
  select empno, ename, sa1*12+comm ″年薪" from emp;
• -一本程序证明了: r,u11不能参与任何数据运算否则结果永远为空
• 一正确的写法是:
  select ename, sa1*12+isnu11(comm, 0)″年薪″ from emp;
  --is null(comm, 0)如果comm是nu11就返回零否则返回comm的值

7. order by 【以某个字段排序】

• order by a, b --a和b都是升序
• order by a, b desc --a升序 b降序
• order by a desc, b -a降序 b升序
• order by a desc, b desc --a和b都是降序
• 文字描述:
  • 如果不指定排序的标准,则默认是升序升序用asc表示默认可以不写
  • 为一个字段指定的排序标准并不会对另一个字段产生影响强烈建议为每一个字段都指定排序的标准

例子:

• asc是升序的意思默认可以不写 desc是降序

select* from emp order by sa1; 一默认是按照升序排序

select*from emp order by deptno, sa1;

• -一先按照deptno升序排序,如果deptno相同,再按照sa1升序排序

  select* from emp order by deptno desc, sa1;

• -一先按deptno降序排序如果deptno相同再按照sal升序排序

• -一记住sa1是升序不是降序
  --orderby a desc, b, c, d desc只对a产生影响不会对后面的b c d产生影响

select*from emp order by deptno, sa1 desc

• -一问题: desc是否会对deptno产生影响?
• -一答案:不会
• -一先按deptno升序,如果deptno相同,再按sa1降序

8.模糊査询 【搜索时经常使用】

• 格式:
  select字段的集合 from表名 where某个字段的名字1ike匹配的条件
  匹配的条件通常含有通配符
• 通配符:
  %
  表示任意o个或多个字符
  select*from emp where enamelike'%A%'
• --ename只要含有字母A就输出
  select*from emp where enamelike'A%'
• -ename只要首字母是A的就输出
  select* from emp where enamelike'%A'
• -ename只要尾字母是A的就输出
• [这是下划线不是減号]
• 表示任意单个字符
  select* from emp where enamelike'_A%'
• -ename只要第二个字母是A的就输出

[a-f]

• a到f中的任意单个字符只能是a b c d e f中的任意一个字符
  select* from emp where
• enamelike'_[A-F]%'''-一把ename中第二个字符是A或B或c或D或E或F的记录输出

[a, f]

• a或f

[a-c]

• 不是a也不是b也不是c的任意单个字符

select* from emp where enamelike'_[A-F]%'''-一把ename中第二个字符不是A也不是B也不是c也不是D也不是E也不是F的记录输出

注意:

• 匹配的条件必须的用单引号括起来 不能省略也不能改用双引号
  通配符作为不同字符使用的同题

select* from student where namelike'%\%%' escape'\' -一把name中包含有%的输出select* from student where namelike'%\_%' escape'\' 一把name中包含有_的输出

9.聚合函数【多行记录返回至一个值通常用于统计分组的信息】函数的分类

• 単行函数

  • 每一行返回一个值

• 多行函数

  • 多行返回一个值
  • 聚合函数是多行函数

  例子:
  selectlower(ename) from emp; 一最终返回的是行1ower0是单行函数
  select max(sa1) from emp; 一返回行max0是多行函数

聚合函数的分类

• max()
  -min()
  -avg() 平均值
  -count()求个数
  -count(*)

返回表中所有的记录的个数

select count(*) from emp; -一返回emp表所有记录的个数
count(字段名)

• 返回字段值非空的记录的个数, 重复的记录也会被当做有效的记录
  select courlt(deptno) from emp;
• -一返回值是这说明deptno重复的记录也被当做有效的记录
  ``select coul,it(l1omm) from emp;`
• -一返回値是这说明 c omm为ru」1 1的记录不会被当做有效的记录
• count(distinct字段名)
  • 返回字段不重复并且非空的记录的个数

select count(distinct deptno) from emp;
-一返回值是 统计deptno不重复的记录的个数

注意的问题

• 判断如下sq1语句是否正确

select ma:x(sa1), min(sa1), count(*) from emp;--ok
select max(sa1) -最高工资″, min(sa1)″最低工资″, count(*)″员工人数″ from emp; --ok
select max(sa1), 1ower(ename) from emp; --error单行函数和多行函数不能混用
select ma;x(sa1) from emp; --ok默认把所有的信息当做一组

10. group by 【分组难点】

• 格式:
  • group by字段的集合
• 功能:
  • 把表中的记录按照字段分成不同的组

例子

• 査询不同部门的平均工资
  select deptno, avg(sa1)

as″部门平均工资⊠ from emp group by deptno

注意:

• 理解: gro·up by a, b, c的用法
• 先按a分组,如果a相同,再按b分组,如果b相同,再按c分组
• 最终统计的是最小分组的信息
• 一定要明自下列语句为什么是错误的

select deptno, avg(sa1) as″部门平均工资⊠, ename
from emp
解oup by deptno

select deptno, ename
from emp
解oup by deptno

select deptno, job, sa1
from emp
解oup by deptno, job
记住:使用了gro1」p by之后select 不能出现组内的详细信息中只能出现分组后的整体信息,

11. having【对分组之后的信息进行过滤难点】

• having子句是用来对分组之后的数据进行过滤
  因此使用having时通常都会先使用group by
• 如果没使用gro·L!p by但使用了having
  则意味着having把所有的记录当做一组来进行过滤
  极少用
  select count(*) from emp having avg(sa1) > 1000
• having子句出现的字段必须的是分组之后的组的整体信息having子句不允许出现组内的详细信息
• 尽管select字段中可以出现别名
• 但是having子句中不能出现字段的别名,
• 只能使用字段最原始的名字原因不得而知
• having和where的异同
• 相同的:
  • 都是对数据过滤,只保留有效的数据
    where和having一样,
  • 都不允许出现字段的别名,,只允许出现最原始的字段的名字,本结论在S‘11Server2005和Olracle11G都成立
• 不同:
  • where是对原始的记录过滤 having是对分组之后的记录过滤
  • where必须的写在having的前面,顺序不可颠倒否则运行出错

例子:

一把工资大于,
-一统计输出部门平均工资大于的部门的部门编号部门的平均工资select deptno, avg(sa1)″平均工资″, count(*)″部门人数″,,max(sa1) ″部门的最高工资″
from emp
where sa1 >2000 --where是对原始的记录过滤
group by deptno
having avg(sa1) > 3000 -一对分组之后的记录过滤

一判断入选语句是否正确

select deptno, avg(sal)″平均工资″, count(*)″部门人数″,,max(sa1) ″部门的最高工资″ from
emp group by deptno having avg(sa1) >3000 -一对分组之后的记录过滤 where sa1 >
2000 一一where写在了having的后面 error

12.连接査询

• 定义
  • 将两个表或者两个以上的表以一定的连接条件连接起来
  • 从中检索出满足条件的数据
• 分类

内连接【重点的重点也是难点的难点】

• 1. select... fromA, B的用法
     产生的结果:
• 行数是A和B的乘积
• 列数是A和B之和
• 或者说
  油表的每一条记录都和B表的每一条记录组合在一起形成的是个笛卡尔积
• 或者说:
  • 把B表的每一条记录都和A表的每一条记录组合在一起形成的是个笛卡尔积

注意:

select* from A, B
输出结果和
select* from B, A
是一模一样的

例子
-一输出70行11列
select* from emp, dept

2. select... from A, Bwhere... 的用法

select... from A, B --A和B可以互换
产生的簡卡尔积, 用where中的条件进行过滤
例子:
-一输出5行11列
select*
from emp, dept --dept和emp互换输出结果不变
where empno= 7369

• select... from A join B on... select... from A join B on
• SQL92标准和 SQL99标准的区别
  select... from A, B where.
select... from A join B on
  输出结果是一样

推荐使用 sQL99标准

• sq199更容易理解
• 在sq199标准中, on和,rhere可以做不同的分工
  on指定连接条件
  where对连接之后临时表的数据进行过糖

示例:

一把工资大于2000的员工的姓名和部门的名称输出 和 工资的等级
-sc1199标准明显的优于sq192

select″E″.enae,″D″.hme,″S".grade
from e叩 "E″
join dept″D″
on″E″.deptno=″D〟.deptno
Join salgrade″S″
on″E″.sa1>=″S″.1osal md"E″.sa1 <=″S″.hisal
where″E".sa1 > 2000

一把工资大于2ooo的员工的姓名和部门的名称输出 和 工资的等级-sq192标准

select″E″.en訓e,″D″.如ae,″S″.grade
from e叩 ″E″, dept"D〟, salpade″S″
where″E",sa1 > 2000  md  "E″,deptno=″D″,deptno md
(″E″.sa1>=″S″.1osa1 md -E″.sa1 <=″S″.hisa1)

5. select、 from、 where、 Join、 on、 group、 order、 top、 having的混合使用

査询的顺序

• select top....
• from A
• join B
• on....
• join C
• on....
• where,.....
• group by...
• having. , , . .
• order by.....
  例子:
• -一把工资大于的所有的员工按部门分组把部门平均工资大于的最
• -一高前个的部门的编号部门的名称部 「J平均工资的等级
• 一第一种写法

select"T″,*,  "D″,如ae,  "S″.grade
from dept″D″
join(select top2″E".deptno,  avg(sa1)″avg_sa1″
from emp″E″
join dept″D″
on″E″.deptno=″D".deptno
Join salpade″S"
on -E″.sa1 between〃S".1osa1 nd″S".hisa1
where ⊠E".sa1 > 1500
group by ⊠E″.deptno
having avg(″E〟.sat) > 2000
order by avg("E".sat) desc
) ″T″
on"D〟.deptno=″T″.deptno
imer join salgrade″S"
on″T".″avg_sa1" between"S″.1osa1 nd"S″.hisa1

• 一第二种写法

select″T-.*, ″D-. hae, ″S".grade from dept″D″ join(select top2
deptno, avg(sa1) as″avg_sa1″ from emp where sa1 > 1500 group by
deptno having avg(sa1) > 2000 order by″avg_sa1″ desc ) ″T″
on″D″.deptno=″T″.deptno Join salgrade″S" on″T".″avg_sa1″
between″S″.1osa1 nd″S″,hisal

6. 习题

• 判断以下语句输出是几行
  select'l: from emp, dept where emp.deptno= 10
select* from emp, dept where dept.deptno= 10
• -一过滤条件不是连接条件

考虑如何把
selelit:* from emp, dept where dept.dept:lio= 10 以sq199标准来输出

1>求出每个员工的姓名部门编号薪水和薪水的等级
2>査找每个部门的编号该部门所有员工的平均工资平均工资的等级
3>査找每个部门的编号部门名称该部门所有员工的平均工资平均工资的等级
4>求出emp表中所有领导的信息
5> 求出平均薪水最高的部门的编号和部门的平均工资
6>把工资大于所有员工中工资最低的前3个人的姓名工资部门编号部门名称工资等级输出

自连接

• 定义

  • 一张表自己和自己连接起来査询数据

  例子

• 不准用聚合函数求薪水最高的员工的信息

联合

• 定义
  • 表和表之间的数据以纵向的方式连接在一起
  • 注意: 我们以前讲的所有的连接是以横向的方式连接在一起的

例子:

• 输出每个员工的姓名工资上司的姓名

select"E1″,enae,″E1″.sa1, ″E2″.en訓e″上司的姓名″ from emp″E1″ Join emp″磁″ on"E1".m解 =″E2″.empno uni on select ename, sa1, '已是最大老板' from emp where mgr is nul1

注意:

• 若干个select子句要联合成功的话,必须的满足两个条件
  • 这若干个select子句输出的列数必须是相等的
  • 这若干个se1 ect子句输出列的数据类型至少是兼容的

identity【主键自动增长,用户不需要为identity修饰的主键赋值】
用户如何手动给被i dent i ty修饰的主键赋值不重要

表中删除数据后又插入数据会导致主键不连续递增 怎么办?
主键是否连续增长不十分重要

视图

• 为什么需要视图

示例

• 求出平均工资最高的部门的编号和部门的平均工资
• 总结:
  • 简化査询
  • 避免了代码的冗余
  • 避免了书写大量重复的sq1语句
• 什么是视图
• 视图从代码上看是一个select语句
• 视图从逻辑上看被当做一个虚拟表看待
• 如何创建视图

create view视图的名字
as
-se1 ect的前面不能添加begin
select语句
-se1 ect的后面不能添加end

注意的问题

• 创建视图的 se1 ec t语句必须的为所有的计算列指定别名
  -error
  create view v$_a
  as
  select avg(sa1) from emp;

-ok
create view v$_a

as
select avg(sa1) as ⊠avg_sa1″ from emp;

• 视图不是物理表,是虚拟表
• 不建议通过视图更新视图所依附的原始表的数据或结构
• 视图的优点
  • 简化査询
  • 增加数据的保密性
• 视图的缺点
  • 增加了数据库维护的成本
  • 视图只是简化了査询,但是并不能加快査询的速度这也是视图使用不足的地方

事务【重要】

• 初学者必须要理解的三个概念
• 事务是用来研究什么的
  • 避免数据处于不合理的中间状态
  • 转账
• 怎样保证多用户同时访间同一个数据时呈现给用户的数据是合理的
  很复杂,现在人类仍然投有设计出很好的解决办法!
• 事务和线程的关系
  • 事务是通过锁来解决并发访问的
  • 线程同步也是通过锁来解决并发访同的 synchronized

所谓并发访同是指: 多用户同时访同同一个数据

• 事务和第三方插件的关系
  • 直接使用事务库技术难度很大 很多人是借助第三放插件来实现
  • 因此我们一般人不需要细细的研究数据库中事务的语法细节
• 第三方插件要想完成预期的功能, 一般必须的借助数据库中的事物机制来实现

---

• 索引
• 存储过程游标
• TL_SQL 触发器
• 分页査询
  • 总结

假设每页显示n条记录, 当前要显示的是第m页
表名是A 主键是A_id
select top n*
from A
where A_id not in(select top (m-1)*n A_id from emp)

博客列表

大前端工具集

本篇文章记录了一枚程序猿的百宝箱。

主要内容是一些使用过的库、工具、套路或关注的前端组织等等，反正用 前端瑞士军刀 来总结这篇文章再合适不过鸟。

您可以通过以下方式联系到我：

• 微博 @聂微东
• 个人 Blog fefork.com
• 博客园 犀利的东哥
• QQ 群 214199415，群名前端 Club。PS：入群务必请提供 有内容的 git 或 blog 地址，否则进不去哈:)

---

目录

• 前端组织
• 前端博客
• 博客搭建
• CSS
• 浏览端 JS
• NodeJS
  • 推荐 Package
  • Node 学习资料
• Build 项目构建
  • Gulp 推荐包
• 精选阅读
• 前端面试
• 工具/软件
  • Web
  • APP
    • Android
    • iPhone
  • Mac
  • Linux
• Chrome 浏览器插件
• Git
• Redis
• MongoDB
• 杂七杂八
• 前端炫技-炫酷狂拽叼炸天的 Web
• 设计/交互
• 速查手册
• 小结
• TODO

正文

前端组织

虽混过外企俩家，但劳资英文这项的技能点还是灰色的...so，俺关注的站点主要以中文为主

名称	推荐指数	备注/说明
GitHub	★★★★★	劳资清楚这不是个纯粹的前端社区... 但作为全球最大的搞基社区，无数前端项目在这启航 没 Git 都不好意思面基有木有！
MDN	★★★★★	不解释，无数的资源再等着你探索
Awesomes.cn	★★★★☆	国人维护的前端资源库，深度对接到 Github
慕课	★★★★☆	大量的在线计算机课程。 虽然初、中级居多，但是不乏有巨作值得细细品尝
W3Cplus	★★★★☆	大漠(《图解 CSS3》作者)在国内的影响力杠杠的 Sass 专家级
百度 FEX	★★★★	代表作 FIS、UEditor、WebUploader、KityMinder
前端乱炖	★★★☆	前端社区太多，乱炖还算做的不错的
极客学院	★★★	和慕课类似，但是内容更杂、更丰富 PS：貌似比较新颖的教程都是收费的
Div.IO	★★★	主要内容是最新的前端库和前沿技术
腾讯全端 AlloyTeam	★★★	腾讯 Web 前端团队

前端博客

值得长期占坑的前端个人博客，都是偶经常关注的

名称	推荐指数	备注/说明
如何跟上前端开发的最新前沿	★★★★★	RT
阮一峰	★★★★★	关注多年，拜读其 ES6 系列... 虽网传靠写书进鸟阿里，但博客内容确实够丰富
粉丝日志 for 张丹	★★★★★	大爱作者写的 Node 系列
张鑫旭	★★★★★	成名多年的、高产的前端大湿

博客搭建

名称	推荐指数	备注/说明
hexo	★★★★★	快速、简洁且高效的博客框架
jekyll	★★★★	将纯文本转化为静态网站和博客
Tumblr	★★★	轻博客的祖师爷
Wordpress	★	这玩意古老到我都不想介绍鸟

_使用 hexo/jekyll + GitPage，前端搭建静态博客那是相当 easy。用 Markdown 写文章做记录，再 push 到 Git 上，分分钟高大上有木有_

CSS

名称	推荐指数	备注/说明
MetroUI	★★★★☆	好看好用，重点是样式特别、个性
LoadersCSS	★★★★☆	用 CSS 技术实现 loading 动画； 补一句，想熟悉、理解 keyframes、animation、transform、transition 的童鞋可以直接去读其源码(只有千把行代码)，读完就算出师鸟:)
WeUI	★★★★☆	一套同微信原生视觉体验一致的基础样式库 为微信 Web 开发量身设计，令用户的使用感知更加统一
PostCSS	★★★★☆	最近才知道大名鼎鼎Autoprefixer是其插件 推荐大漠的文章《PostCSS深入学习》，有关 PostCSS 不是什么？PostCSS 是什么？PostCSS 可以做什么等等问题，文章里面有答案
CSSgram	★★★★	图片滤镜库，终于可以用 CSS 在 web 上实现滤镜的效果鸟 IE不支持，不过新的移动设备支持没问题 Can I Use
HINT.css	★★★★	一款非常小巧的提示框效果
Hover.css	★★★★	很多鼠标 Hover 态的效果，可以给产品学习一下:)
csscss	★★★★	用于检查 CSS 代码冗余
purecss	★★★☆	小巧的响应式 CSS 库，Yahoo!出品

浏览端 JS

名称	推荐指数	备注/说明
requirejs	★★★★★	JS模块化是构建复杂项目的第一步 中文学习文档奉上：RequireJS 中文网
ECharts	★★★★★	好用，最关键的是支持的图表展示非常之多，强烈推荐
Swiper	★★★★★	强大的 Slider 库 其实这类效果库非常多，但文档能那么专业的就很少鸟
fullPage	★★★★☆	非常好用的全屏滑动库，看 Demo 就明白
PhotoSwipe	★★★★☆	偶常用的 js 库 官网上有这么一句很关键、重要"no dependencies"
Vuejs	★★★★☆	比较喜欢其作者... 所以劳资正在看源码学习学习
favico.js	★★★★☆	动态改变浏览器标签栏中的网站图标，非常好玩
nodePPT	★★★★	前同事三水的大作，好用必须得支持:) 用 Markdown 写 PPT，还可以 HTML 混排，上手飞快
peity.js	★★★★	jQuery的图表插件，特别cute，感觉萌萌哒 将HTML转换成一个小的<svg>饼图、圆环图、折线图等等
emojify.js	★★★★	能够将emoji关键词转换为emoji图片的JS插件 可以快速的为你的网站提供emoji表情支持
Highcharts	★★★★	Highcharts 中文网，又是一个图表库 确实功能强大，但是觉得不好看... PS：官网就做的不好看，脏脏的赶脚
NProgress	★★★★	使页面加载时有更好的loading效果
Noticejs	★★★★	一个简单的通知库，木有依赖
onepage-scroll	★★★☆	依赖 jQuery 的单页滚动库，和 fullPage 类似
videojs	★★★☆	当下视频需求都用上<video>鸟 样式和交互统一的问题交给 videojs 搞定:)
clipboard	★★★☆	仅 2KB 大小，搞定剪贴板功能，屌不屌~ 但是，Safari 不支持...
impress.js	★★☆	用来写 PPT 不错，偶也曾为其写过一篇impress.js 初体验
Cropper	★★☆	国人开发的图片裁剪库

_Swiper/PhotoSwipe/fullPage 有这仨库，微信里常见的 H5 页完全不是问题哒_

NodeJS

作为一名大前端甚至是多端，Node 绝逼是必备的一块

社区活跃、部署方便都是令我对 Node 爱不释手的主要原因

推荐 Package

这里介绍些有特色且前端有必要知道的包

名称	推荐指数	备注/说明
anywhere	★★★★★	随时随地将你的当前目录变成一个静态文件服务器的根目录
supervisor	★★★★★	监控 Node 代码，自动重启。 A supervisor program for running nodejs programs
nodemon	★★★★★	监控 Node 代码，自动重启。 Nodemon is a utility that will monitor for any changes in your source and automatically restart your server.
pm2	★★★★★	是一个带有负载均衡功能的 Node 应用的进程管理器； 是 Forever 的进阶库，想了解的可以看这篇文章《拥抱PM2》
async	★★★★☆	一个流程控制工具包，提供直接而强大的异步功能
lodash	★★★★☆	JS 工具库 Underscore.js的一个 fork 发展而来
socket.io	★★★★☆	预计 Node 的实时框架 聊天室、页游等对实时性有高要求的较适用
Mongoose	★★★★☆	让 NodeJS 更容易操作 Mongodb 数据库； 附上一篇Mongoose 学习参考文档
CNPM	★★★★☆	淘宝 NPM 镜像，提供了 NPM 同步的服务 当然可不仅仅这样，利用 CNPM 可以打造企业/个人私有的 NPM 服务 推荐篇搭建私有NPM的文章：《CNPM搭建私有的NPM服务》
koa	★★★★☆	玩 Node 都知道 express，但使用 koa 的就少很多，门槛比 Ex 稍高 通过 generator 避免繁琐的回调函数嵌套，强烈推崇 官方的文章教程
Shipit	★★★★☆	一个强大的自动化部署工具。 shipit 很多地方非常类似 gulp，他们的核心都是任务系统。
node-inspector	★★★★☆	Node 调试工具，使用起来跟 Chrome 的 JS 调试器很相似
winston	★★★★☆	Node 服务最流行的日志库之一
co	★★★★☆	用 generator 写法让异步代码同步
thenify-all	★★★★	把异步的方法变成 Promise 的 Promisifies all the selected functions in an object
PhantomJS	★★★★	一般用来做抓取截图和无界面测试 也可以用来操作 DOM 和网络监测，很好玩的库 Quick Start
Mocha	★★★★	Node 里最常用的测试框架； 它支持多种 Node 的 Assert libs； 同时支持异步和同步的测试，同时支持多种方式导出结果； 也支持直接在 browser 上跑 JS 代码测试。
everyauth	★★★★	OAuth 的集成解决方案
shelljs	★★★☆	写 Node 时难免需要用 shell 去操作些神马 shelljs 是基于 Node 的 shell 工具，API 及其简单
hashids	★★★☆	看名称就懂，给 userid 加解密用的
colors	★★☆	花俏的小工具 让打印console.log时有更好的展示样式
n	★★	控制Node的版本，想升级一行代码搞定

supervisor 和 nodemon 这俩都是监控 Node 代码，使得每次修改代码后会，开发 Node 程序必备

以上库俺都有使用过，甚至有不少都是项目开发中、各种特定场景下必用的，有任何使用问题欢迎沟通哈:)

Node 学习指南

名称	推荐指数	备注/说明
Node.js 中文资料导航	★★★★★	Node 的中文资料导航，start1300+
从零开始 NodeJS 系列文章	★★★★★	基本上每一篇都看过，强烈推荐
Node.js 包教不包会	★★★★★	值得阅读，看完绝不用买书鸟
七天学会 NodeJS	★★★★★	劳资还没看，不过看目录还不错:)

Build 项目构建

Gulp + Webpack 的使用套路参考: learning-gulp

Gulp 资料收集：use-gulp

推荐篇与 Webpack 相关的文章《CSS Modules》

Webpack 用起来吼吼：webpack-howto

名称	推荐指数	备注/说明
pm2	★★★★★	是一个带有负载均衡功能的 Node 应用的进程管理器； 是 Forever 的进阶库，想了解的可以看这篇文章《拥抱PM2》
Webpack	★★★★★	项目构建工具，由于过于复杂和太强大，所以劳资还没去深入研究。 精选阅读中有篇资料就是介绍 Webpack 和 React 的工作机制。
Gulp	★★★★★	Gulp 是基于 Node 实现 Web 前端自动化开发的工具。 学习资料附上GulpBook
Bower	★★★★☆	前端项目的包管理其实是件复杂的事 谁谁谁依赖谁谁谁，谁谁谁依赖谁谁谁的某个版本...卧槽 Bower 就是搞定这件事儿的，亲爹是 Twitter 推荐篇 Bower 的中文文章：《bower 解决 js 的依赖管理》
Grunt	★★★★☆	和 Gulp 类似，都是项目构建的常见选择 对比这俩的文章可谓不少，推荐篇《Gulp vs Grunt》 英盲又想看文档，可以去Grunt 中文网
FIS	★★★★	度厂出品的前端构建工具 文档清晰，功能强大，推荐了解和使用
Gitlab CI	★★★	一套基于Gitlab的持续集成服务

Gulp 推荐包

Gulp 最基础的库就不列在下表格中鸟，其中包括：

• gulp-concat 作用是**_连接/合并**_文件
• gulp-cssshrink CSS 文件压缩
• gulp-uglify JS 文件压缩

名称	推荐指数	备注/说明
gulp-webpack	★★★★★	webpack 与 gulp 配合，开启前端 Build 新纪元 webpack plugin for gulp
gulp-rev	★★★★☆	高大上第一步，静态文件名称变成 HASH 名称
gulp-rev-collector	★★★★☆	配合gulp-rev使用，自动用 HASH 替换模板内静态文件名
run-sequence	★★★★	Gulp 任务机制为并行，RS 使得有依赖的任务可串行执行 使用 gulp-rev 时得用 RS 配合 要不并行的生成配置和处理.html 文件不能同事生效
gulp-util	★★★★	内含一套方法库，功能太多 个人感觉更喜欢功能单一的包，不太喜欢这种大杂烩
gulp-connect	★★★★	有 reload 功能的 Run WebServer 工具 我一般用来 LivereLoad，即保存之后自动刷新页面
gulp-load-plugins	★★★★	可加载 package.json 内与 Gulp 相关的插件 省去鸟一行一行 require 的功夫咯
gulp-clean	★★★☆	移除文件或文件夹的包
gulp-replace	★★★☆	其功能看名字就知道，用做字符串替换的
gulp-autoprefixer	★★★☆	叼炸天的自动处理浏览器前缀的包 文档地址：usage
gulp-rename	★★★	把文件重命名 结构设计的好不太会用到这个
gulp-flatten	★★★	删除或替换文件的相对路径； 一般我这用来移动 img 或者其他静态文件到新目录 同上：结构设计的好不太会用到这个

精选阅读

以下内容不包括 NodeJS 和 面试相关 的，俺已经单独准备好鸟

名称	推荐指数	备注/说明
前端开发规范手册	★★★★☆	此手册主要实现的目标：代码一致性和最佳实践
ECMAScript 6入门	★★★★☆	阮一峰大神所著，一本开源的JS教程 全面介绍 ECMAScript 6新引入的语法特性
ReactNative 中文版	★★★★☆	翻译自官方的中文文档
stream-handbook	★★★★☆	如果学习 NodeJS，那么流一定是需要掌握的概念
MongoDB 极简实践入门	★★★★☆	入门推荐的套路，非常浅显易懂
ReactWebpackCookBook	★★★★☆	此书会引导读者是进入React和Webpack的世界。 俩都是非常前沿的技术，同时使用会更有趣。
Mac 设置指南	★★★★	Mac 使用必看 尤其适合 偏执狂/强迫症 患者:)
ReactNative 学习指南	★★★☆	新玩意层出不穷... 对于能持续学习的童鞋，这是个美好的时代
HTML/CSS 编码规范	★★★☆	编写灵活、稳定、高质量的HTML和CSS代码的规范
GulpBook	★★★☆	Gulp 是基于 Node 实现 Web 前端自动化开发的工具
Markdown 资料	★★★	简单看些语法入门，快速用起来

前端面试

名称	推荐指数	备注/说明
在 LinkedIn 做面试官的故事	★★★★★	非面试题，介绍 LinkedIn 的面试过程 文章有很多中肯的建议和想法，推荐阅读
大漠：写给前端面试者	★★★★★	这篇文章不涉及任何的面试题 大漠与大家聊聊面试者与被面者之间的感受...
前端面试题	★★★★☆	Git 上非常火的前端面试题，start17k+
前端面经	★★★★	主要内容是些前端面试笔试题和面试套路，值得阅读

工具/软件

Web

名称	推荐指数	备注/说明
CanIuse	★★★★★	前端必备；查看浏览器对各种新特性的兼容情况
overapi	★★★★★	最全的开发人员在线速查手册
百度脑图	★★★★☆	非常方便的思维导图工具
ProcessOn	★★★★☆	和百度脑图的功能类似，脑图工具。
VimAwesome	★★★★☆	Vim 插件集合，Vim 党必备
Tower	★★★★☆	小而美的多人协同工具。 不光只有 Web 版，还有 iPhone、iPad、Android、微信版。
Slides	★★★★☆	一个所见即所得的 WebPPT 编辑器，非常推荐
faviconer.co	★★★★	一个所见即所得的icon生成器，很好用
smallpdf	★★★★	提供各种格式和 PDF 互相转换
Cmd Markdown	★★★★	好用的 Web 版 Markdown 编辑器
StackEdit	★★★★	又是一款 Web 版 Markdown 编辑器
墨刀	★★★★	一个在线移动应用原型制作工具。 旨在帮助产品经理快速制作可在手机端展示的移动应用原型。
htm2pdf	★★★★	HTML to PDF
Speaker Deck	★★★★	在线的演讲稿展示平台

APP

以下列表中的 APP 都是不区分系统平台的

名称	推荐指数	备注/说明
印象笔记	★★★★★	免费账号完全够用，跨平台跨终端的记录软件
365日历	★★★★	首先肯定比系统自带的日历强大，要不推荐个蛋蛋 俺一般用来搞目标管理，比如学习计划和工作计划 生活中会订阅演唱会、电影首映的信息
多看阅读	★★★★	kindle 确实好，但是懒得随身带着 多看还算不错，书较多且偶尔有特价比较爽

Android

名称	推荐指数	备注/说明
小米桌面	★★★★☆	多好看、多漂亮谈不上，关键是没有广告

iPhone

名称	推荐指数	备注/说明
Surge	★★★★	非免费 牛逼的网络开发与调试工具，前端必备
Monkey	★★★★	Monkey 是 iPhone 上一个 GitHub 第三方客户端。 展示 GitHub 上的开发者的排名，以及仓库的排名

Mac

对于美好事务的追求无论何时都不算晚，前年公司给配了台 Mac 用做测试开发机，于是开始在 Mac 下办公。 Windows？ 回不去鸟...

名称	推荐指数	备注/说明
Homebrew	★★★★★	没它程序猿没法好好干活... Homebrew使OS X更完美。 使用gem来安装gems、用brew来搞定那些依赖包
iTerm2	★★★★☆	Mac 终端功能少又不好看，iTerm2 可以解救你~ 推荐篇文章：《让你的命令行丰富多彩》
BrowseShot	★★★★☆	偶正在使用的网页截图工具，强烈推荐
BeyondCompare	★★★★☆	在Windows下就开始用了 比对文件和文件夹杠杠好使，Merge必备工具
CheatSheet	★★★★	能够显示当前程序的快捷键列表，默认的快捷键是长按 ⌘
Sequel Pro	★★★★	免费好用的Mysql工具
LICEcap	★★★★	屏幕录制工具，支持导出 GIF 动画图片格式 轻量级、使用简单，录制过程中可以改变录屏范围
Manico	★★★★	快捷启动和切换 APP 的工具，高效的第一步 AppStore 上收费，不过可以免费试用
WebStorm	★★★★	功能超强的前端 IDE，不多介绍，谁用谁知道 PS：貌似俺插件装多了，用着卡卡的，风扇呼呼转...
Atom	★★★★	2015 年 7 月之前，在桌面环境下我最喜欢的编辑器是 Sublime。 但之后就是 Atom，俺也专门为它写了篇**使用纪要**
马克鳗	★★★★	MarkMan，非常强大好用的标注、测量工具。 日常工作免费版就完全可以满足，强烈推荐
Wireshark	★★★☆	说实话，Mac 下木有 Fiddler 挺不习惯，不过在有更强大的替代品
SourceTree	★★★☆	一款好用的的 Git 客户端工具，重点是支持中文:)
focus booster	★★★	因为比较在意时间管理，所以这软件是俺工作时间的必备之物
Mou	★★	小清新的 Markdown 编辑器

Linux

名称	推荐指数	备注/说明
oh-my-zsh	★★★★★	_终端党_ 必用的好工具，强烈推荐
tree	★★★★	linux 以树状图逐级列出目录的内容
oneapm	★★★★	强大的运维工具，提供多种监控客户端； 有采集、分析、展示等一套功能； PS：我这用了服务器监控(免费哦)
httpie	★★★☆	一个 CLI 中的 HTTP 客户端 用法简单、易读

Chrome 浏览器插件

名称	推荐指数	备注/说明
JSONView	★★★★★	麻麻再也不用担心偶调试接口啦
wappalyzer	★★★★☆	分析网站使用的技术 它可以检测网页的 Web 服务器、JS 框架等等
Postman	★★★★	强大的调试工具，推荐之
gitShare	★★★★	用于方便把Github项目分享到 Twitter 或 Facebook
二维码生成器	★★★★	RT
User-Agent Switcher	★★★★	模拟各种终端的 UA，达到调试目的
GitPlug	★★★☆	在 Git 项目页中嵌入有关的图表信息
Swap My Cookie	★★★☆	切换马甲非常方便
Infinity	★★☆	针对 Chrome 的插件，新标签页 会让你耳目一新

Git

名称	推荐指数	备注/说明
Git 教程-廖雪峰	★★★★☆	俺有看过不少 Git 的文章，确实这个系列是最通俗易懂的
GitAwards	★★★★	Git 工具，可以查看 Git 排名
Git 速查	★★★★	分类清晰的速查表
Git 简明指南	★★★☆	入门Git的简明指南，木有高深内容:)
Git 学习资料整理	★★★	内容包括很多 Git 的相关资料，star 1200+
GitHub 漫游指南	★★☆	一篇还算不错的 Git 学习总结，就是乱了点... 我理解作者**_漫游**_的意思是漫无目的想到哪写到哪~ 看到作者为鸟达成 Git 连击的成就，也是蛮拼的:)

Redis

MongoDB

名称	推荐指数	备注/说明
Mongoose	★★★★☆	让 NodeJS 更容易操作 Mongodb 数据库。 附上一篇Mongoose 学习参考文档

杂七杂八

放些开发中较有用的杂物在这儿

名称	推荐指数	备注/说明
租房要点	★★★★☆	适用于北上广深杭，大城市打拼租房确实是硬伤
QQ 群规	★★★★☆	突然某天，有个 QQ 群让我加群 原本我是拒绝的，但当我看完这篇 QQ 群规后... 劳资真的被感动到了，太牛逼、够专业！ 最后，我默默加群鸟:)
.gitignore 文件	★★★★☆	介绍不同语言项目的 gitignore 模板
Codebabes	★★★	学编程的网站。 重点是每通过一个测试，尼玛对应的妞会脱一件衣服... PS：要翻墙哦~
ReadmeSample	☆	项目高大上的第一步就是包装，所以来看看 README 的书写套路吧 PS：劳资怎么这么无聊...

前端炫技-_炫酷狂拽叼炸天站点_

名称	推荐指数	备注/说明
windows93	★★★★☆	模拟 Win93 桌面，思路、体验和整体效果比较有意思
GeekTyper	★★★★☆	好玩又具有 Geek 精神的网站，虽然创建的目的是个恶作剧 PS：网站需要翻墙
前端技能栈	★★★★	好玩的前端技能栈展示
Mapbox	★★★★	非常叼的开源项目，有方便的 JSAPI(还有 SDK)。 不过免费版只能浅尝，流量有限。 PS：网站需要翻墙
Clark Duvall	★★★★	一枚歪果仁的个人blog，范儿叼叼的
SuperScrollorama	★★★☆	好玩好看的动画库，链接是 SuperScrollorama 的展示页
parallax.js	★★★	一个视差引擎的官网，在电脑和手机上都有很好的体验
墨刀	★★	一个在线移动应用原型制作工具。 旨在帮助产品经理快速制作可在手机端展示的移动应用原型。

设计/交互

作为负责最终效果呈现的前端工程师，多少得了解些 设计和交互 的，这也是为什么 fetool 会单独的存在这一章...当然话又说回来了，偶毕业的第一份工作是设计:)

名称	推荐指数	备注/说明
站酷	★★★★☆	里面好东西太多，俺当年真没少再上面淘素材
UI**	★★★★	光听名字就知道有多高大上鸟:)

速查手册

RT，这篇都是些文档或者API，一般这类东西都在大家浏览器的书签内，偶这也列一下大前端常用的手册地址

名称	推荐指数	备注/说明
百度CDN公共库	★★★★☆	基本常见的库都收录拉，搞 demo 的时候特方便
HTML 和 CSS 代码规范	★★★★☆	编写灵活、稳定、高质量的 HTML 和 CSS 代码的规范
Linux命令中文手册	★★★★	木有系统的好好学习 Linux，所以命令更不熟悉 真羡慕那些CLI玩的飞起的:)
Git 速查	★★★★	分类清晰的速查表
jQueryAPI 1.11.3	★★★★	ZeptoAPI 基本和 jQuery 一样，所以看一份就好
CSS3	★★★★	CSS3 的在线手册
Express API	★★★☆	中文手册:) 4.x和3.x都有
CI用户指南	★★	一个轻量级的 PHP 框架用户指南 推荐指数低的原因是劳资PHP比较弱，囧
Yaf	★★	鸟哥(惠新宸)所写的 PHP 框架 推荐指数低的原因同上...

小结

背景

俺算个比较能自我总结的码农，所以偶尔喜欢写点东西做些记录或者自我熏陶陶醉一下。
可写着写着发现Evernote里面的东西太尼玛多(乱)了，于是想着把一些技术相关的资料都整理整理，都丢到Git上沉淀下来。 这样Evernote就可以只需要记录些偏生活方便的，看着清爽一些...

所以，这篇记录其实只是为偶自己而写，确信以后也一直会这样~~~

说说目标

其实与这篇记录类似的文章太多鸟，俺也不愿意成为一个单纯的收集资料，分享资料的这么个东西。
我希望 fetool 能更生动、更个性，最好能更另类点，对于每样工具的思考和解析更多点，吐槽也必须有理有据，然后再配上劳资收集的 low 图，完美！
希望通过不停的完善这篇记录，能Push劳资多了解业内的新玩具和新创意，然后围绕这些新东西，客观的再写点好东西，比如文章、资料、开源项目这些，让其他伙伴们少走弯路或学的更顺畅点儿

所以劳资对自己的要求是：这篇记录里列出的每样东西，自己都得的去了解、去尝试，然后再列出来。 能举一反三最好，如果达不到至少也能清楚的认识：列出来的这玩意对程序员有没有卵用，解决了啥痛点。

TODO

1. 继续完善和扩充内容
2. “备注/说明”这一栏不够犀利，希望再多加入自己的理解、点评、吐槽，让这篇记录更犀利和生动
3. 支持导出多种格式，如.pdf、.epub、.mobi等
4. 后续看看如果有必要，可以单独搞个页面，优化下阅读和展示效果

---

以下是 @拔赤 总结的前端技能图：

---

一些常用的工具

>>>>>>>点击此处进入>>>>一些常用的工具

---

JavaScript资源大全中文版

目录

• JavaScript资源大全中文版
  • 包管理器
  • 加载器
  • 打包工具
  • 测试框架
  • QA 工具
  • MVC 框架和库
  • 基于 Node 的 CMS 框架
  • 模板引擎
  • 数据可视化
    • 时间轴
  • 编辑器
  • 工具
    • 文件
    • 函数式编程
    • 响应式编程
    • 数据结构
    • 日期
    • 字符串
    • 数字
    • 存储
    • 颜色
    • 国际化和本地化
    • 类
    • 控制流
    • 路由
    • 安全性
    • 日志
    • 正则表达式
    • 媒体
    • 语言命令
    • API
    • 视觉检测
    • 浏览器检测
  • UI
    • 代码高亮
    • 加载状态
    • 验证
    • 键盘封装器
    • 浏览和引导
    • 通知
    • 幻灯片
    • 滑块控件
    • 表单组件
    • 提示
    • 模态框和弹出框
    • 滚动条
    • 菜单
    • 表格/栅格
    • 框架
  • 移动
    • 手势
    • 触摸
  • 地图
  • 视频/音频
  • 动画
  • 图片处理
  • ES6
  • SDK
  • 大杂烩
• 精品阅读
• 资源
  • 社区
  • 有影响力的书
  • 微博、微信公众号
  • 知名网站
  • 博客

---

包管理器

管理着 JavaScript 库，并提供读取和打包它们的工具。

• npm：npm 是 JavaScript 的包管理器。官网
• Bower：一个 web 应用的包管理器。官网
• component：能构建更好 web 应用的客户端包管理器。官网
• spm：全新的静态包管理器。官网
• jam：一个专注于浏览器端和兼容 RequireJS 的包管理器。官网
• jspm：流畅的浏览器包管理器。官网
• Ender：没有库文件的程序库。官网
• volo：以项目模板、添加依赖项与自动化生成的方式创建前端项目。官网 
• Duo：一个整合 Component、Browserify 和 Go 官网的最佳**，使开发者能快速方便地组织和编写前端代码的下一代包管理器。

加载器

JavaScript 的模块或加载系统。

• RequireJS：JavaScript 文件和模块的加载器。官网
• browserify：在浏览器端以 node.js 的方式 require()。官网
• SeaJS：用于 Web 的模块加载器。官网
• HeadJS：HEAD 的唯一脚本。官网
• curl：小巧、快速且易扩展的模块加载器，它能处理 AMD、CommonJS Modules/1.1、CSS、HTML/text 和历史脚本。官网
• lazyload：小巧且无依赖的异步 JavaScript 和 CSS 加载器。官网
• script.js：异步 JavaScript 加载器和依赖管理器。官网
• systemjs：AMD、CJS（commonJS） 和符合 ES6 规范的模块加载器。官网
• LodJS：基于 AMD 的模块加载器。官网
• ESL：浏览器端的模块加载器，支持延迟定义和 AMD。官网
• modulejs：轻量的 JavaScript 模块系统。官网

打包工具

• browserify ：Browserify 让你能在浏览器端使用 require('modules') ，打包所有依赖。官网
• webpack：为浏览器打包 CommonJs/AMD 模块。官网
• gulp：用自动化构建工具增强你的工作流程！官网

测试框架

框架

• mocha：适用于 node.js 和浏览器、简易、灵活、有趣的 JavaScript 测试框架。官网
• jasmine：简单无 DOM 的 JavaScript 测试框架。官网
• qunit：一个易于使用的 JavaScript 单元测试框架。官网
• jest：简单的 JavaScript 单元测试框架。官网
• prova：基于 Tape 和 Browserify 的测试运行器，它适用于 Node & 浏览器。官网
• DalekJS：自动化且跨浏览器的 JavaScript 功能测试框架。官网

断言

• chai：适用于 node.js 和浏览器的 BDD / TDD 断言框架，并能搭配其它测试框架使用。官网
• Sinon.JS：对 JavaScript 进行 spies、stubs 和 mock 测试。官网
• expect.js：简约的、适用于 Node.js 和浏览器端的 BDD 式断言工具。官网
• should.js：适用于 Node.js 的 BDD 式断言工具。官网

覆盖率

• istanbul：另一个 JS 代码覆盖率检测工具。官网
• blanket：一个简单的代码覆盖率检测库。它的设计理念是易于安装和使用，且可用于浏览器端和 node.js。官网
• JSCover：JSCover 是一个检测 JavaScript 程序代码覆盖率的工具。官网

运行器

• phantomjs：脚本化的 Headless WebKit。官网
• slimerjs：一个内核为 Gecko 的类似 PhantomJS 工具。官网
• casperjs：基于 PhantomJS 和 Slimer JS 的导航脚本和测试工具。官网 
• zombie：基于 node.js 、快速、全栈且无图形界面的浏览器的测试工具。官网
• totoro：一个简单可靠且能跨浏览器运行的测试工具。官网
• karma：一个优秀的的 JavaScript 测试运行器。官网
• nightwatch：基于 node.js 和 selenium webdriver 的图形界面自动化测试框架。官网
• intern：下一代 JavaScript 代码测试栈。官网
• yolpo：在浏览器逐句执行的 JavaScript 解释器。官网

QA 工具

• JSHint：JSHint 是一个有助于发现 JavaScript 代码错误和潜在问题的工具。官网
• jscs：JavaScript 代码风格检测工具。官网
• jsfmt：格式化、搜索和改写 JavaScript。官网
• jsinspect：检测复制粘贴和结构类似的代码。官网
• buddy.js：发现 JavaScript 代码里的 魔术数字。官网
• ESLint：完全插件化的工具，能在 JavaScript 中识别和记录模式。官网
• JSLint ：高标准、严格和固执的代码质量工具，旨在只保持语言的优良部分。官网

MVC 框架和库

• angular.js：为网络应用增强 HTML。官网
• aurelia：一个适用于移动设备、桌面电脑和 web 的客户端 JavaScript 框架。官网
• backbone：给你的 JS 应用加入带有 Models、Views、Collections 和 Events 的 Backbone。官网
• batman.js：最适合 Rails 开发者的 JavaScript 框架。官网
• ember.js：一个旨在创建非凡 web 应用的 JavaScript 框架。官网
• meteor：一个超简单的、数据库无处不在的、只传输数据的纯 JavaScript web 框架。官网
• ractive：新一代 DOM 操作。官网
• vue：一个用于构建可交互界面的、直观快速和可组合的 MVVM 框架。官网 
• knockout：Knockout 用 JavaScript 让创建响应式的富 UI 更加容易。官网 
• spine：构建 JavaScript 应用的轻量 MVC 库。官网
• espresso.js：一个极小的、用于制作用户界面的 JavaScript 库。官网
• canjs：让 JS 更好、更快、更简单。官网
• react：用于建构用户界面的库。它是声明式的、高效的和极度灵活的，并使用虚拟 DOM 作为其不同的实现。官网
• react-native：一个用 React 构建原生应用的框架。官网
• riot：类 React 库，但很轻量。官网
• thorax：加强你的 Backbone。官网
• chaplin：使用 Backbone.js 库的 JavaScript 应用架构。官网
• marionette：一个 Backbone.js 的复合应用程序库，旨在简化大型 JavaScript 应用结构。官网
• ripple：一个小巧的、用于构建响应界面的基础框架。官网
• rivets：轻量却拥有强大的数据绑定和模板解决方案官网
• derby：让编写实时和协同应用更简单的 MVC 框架，能够在 Node.js 和浏览器同时运行。官网
  • derby-awesome：很棒的 derby 组件集合。官网
• way.js：简单、轻量、持久化的双向数据绑定。官网
• mithril.js：Mithril 是一个客户端 MVC 框架（轻量、强大和快速）官网
• jsblocks：jsblocks 是一个更好的 MV-ish 框架。官网
• LiquidLava：易懂的、用于构建用户界面的 MVC 框架。官网

基于 Node 的 CMS 框架

• KeystoneJS：强大的 CMS 和 web 应用框架。官网
• Reaction Commerce：拥有实时的架构和设计的响应式（reactive） CMS。官网
• Ghost：简单、强大的发布平台。官网
• Apostrophe：提供内容编辑和基本服务的 CMS。官网
• We.js：适用于实时应用、网站或博客的框架。官网
• Hatch.js：拥有社交特性的 CMS 平台。官网
• TaracotJS：拥有快速、极简风格特点且基于Node.js 的 CMS。官网
• Nodizecms：为 CoffeeScript 爱好者准备的 CMS。官网
• Cody：拥有所见即所得的编辑器的 CMS。官网
• PencilBlue：CMS 和博客平台。官网

模板引擎

模板引擎允许您执行字符串插值。

• mustache.js：是 JavaScript 中带有 {{mustaches}} 的最简模板。官网
• handlebars.js：是 Mustache 模板语言的扩展。官网
• hogan.js：是 Mustache 模板语言的编译器。官网
• doT：最快速简洁的 JavaScript 模板引擎，适用于 nodejs 和浏览器。官网
• dustjs：适用于浏览器和 node.js 的异步模板。官网
• eco：嵌入式的 CoffeeScript 模板。官网
• JavaScript-Templates：轻量（小于 1KB）、快速且无依赖的强大 JavaScript 模版引擎。官网
• t.js：小巧的 JavaScript 模板框架，压缩后约为 400 字节。官网
• Jade：健壮的、优雅且功能丰富的 nodejs 模板引擎。官网
• EJS：高效的 JavaScript 模板。官网
• xtemplate：可扩展的模板引擎，适用于 node 和浏览器。官网
• marko：快速轻量且基于 HTML 的模板引擎，支持异步、流、自定义标签和 CommonJS 模编译后输出。适用于 Node.js 官网和浏览器。

数据可视化

Web 数据可视化工具

• d3：一个对 HTML 和 SVG 进行可视化的 JavaScript 库。官网
• metrics-graphics：更简洁和拥有更规范的数据图表布局优化算法的库。官网
• pykcharts.js：经过精心设计后，去除 d3.js 复杂性的 d3.js 图表库。官网
• three.js：JavaScript 3D 库。官网
• Chart.js：简单的、基于 canvas 标签的 HTML5 图表库。官网
• paper.js：是矢量图形脚本中的瑞士军刀 —— 使用 HTML5 Canvas 将 Scriptographer  移植到 JavaScript 官网和浏览器。
• fabric.js：JavaScript Canvas 库，SVG 与 Canvas 可以相互解析。官网
• peity：进度条、线状和饼状图。官网
• raphael：JavaScript 矢量库。官网
• echarts：商业产品图表。官网
• vis：动态的、基于浏览器的可视化库。官网
• two.js：一个渲染器无关的适用于 web 的二维绘图 api 。官网
• g.raphael：基于 Raphaël 图表库。官网
• sigma.js：一个致力于图形绘画的 JavaScript 库。官网
• arbor：一个使用 web workers 和 jQuery 的图形可视化库。官网
• cubism：可视化时间序列的 D3 插件。官网
• dc.js：与 crossfilter 无缝合作的多维图表绘制库，使用 d3.js 渲染。官网
• vega：一套可视化语法。官网
• processing.js：Processing.js 基于 Web 标准使数据可视化，而无需任何插件。官网
• envisionjs：动态的 HTML5 可视化。官网
• rickshaw：用于构建交互式实时图表的 JavaScript 工具包。官网
• flot：吸引人的、基于 jQuery 的 JavaScript 图表库。官网
• morris.js：漂亮的时间序列线框图。官网
• nvd3：一个为 D3.js 构建可复用图表和图表组件的库。官网
• svg.js：一个轻量的、用于操作和添加 SVG 动画的库。官网
• heatmap.js：基于 HTML5 canvas 的热力图 JavaScript 库。官网
• jquery.sparkline：一个直接在浏览器端生成小型走势图的 jQuery 插件。官网
• xCharts：一个基于 D3、用于构建自定义图表和图形的库。官网
• trianglify：基于 d3.js 的低多边形（low poly）风格背景图片生成器。官网
• d3-cloud：创建词云（word cloud）效果的 JavaScript 库。官网
• d4：一个基于 D3 、友好、可复用的 DSL 图表库 。官网
• dimple.js：基于 d3 的简易商业分析图表库。官网
• chartist-js：简单的响应式图表。官网
• epoch：一个通用的实时图表库。官网
• c3：基于 D3 的可复用图表库。官网
• BabylonJS：一个运用 HTML5 和 WebGL 构建 3D 游戏的框架。官网
• jquery.raty.js：一个星级评分插件。官网

也有一些很棒的收费库，如 amchart、plotly 和 highchart。

时间轴

• TimelineJS： 一个用 JavaScript 编写的可叙事时间轴库。官网
• timesheet.js：用于构建简单的 HTML5 & CSS3 时间表的 JavaScript 库。官网

编辑器

• ace：Ace（Ajax.org Cloud9 Editor）。官网
• CodeMirror：浏览器端的代码编辑器。官网
• esprima：用于综合分析的 ECMAScript 解析器。官网
• quill：一个带有 API 的跨浏览器富文本编辑器。(官网)
• medium-editor：Medium.com 所见即所得编辑器的克隆版。官网
• pen：享受在线编辑（支持 markdown）。官网
• jquery-notebook：一个易用的、简洁优雅的文本编辑器。灵感来源于 Medium 的魅力。官网
• bootstrap-wysiwyg：小巧的、兼容 bootstrap 的所见即所得的富文本编辑器。官网
• ckeditor-releases：适用于每个人的 web 文本编辑器。官网
• editor：一个 markdown 编辑器，但仍在开发中。官网
• EpicEditor：一个可嵌入的 JavaScript Markdown 官网的编辑器，拥有全屏编辑、即时预览、自动保存草稿和离线支持等功能。
• jsoneditor：查看、编辑和格式化 JSON 的 web 工具。官网
• vim.js： 拥有持久化 ~/.vimrc 的 Vim 编辑器的 JavaScript 移植版本。官网
• Squire：HTML5 富文本编辑器。官网
• TinyMCE：JavaScript 富文本编辑器。官网
• trix：由 Basecamp 制作，适用于每天写作的富文本编辑器。官网

文件

处理文件的库。

• Papa Parse：一款强大的 CSV 库，支持解析 CSV 文件/字符串，也能导出 CSV。官网
• jBinary：对用声明式语法描述文件类型和数据结构的二进制文件，进行高级 I/O（加载、解析、操作、序列化、存储）操作。官网

函数式编程

函数式编程库扩展了 JavaScript 的能力。

• underscore：JavaScript 的实用工具。官网
• lodash：提供一致性、可定制、高性能和额外功能的实用库。官网
• Sugar：一个扩展了原生对象功能的 JavaScript 库。官网
• lazy.js：类似 Underscore，但性能更优越官网
• ramda：一个针对 JavaScript 程序员的实用函数库。官网
• mout：模块化的 JavaScript 工具库。官网
• mesh：流数据同步工具。官网

响应式编程

响应式程序库扩展了 JavaScript 的能力。

• RxJs：对 JavaScript 进行响应式扩展。官网
• Bacon：JavaScript 的 FPR（函数式响应式编程）库。官网
• Kefir：受 Bacon.js 和 RxJS 启发的 FRP 库，专注于高性能和低内存消耗。官网
• Highland：对 JavaScript 实用工具的重新思考，Highland 能轻易地管理同步和异步信息，而且仅使用标准 JavaScript 和类 Node 流。官网
• Most.js：高性能 FRP 库。官网

数据结构

数据结构库用于构建一个更复杂的应用。

• immutable-js：不可变的数据集合，包括 Sequence、Range、Repeat、Map、OrderedMap、Set 和 sparse Vector。官网
• mori：使用 ClojureScript 持久化数据结构和支持原生 JavaScript API 的库。官网
• buckets：完整的、经过充分测试和记录数据结构的 JavaScript 库。官网
• hashmap：简单的 hashmap 实现，支持任何类型的键值。官网

日期

日期库。

• moment：解析、验证、操作和显示日期。官网
• moment-timezone：基于 moment.js 的时区库。官网
• jquery-timeago：一款支持自动更新模糊时间戳的 jQuery 插件（如："4 分钟之前"）。官网
• timezone-js：让 JavaScript Date 对象拥有时区功能。使用 Olson zoneinfo 文件记录着时区数据。官网
• date：拥有人性化的 Date() 方法。官网
• ms.js：小巧的毫秒转换工具。官网

字符串

字符串库。

• selecting：一个允许你获取用户选定文本的库。官网
• underscore.string：扩展了 Underscore.js 的字符串操作。官网
• string.js：额外的 JavaScript 字符串方法。官网
• he：健壮的 HTML 实体编码/解码器。官网
• multiline：多行字符串。官网
• query-string：解析和字符串化 URL 查询字符串。官网
• URI.js：URL 操作库。官网 
• jsurl：轻量的 URL 操作库。官网
• sprintf.js：实现字符串格式化。官网
• url-pattern：让 url 和其它字符串进行比正则表达式匹配更简单。字符串和数据可相互转化。官网

数字

• Numeral-js：对数字进行格式化和操作的库。官网
• odometer：流畅的数字过渡效果。官网
• accounting.js：对数字、金钱、货币进行格式化的轻量库——完全本地化和无依赖。官网
• money.js：一个小巧（1kb）的货币转换库，适用于 web 和 nodeJS。官网
• Fraction.js：一个有理数库。官网
• Complex.js： 一个复数库。官网
• Polynomial.js：一个多项式库。官网

存储

• store.js：为所有浏览器封装了 LocalStorage，而没有使用 cookies 和 flash。隐秘地使用 localStorage、globalStorage 和用户数据。官网
• localForage：改善后的离线存储。其封装了 IndexedDB、WebSQL 和 localStorage，拥有操作简单和强大的 API。官网
• jStorage：jStorage 是一个简单的键值对数据库，用于在浏览器端存储数据。官网
• cross-storage：获得权限后，能跨域名本地存储。官网
• basket.js：用 localStorage 加载和缓存脚本的资源加载器。官网
• bag.js：可以缓存脚本和加载资源，与 basket.js 相似，但增加了键值对接口和对 localStorage / websql / 官网undexedDB 的支持。
• basil.js：智能的 JavaScript 数据持久层库。官网
• jquery-cookie：轻量简单的、用于读取、编辑和删除 cookie 的 jQuery 插件。官网
• Cookies：客户端 Cookie 操作库。官网
• DB.js：基于 Promise 的、封装了 IndexedDB 的库。官网
• lawnchair.js：简单的客户端 JSON 存储。官网

颜色

• randomColor：JavaScript 颜色生成器。官网
• chroma.js：拥有各种各样颜色操作的 JavaScript 库。官网
• color：JavaScript 颜色转换和操作库。官网
• colors：更智能的默认 web 颜色。官网
• PleaseJS：随机创建出赏心悦目的颜色和配色方案。官网
• TinyColor：快速、轻巧的颜色操作和转换库。官网
• Vibrant.js：从图像提取主要颜色。官网

国际化和本地化（I18n And L10n）

本地化和国际化 JavaScript 库

• i18next：JavaScript 最简单的国际化（i18n）方法。官网
• polyglot：小巧的国际化助手库。官网
• babelfish：i18n 提供友好易懂的 API ，并且内置多种支持。官网

类

• ClassManager：世界上最快、最方便的类系统之一。官网
• klass：用于创建极富表现力的类工具库。官网
• augment：世界上最小且最快的一流 JavaScript 继承模式。官网

控制流

• async：适用于 node 和浏览器的异步工具库。官网
• q：实现异步的 promise JavaScript 库。官网
• step：让逻辑顺序合理化的异步控制流库。官网
• contra：利用函数风格实现的异步流控制。官网
• Bluebird：专注于革新功能和性能的，功能齐全的 promoise 库。官网
• when：快速可靠的、Promises/A+ 规范的 when() 实现，而且拥有异步其它的优秀特性。官网
• ObjectEventTarget：提供增加了事件监听的原型（与 DOMElement 的 EventTarget 在浏览器行为一致）。官网

路由

• director：一个小巧的、与 URL 同构的路由器。官网
• page.js：受 Express router 启发的小型客户端路由器（约为1200字节）。官网
• pathjs：简单、轻量的 web 路由器。官网
• crossroads：JavaScript 路由。官网
• davis.js：使用 pushState、RESTful 风格和可降级的 JavaScript 路由器。官网
• angular-ui-router：基于AngularJS的可嵌套路由。官网

安全性

• DOMPurify：针对 HTML、MathML 和 SVG 的仅支持DOM、快速、高容错的 XSS 过滤器。官网
• js-xss：通过白名单配置，即可过滤不信任的 HTML（防止 XSS 攻击）。官网

日志

• log：带有样式的 Console.log。官网
• Conzole：对 JavaScript 原生 console 对象方法和功能进行封装的 debug 面板，使其显示在页面内。官网
• console.log-wrapper：将日志清晰地记录到 console，且兼容所有浏览器。官网
• loglevel：最轻量的 JavaScript 日志记录工具库，向封装后可用的 console.log 方法增加可靠的日志等级。官网
• minilog：轻量的、用流式 API 显示的、可用于客户端和服务器端的日志记录库。官网

正则表达式

• RegEx101：在线的 JavaScript 正则表达式测试器和调试器。同时支持 Python、PHP 和 PCRE。官网
• RegExr：用于创建、测试和学习正则表达式的 HTML/JS  工具。官网
• RegExpBuilder：使用链式方法创建正则表达式。官网

媒体

• Ion.Sound：可用于任何网页上简单音频。官网

语音命令

• annyang：向网站添加语音命令的语音识别库。官网
• voix.js：向网站、app 或游戏添加语音命令的 JavaScript 库。官网

API

• bottleneck：强大的频率限制器，使调节流量变得更容易。官网
• oauth-signature-js：适用于 node 和 浏览器的 OAuth 1.0a 签名生成器。官网
• amygdala：为 Web 应用提供 RESTful HTTP 客户端解决方案。官网
• jquery.rest：一个让 RESTful API 更易使用的 jQuery 插件。官网

视觉检测

• tracking.js：在 web 上实现计算视觉的一种现代方法。官网
• ocrad.js：通过 Emscripten 用 JavaScript 实现 OCR（光学字符识别）。官网

浏览器检测

• bowser：一个浏览器检测器。官网

UI

代码高亮

• Highlight.js：JavaScript 语法高亮器。官网
• PrismJS：轻量、健壮和优雅的语法高亮器。官网

加载状态

指示加载状态的库。

• Mprogress.js：创建谷歌 Material 设计风格的线性进度条。官网
• NProgress：在 Ajax'y 应用显示细长型进度条官网
• Spin.js：一个旋转的进度指示器。官网
• progress.js：为页面任何对象创建和管理进度条。官网
• progressbar.js：用 SVG path 动画制作的、漂亮和响应式的进度条。官网
• pace：自动向你的网站添加一个进度条。官网
• topbar：小巧漂亮的、与网站同宽的进度指示器。官网
• nanobar：非常轻量的进度条。不依赖 jQuery。官网
• PageLoadingEffects：使用 SVG 动画展现新内容的现代方式。官网
• SpinKit：运用 CSS 动画的加载指示器集合。官网
• Ladda：内置在按钮的加载指示器。官网
• css-loaders：运用 CSS 动画的旋转加载指示器的集合。官网

除了上述这些库，还有收藏在 Codepen 的，另外还有 Ajaxload，Preloaders 和 CSSLoad 这些生成器。

验证

• Parsley.js：不用写一行 JavaScript 代码即可在前端验证表单。官网
• jquery-validation：jQuery 验证插件。官网
• validator.js：字符串验证和过滤（在使用用户输入之前清理用户输入中的有害或危险字符的操作）。官网
• validate.js：受 CodeIgniter 启发的轻量表单验证 JavaScript 库。官网
• validatr：跨浏览器的 HTML5 表单验证库。官网
• BootstrapValidator：是验证表单域中最好的 jQuery 插件。要与 Bootstrap 3 一起使用。官网
• is.js：检查类型、正则表达式、是否存在、时间等。官网
• FieldVal：多用途验证库。同时支持同步和异步验证。官网

键盘封装器

• mousetrap：处理键盘快捷键的 JavaScript 库。官网
• keymaster：定义和调度键盘快捷键的小型库。官网
• Keypress：键入捕捉工具库，任何键都可以成为一个修饰健。官网
• KeyboardJS：一个用于绑定键盘组合的 JavaScript 库，让你脱离快捷键和快捷键组合冲突的痛苦。官网
• jquery.hotkeys：jQuery Hotkeys 能让你在代码任何的地方监听键盘事件，并几乎支持所有按键组合。官网
• jwerty：令人惊叹的键盘事件处理库。官网

浏览和引导

• intro.js：这是一个介绍新功能的很好方式，能一步步地引导用户浏览你的网站和项目。官网
• shepherd：通过引导让用户浏览你的应用程序。官网
• bootstrap-tour：应用 Twitter Bootstrap 弹出框对产品进行快速简单的引导。官网
• tourist：简单、灵活的应用引导介绍库。官网
• chardin.js：简单的应用遮罩层介绍。官网
• pageguide：使用 jQuery 和 CSS3 的 web 页面元素交互引导库。官网
• hopscotch：让开发者更容易向其页面产品添加引导的框架。官网
• joyride：基于 jQuery 的功能引导插件。官网
• focusable：通过向页面其余部分添加遮罩层，使焦点聚集在特定 DOM 元素。官网

通知

• messenger：为你的应用添加 Growl-style 弹框和信息（Crowl 是 Mac OS X 下的一个通知系统）。官网
• noty：jQuery 通知插件。官网
• pnotify：适用于 Bootstrap、jQuery UI 和 Web Notifications Draft 的 JavaScript 通知库。官网
• toastr：用来显示简单的，会自动到期的信息窗口）简单的弹出框通知（toast notifications官网
• humane-js：一个简单、时髦的浏览器通知系统。官网
• smoke.js：与框架无关的、能够自定义样式的 JavaScript 弹框系统。官网

幻灯片

• Swiper：使用硬件加速过渡的移动设备触控滑块框架。官网
• slick：你所需要的最后一个轮播插件。官网
• slidesJs：响应式的 jQuery（1.7.1+）幻灯片插件，具有触摸、 CSS3 过渡等特性。官网
• FlexSlider：一款令人惊叹的、全响应式的幻灯片 jQuery 插件。官网
• unslider：最简单的幻灯片 jQuery 插件。官网
• colorbox：轻量、可自定义的灯箱 jQuery 插件。官网
• fancyBox：提供了良好优雅的方式，为页面上的图片、html 内容和多媒体添加缩放功能的工具。官网
• sly：基于项导航的、支持单向滚动的 JavaScript 库。官网
• vegas：向页面添加漂亮的全屏背景的 jQuery 插件，甚至允许幻灯片。官网
• Sequence：用于创建响应式的幻灯片、演示、旗帜广告和以步骤为基础的应用的 CSS 动画框架。官网
• baguetteBox.js：易于使用的、用纯 JavaScript 实现的遮罩层脚本。官网
• reveal.js：用 HTML 创建漂亮演示控件的框架。官网
• PhotoSwipe：适用于移动设备和桌面电脑的、模块化和不无依赖框架的 JavaScript 画廊控件。官网
• jcSlider：用 CSS 动画实现的响应式幻灯片 jQuery 插件。官网
• basic-jquery-slider：易于使用、指定主题和定制化。官网
• unslider： 这是最简单的幻灯片 jQuery 插件。官网
• viewerjs：原生js实现的图片查看器。官网
• jQuery.adaptive-slider：带有自适应颜色标题和导航的幻灯片 jQuery 插件。官网
• slidr：可添加一些幻灯片效果。官网
• Flickity：可触摸的、响应式的和可轻弹的画廊。官网

滑块控件

• Ion.RangeSlider：强大的、易于自定义的范围滑块选择库，支持很多配置和皮肤。官网
• jQRangeSlider：支持日期的滑块选择库。官网
• noUiSlider：轻量无冗余的、高度定制化的滑块选择库。官网
• rangeslider.js：HTML5  input 区域滑块元素。官网

表单组件

输入

• typeahead.js：快速的、功能齐全的自动补全库。官网
• tag-it：处理多标签字段以及标签建议/自动完成的 jQuery UI 插件。官网
• At.js：向你的应用添加类似 Github 的自动完成提示功能。官网
• Placeholders.js：JavaScript 补全 HTML5 占位符的属性。官网
• fancyInput：利用 CSS3 效果让输入更有趣。官网
• jQuery-Tags-Input：利用这个 jQuery 插件，可奇妙地将一个简单的文本输入转换成一个酷酷的标签列表。官网
• vanilla-masker：一个纯 JavaScript 实现的输入控制库。官网
• Ion.CheckRadio：一个为复选框和单选按钮添加样式的 jQuery 库，支持多种皮肤。官网

日历

• pickadate.js：对移动设备友好的、响应式的和轻量的 jQuery 日期 & 时间输入选择器。官网
• bootstrap-datepicker：基于 bootstrap 的日历选择器。官网
• Pikaday：一个崭新的 JavaScript 日期选择器 —— 轻量、无依赖和模块化的 CSS。官网
• fullcalendar：全尺寸、支持拖放事件的日历（jQuery 插件）。官网
• rome：可定制的日期（和时间）选择器。无依赖，可选 UI。官网
• datedropper： datedropper 是一个 jQuery 插件，它提供了快速简易的方式去管理日期输入框。官网

选择

• selectize.js：Selectize 是文本框和选择框的混合体。它基于jQuery，拥有自动完成和键盘感应下拉列表功能，可用于标签、联系人列表等。官网
• select2：它基于 jQuery，是选择框（select box）的替代品。支持搜索、远程数据集和无限滚动。官网
• chosen：可以让冗长不便的选择框更友好的库。官网

文件上传

• jQuery-File-Upload：File Upload 是一个支持多文件选择、文件拖放、进度条、验证和图片、音频、视频预览的 官网jQuery 插件。
• dropzone：Dropzone 是一个易于使用且支持多文件拖放的库。其支持图片预览并且拥有很好的进度条效果。官网
• flow.js：一个通过 HTML5 的 File API ，提供多个同时链接的、稳定的、容错的、可恢复的/可重新开始的文件上传库。官网
• fine-uploader：一个带有进度条、拖放功能和支持直接上传到 S3 （Amazon Simple Storage Service，亚马逊简易存储服务）的多文件上传插件。官网
• FileAPI：JavaScript 文件工具集合。支持多文件上传、拖放和文件分块上传。对于图像，支持裁剪、调整大小和根据 EXIF 自动调整方向。官网
• plupload：处理文件上传的 JavaScript 官网API，其支持多文件选择、文件类型过滤、分块请求、客户端图片缩放和根据不同的运行环境选择 HTML5、Silverlight 和 Flash。

其它

• form：jQuery 表单插件。官网
• Garlic.js：自动在本地保存表单文本和选择框的值，直到表单被提交。官网
• Countable：对某个 HTML 元素包含文本的段落数、单词数和字符数进行统计的 JavaScript 函数。官网
• card：只需一行代码，让信用卡表单变得更友好。官网
• stretchy：自适应大小的 form 元素，表单本应该是这样的。官网
• list.js：向表格、列表等 HTML 元素添加搜索、排序、过滤和自适应功能的库。在已有 HTML 上增加可视化。
  官网

提示

• tipsy：基于 jQuery 的 Fackbook 风格的提示工具（tooltip）。官网
• opentip：开源且基于 prototype 框架的 JavaScript 工具提示库。官网
• qTip2：非常强大的工具提示库。官网
• tooltipster：一个工具提示 jQuery 插件。官网
• simptip：用 Sass 制作的、简单的工具提示。官网
• jquery-popup-overlay：是一个响应式的和可访问性强的模态框（modal）和工具提示框 jQuery 插件。官网

模态框和弹出框

• Magnific-Popup：专注于性能、轻量、响应式的灯箱（lightbox）脚本。官网
• jquery-popbox：jQuery 提示框插件。官网
• jquery.avgrund.js：一种新的定于弹出的模态框 jQuery 插件。官网
• vex：新的、拥有高度可配置和易于改变样式功能的对话框库。官网
• bootstrap-modal：对 Bootstrap 默认的模态框类进行扩展。其支持响应式、可堆叠和 ajax 等。官网
• css-modal：纯 CSS 打造的模态框。官网
• jquery-popup-overlay：是一个响应式的和可访问性强的模态框和工具提示框（tooltips）jQuery 插件。官网

滚动

• scrollMonitor：滚动发生时，可以监听元素的、简单、快速的 API。官网
• headroom：除非你需要显示页面头部（header），否则将隐藏它，以腾出页面头部空间。官网
• onepage-scroll：创建一个类似 Apple 的单页面滚动网站（iPhone 5S  网站）。官网
• iscroll：高性能、轻量、无依赖、兼容多平台的 JavaScript 滚动组件。官网
• skrollr：独立（不依赖 jQuery） 的视差滚动库，适用于移动设备（Android + iOS）和桌面电脑。官网
• parallax：面向智能设备的视差引擎。官网
• stellar.js：让视差滚动变简单。官网
• plax：基于 jQuery 的视差库。官网
• jparallax：创建可交互视差效果的 jQuery 插件。官网
• fullPage：简单和易于使用的、用于创建全屏滚动网站的插件（也被称为单页面网站）。官网
• ScrollMenu：让老旧无聊的滚动条焕然一新。官网

菜单

• jQuery-menu-aim：当用户光标放在特定下拉菜单项时触发事件。可制作响应式的、大数据量的下拉菜单，如 Amazon 的。官网
• jQuery contextMenu：右键菜单（contextMenu） 管理工具。官网
• Slideout：为移动设备的 web 应用制作出响应式的、可触摸滑出的导航菜单。官网
• Slide and swipe：一个基于 touchSwipe 库的滑出菜单插件。官网

表格/栅格

• jTable：基于 CRUD 表创建 AJAX 的 jQuery 插件。官网
• DataTables：这是一个非常灵活的工具，在渐进增强的基础上，将高级的交互效果加到 HTML 表格。（jQuery 插件）官网 
• floatThead：（jQuery 插件）锁定表格头部，只允许表格内容滚动。适用于任何表格，而且不需要额外的 html 或 css。官网
• Masonry：瀑布流式的网格布局库。官网
• Packery：使用装箱算法（bin-packing）的网格布局库。支持拖拽布局。官网
• Isotope：可过滤和可排序的网格布局的库，它能实现 Masonry、Packery 等布局。官网

框架

• Semantic UI：拥有大量主题和元素的 UI 套件。官网

手势

• hammer.js：拥有多种触摸手势的 JavaScript 库。官网
• touchemulator：在桌面电脑模仿触摸输入。官网
• Dragula：超级易于使用的拖拽库。官网

触摸

• fastclick.js：去除触屏用户300ms点击延误。官网
• dropload.js：移动端下拉刷新，上拉加载更多。官网
• touchslide.js：触屏滑动特效。官网

地图

• Leaflet：对移动设备友好的、可交互的地图 JavaScript 库。官网
• Cesium：开源的、基于 WebGL 实现的虚拟地球仪和地图引擎。官网
• gmaps：以最简单的方式使用 Google 地图。官网
• polymaps：一个免费的、兼容现代 web 浏览器的、用于制作动态可交互的地图 JavaScript 库。官网
• kartograph.js：开源的 Kartograph SVG 地图渲染器。官网
• mapbox.js：Mapbox 的 API，Leaflet 的插件。官网
• jqvmap：矢量地图 jQuery 插件。官网
• OpenLayers3：高性能的、功能丰富的库，能满足你对地图所有需求。官网

视频/音频

• prettyembed.js：更完美地嵌入 YouTube —— 拥有很好的选项，如高分辨率的预览图、嵌入选项的高级定制和可选的 官网FitVids 支持。
• html5media：能在所有主流浏览器播放多媒体标签中定义的多媒体文件。官网
• Play-em JS：Play'em 是一个 JavaScript 组件，它能管理音乐/视频播放顺序，通过在一个 DIV 元素里嵌入几个播放器（Youtube、Soundcloud 和 Vimeo）来控制一系列歌曲的播放。官网
• polyplayer：将 YouTube、Soundcloud 和 Vimeo 播放器的 API 统一成一套。官网
• flowplayer： HTML5 视频播放器 官网、Github
• mediaelement：让 HTML5、 Flash 播放器和模仿 HTML5 媒介元素 API 的 Silverlight shim，在所有浏览器拥有一致的 UI。官网、Github
• SoundJS：让音频在 web 上运行更简单的库。它为不同浏览器提供了一致的 API。官网

动画

• velocity：加速 JavaScript 动画。官网
• jquery.transit：拥有超级流畅的 CSS3 变换和过渡的 jQuery 插件。官网
• impess.js：在 HTML 文档里，运用 CSS3 变换和过渡制作类似 Prezi 的展现效果。官网
• bounce.js：可以立刻创建有趣的 CSS3 动画。官网
• GreenSock-JS：适用于所有主流浏览器的高性能 HTML5 动画。官网
• TransitionEnd：TransitionEnd 是一个运用 transitonend 事件的、跨浏览器的库。官网
• Dynamics.js：用于创建基于物理知识的 CSS 动画库。官网

图片处理

• lena.js：拥有滤镜和实用功能的图像处理库。官网
• pica：高质量地调整图片大小（拥有快速的、纯 JS 实现的 Lanczos 滤镜算法）。官网
• cropper：一个简单的图像裁剪 jQuery 插件。官网

ECMAScript 6

• es6features：ECMAScript 6 特性概述。官网
• es6-features：ECMAScript 6:  特性概述和比较。官网
• ECMAScript 6 compatibility table ：Compatibility tables 展示了各种平台上所有 ECMAScript 6 特性的支持程度。官网
• Babel (Formerly 6to5)：将 ES6+ 代码转换成纯 ES5。官网
• Traceur compiler：ES6 特性转 ES5。包括 classes、generators、promises、destructuring 官网patterns、default parameters 等。

软件开发工具包(SDK)

• javascript-sdk-design：从工作和个人经验中提炼出来的 JavaScript SDK 设计指导。官网

大杂烩

• echo：利用 data-* 属性延迟加载图片。官网
• picturefill：响应式图片显示插件，使浏览器支持 srcset、size 属性。官网
• platform.js：一个平台检测库，几乎适用于所有 JavaScript 平台。官网
• json3：一个现代 JSON 实现库，几乎兼容所有 JavaScript 平台。官网
• Logical Or Not：一个关于 JavaScript 特性的游戏。官网
• BitSet.js：实现位向量的 JavaScript 库。官网

精品阅读

• braziljs/js-the-right-way：官网
• JSbooks：官网
• Superhero.js：关于创建、测试和维护一个大型 JavaScript 代码库的资源集。官网
• 《前端开发者都应知道的 jQuery 小技巧》
• 《常用的 Javascript 设计模式》
• 《10 个 jQuery 图表插件推荐》
• 《理解 JavaScript 原型》
• 《只有20行Javascript代码！手把手教你写一个页面模板引擎》
• 《编写快速、高效的JavaScript代码》
• 《45个实用的JavaScript技巧、窍门和最佳实践》
• 《为现代JavaScript开发做好准备》
• 《给JavaScript初学者的24条最佳实践》

chrome相关

• Chrome 实用调试技巧
• dev-tips

React (中文)【资料汇总】

*【资料汇总】React (中文) *

React

• React.js快速开始

• Reactjs 2016最佳实践

• React 入门教程

• React中文文档 （0.13.0）

• React Server Side Rendering 解决 SPA 应用的 SEO 问题

• ant react组件

• React 让你不爽了么？

• React+Webpack快速上手指南

• ant.design gitter

• ant.design react 组件

• ant tool

• react 组件设计原则

• JS规范

• css规范述

• JS注释规范

• 前端之React实战-快速入门以及集成使用

• 轻松入门React和Webpack

• 汇智网 react

• 百度母婴技术团队—基于Reactjs实现webapp

• react中文索引

• 简聊前端中的 React.js

• CSS Modules 详解 及 react中实践

• redux middleware详解

• Redux中文文档

• React-router-cn 中文文档

• 稀土掘金React

• 序 · 为 React 而写

• Immutable 详解及 React 中实践

• 宁浩 react

• 知乎react

• 简聊前端中的 React.js

• segmentfault reactjs

• react融合进系统的体验

• Webpack + React 开发之路

• 初学webpack与react

• react融合进系统的体验

• 为什么是React－浅谈React与jQuery的思维差异

• React 组件之间如何交流

• React 最佳实践

• react 视频

• 前端之React实战-代码规范

• 前端之React实战-交互与动态UI

• 前端之React实战-组件

• 前端之React实战：创建跨平台的项目架构

• Reactjs教程

• React：组件的生命周期

• React redux

• 开发者头条 react

• react webpack小书

• 学习React第一步

• 天猫rn

• web-frontend-practice-handbook

• 去JQuery

• CSS Modules详解及React中实践

• 前端之Sass/Scss实战笔记

• 前端月刊

• Front-End-Develop-Guide 前端开发指南

  12: https://github.com/react-component/react-component.github.io/blob/master/docs/zh-cn/component-design.md0]: http://ant.design/docs/react/introduce

node.js中文资料导航

node.js中文资料导航

Node.js

• HomePage
• Infoq深入浅出Node.js系列（进阶必读）
• Io.js中文文档
• Node.js中文文档
• Node入门
• 被误解的 Node.js
• Node.js C++ addon编写实战系列
• 热门node.js模块排行榜，方便找出你想要的模块
• nodejs多线程，真正的非阻塞
• 浅析nodejs的buffer类
• 利用libuv编写异步多线程的addon实例
• Node.js中exports与module.exports的区别
• Node.js http 管道拒绝服务漏洞
• Node.js高级编程
• Node.js代码风格指南
• 七天学会NodeJS
• 前端快速掌握 nodejs+mongodb+express+jade

业界新闻

• NodeJS无所不能：细数10个令人惊讶的NodeJS开源项目
• 看eBay如何评价他们的Node.js首次尝鲜
• 程序员如何说服老板采用Node.js？
• 百万级并发 Node.js也能行
• 高性能Node.js：来自LinkedIn Mobile的10条优化建议
• Kraken：改变PayPal开发文化的Node.js框架
• Groupon抛弃Rails，转向Node.js
• PayPal为什么从Java迁移到Node.js，性能提高一倍，文件代码减少44%

经验分享

• SDCC讲师专访：淘宝朴灵谈Node.js
• Node.js的核心与红利
• QCon北京2013 Node.js专题出品人朴灵专访
• 一个周末掌握IT前沿技术之node.js篇
• 用node+express搭建多人博客教程系列
• Node.js静态文件服务器实战
• 人人和微博登录模块的实现
• 《京JS》会议 & V8上的JS优化
• 沪 JS 国内讲师的 PPT 收集
• 给Node.js新手的7条小建议

模块导航

web服务器框架

最流行的web框架Express

• HomePage
• 加装涡轮，提速expressjs
• 给 connect 的 static 模块加上url路径前缀
• 研究nodeclub 登陆验证逻辑的一些心得
• Express.js 中文入门指引手册
• Connect架构初探 for 新手
• 使用 Express + Socket.IO 搭建多人聊天室

国人开源web框架rrestjs

• HomePage

实时应用web框架meteor

• HomePage
• Meteor-DDP翻译
• Meteor 非官方中文文档（不包含API部分）
• 基于meteor开发的开源项目列表

基于Express的实时MVC框架Sails

• HomePage

Koa，下一代 Node.js web 框架

• HomePage
• koa-guide
• koa-middlewares koa常用中间件集合

Mysql 老牌关系型数据库

• HomePage
• mysql处理BIGINT里面的一个坑
• 使用node-mysql中的连接池
• mysql自动断开解决办法

Mongodb

• node-mongodb-native
• mongoose
• 如何使用mongoose对一个100万+的mongodb的表进行遍历操作
• [技术讨论]mongodb驱动的正确使用方法

异步流程处理

async

• HomePage
• Async中文详解

eventproxy

• HomePage

Q Promise 异步模式

• HomePage
• 在Node.js 中用 Q 实现Promise – Callbacks之外的另一种选择

co

• HomePage
• 深入理解 Yield
• co wiki

异步解决方案示例

Redis 内存键值数据库

• node_redis

Pomelo 网易出品的网页游戏框架

• pomelo
• Infoq深入浅出node.js游戏服务器开发
• 官网wiki
• 响应非常迅速的官方论坛

字符格式

• 開源的簡繁轉換庫OpenCC支持Node.js了
• iconv-lite扩展：增加big5/shift-jis支持

网页模板引擎

• WEB模板jade、ejs、handlebars 万行代码解释效率比较，jade完败
• Javascript模板引擎性能对比及几点优化
• 让 ejs 更加快 | Let ejs faster with options._with = false

图片处理

• Nodejs跨平台轻量级图片编解码库【增加Jpeg质量调整】
• node-ccap模块生成captcha验证码
• 使用nodejs将html5 canvas base64编码图片保存为文件
• web-camera，node + phantomjs 网页截图

运维

• Node.js 异步异常的处理与domain模块解析
• 关于XSS（跨站脚本攻击）和CSRF（跨站请求伪造）
• forever 替代工具 pm2 的介绍
• upstart封装mongodb应用为系统服务
• 告别node-forever,拥抱PM2
• 阿里云主机Nginx下配置NodeJS、Express和Forever

性能测试

• 阿里出品的node.js调研与服务性能测试
• 多核单服务器各种配置和业务压力下的node.js性能测试
• 巅峰对决：node.js和php性能测试
• 性能测评：Node.JS比Java EE快20%

活跃开发者（排名不分先后）

• 朴灵
• dead_horse/死马
• snoopyxdy
• Python发烧友
• 老雷
• shiedman
• jiyinyiyong

开源案例 收集Cnode的开源项目

社交类

• Cnodejs 最活跃的Node.js社区
• 晓知 个人博客
• 使用Nodejs编写多人订餐系统
• NodeJS写的WebQQ
• Yblog 博客程序
• noderce博客程序

工具类

• cnpmjs.org 企业级 npm 解决方案
• wechat微信中间件
• 深度遍历目录/列出目录下所有文件
• lincell发布0.1.1版本，一行命令创建IDE
• HTML标签XSS过滤模块
• 基于Node.js的中文分词模块
• 纯真IP库lib-qqwry
• 豆瓣SDK
• 数字与字符串转换模块baseN，支持2~62间任意进制转换

商业应用

• 淘宝数据魔方
• 淘宝指数
• 淘宝时光机
• 点点网
• 花瓣网
• 雪球网
• 小米手机抢购
• 网易pomelo消息推送系统
• PayPal
• Groupon
• 百度推送平台
• 新浪微博DB proxy
• 腾讯朋友网推送

node.js中文书

了不起的Node.js

node.js入门经典

node.js开发指南

Awesome-API

本页仅收集国内部分官方API，如需查看其他版本，请点击这里。

目录

• 笔记
• 出行
• 词典
• 电商
• 地图
• 电影
• 后端云
• 即时通讯
• 开发者网站
• 快递查询
• 旅游
• 社交
• 视频
• 天气
• 图片与图像处理
• 外卖
• 消息推送
• 音乐
• 云
• 语音识别
• 综合

笔记

• 为知笔记 - 为知笔记Windows客户端开放了大量的API，其中绝大部分，都通过COM提供，可以在javascript, C#, C++, Delphi等语言中使用。接口通过IDL(Interface description language)语言描述。
• 印象笔记 - 印象笔记提供了ActionScript 3, Android, C++, Windows, iOS, Java, JavaScript, OS X, Perl, PHP, Python, Ruby等平台的SDK和完整的API参考文档，可通过API进行认证，笔记，笔记本，附件，搜索，同步等操作，同时提供企业版和本地API。
• 有道云笔记 - 有道云笔记提供了Android SDK，同时Open API允许进行授权，用户，笔记本，笔记，分享，附件等方面的操作。

出行

• 滴滴 - 滴滴提供了iOS和Android SDK, 可实现拉起滴滴叫车等方面的操作。
• 神州专车 - 神州专车提供了API模式和H5模式两种接入模式，允许进行基础信息，订单，支付，充值，用户，发票，代金券，企业等方面的操作。
• Uber - Uber提供了Android和iOS的SDK,允许进行乘客，行程体验，司机，派送次数等四大方面的操作。

词典

• 百度翻译 - 百度翻译支持多种语言互相翻译，包含PHP, JS, Python, C, Java版Demo。
• 必应词典 - 微软翻译API支持文字和语音两种类型，支持多种语言互相翻译，提供C#版本Demo。
• 金山词霸 - 金山词霸允许进行简单的翻译操作。
• 扇贝 - 扇贝提供了完整的API，允许进行用户，查询，添加学习记录，忘记单词，例句，笔记等方面的操作。
• 有道词典 - 有道词典允许进行简单的翻译操作。

电商

• 当当 - 当当允许商家用户和网站接入授权，可进行商品，订单，图片，问答，店铺和促销等方面的操作。
• 京东 - 京东提供了Java, PHP, .net的SDK，授权后可进行多种操作。
• 苏宁开放服务 - 苏宁提供了Java, PHP, .Net, Python版本的SDK，授权后可进行多种操作。
• 淘宝开放平台 - 淘宝提供了Java, .Net, PHP, Python版本的SDK，授权后提供多种操作。
• 亚马逊 - 亚马逊提供多种语言版本的SDK，授权后允许多种操作。

地图

• 百度地图 - 百度地图提供了Android, iOS版本的SDK和JavaScript API，可进行定位、地图、数据、出行、鹰眼轨迹和分析服务。
• 高德地图 - 高德地图提供了JavaScript和web服务API，Android和iOS SDK，支持地图，定位，搜索，路线规划，导航和室内地图等。
• 腾讯地图 - 腾讯地图提供了JavaScript API，Android和iOS SDK，支持定位，地图，地点搜索，路线和导航等。
• 天地图 - 天地图提供了H5 API和JavaScript API等web API，同时提供了Android和iOS SDK，支持基础地图服务，图层管理，地图覆盖物，地图工具，地名搜索和出行规划服务。
• 图吧地图 - 图吧提供了JavaScript和Flash API，Android和iOS SDK，支持定位，地址解析，位置标注，位置截图，路线规划，周边查询，兴趣点搜索和在线导航。

电影

• 豆瓣电影 - 豆瓣电影支持电影条目，影人条目，搜索和榜单等。

后端云

• Bmob - 支持云数据库，容器服务，消息推送，文件存储，短信验证码，及时通讯，云端逻辑，定时任务，地理位置等。
• 野狗 - 支持实时数据同步，实时视频通话，及时通讯，短信，身份认证等。
• LeanCloud - 支持云存储，数据分析，用户关系，实时通讯，消息推送，移动统计等。

即时通讯

• 环信 - 支持Android, iOS, WebIM, Linux, REST集成，支持多种消息类型。
• 融云 - 支持Android, iOS, Web, 游戏集成，支持多种消息类型。
• 网易云信 - 支持IM实时通讯，实时音视频，教学白班，专线电话，短信，聊天室，提供iOS, Android, Windows和Web SDK。
• 腾讯云通信IM - 提供iOS, Android, Windows和Web SDK，支持多种消息类型。

开发者网站

• 干货集中营 - 提供妹子图和Android, iOS, 前端，拓展资源等内容。
• diycode - 授权后可访问diycode网站的内容。
• 开源** - 授权后可访问diycode网站的内容。
• V2EX - 可访问V2EX网站的内容。

快递查询

• 爱快递 - 爱快递支持国内90多家快递物流订单查询服务，免费版有使用次数限制，可用于电子商城单号跟踪,手机应用,微信快递接口等服务。
• 快递100 - 快递100支持300家国内国际快递，免费版有使用次数限制。
• 快递鸟 - 快递鸟支持国内外400多家快递公司，免费版有使用次数限制，包含.Net, PHP, Java版Demo。
• 快递网 - 快递网支持上百家快递查询服务，免费版有使用次数限制。

旅游

• 去哪儿 - 支持获取去哪儿网的内容。
• 途牛 - 支持途牛网的内容，仅开放给供应商系统。
• 携程 - 支持携程网的内容。
• 艺龙 - 支持获取产品数据，完成用户的预订，进行订单查询、更改或取消。提供在线工具，以及H5, Java, C#, PHP, Ruby版本的Demo。

社交

• 钉钉 - 支持免登，企业通讯录，服务窗，钉盘，地图，会话，DING，电话，音频，扫码，支付，分享等服务，提供SDK和Demo，PC版UI规范，调试工具和钉钉UI组件库。
• 豆瓣 - 支持图书，电影，音乐，同城，广播，用户，日记，相册，线上活动，论坛，回复和我去等功能，提供豆瓣组件，豆瓣标示和Demo。
• 开心网 - 支持用户信息，登录授权，好友，传播应用，支付，分享内容，消息，交互，开心网应用等内容，提供SDK，开源插件和标示素材。
• QQ互联 - 支持用户资料，QQ会员信息，空间相册，腾讯微博资料，分享到腾讯微博，微博好友信息，财付通信息等内容，提供SDK, Demo, 以及设计资源。
• 微博 - 支持粉丝服务，微博，评论，用户，关系，账号，收藏，搜索，提醒，短链，公共服务，位置服务，地理信息，地图引擎，支付以及OAuth2.0授权等内容，提供微博标示及SDK。
• 微信 - 支持移动应用，网站应用，公众账号，公众号第三方平台等内容，提供SDK, Demo, 以及设计资源。

视频

• 爱奇艺 - 支持弹幕，全色彩播放器，高清码流，视频托管，播放爱奇艺视频，应用分发，IOCP等内容。
• 乐视 - 支持标准直播，标准点播，视频发行平台，移动直播等内容，提供SDK下载。
• 搜狐视频 - 支持一二级内容获取，内容分类获取，视频详情信息，专辑详情信息，分级列表获取，关键词搜索等内容。
• 土豆 - 支持视频模块，豆单模块，影视库模块，用户模块，转帖模块，字段定义模块等内容。
• 优酷 - 支持内容输出，视频搜索，智能推荐，用户登录，用户互动，用户信息，视频上传至优酷，视频互动等内容，提供SDK。

天气

• 彩云天气 - 支持全球天气数据，两种空气质量数据，天气预报，实况天气，独家降水预报，独家空气质量预报，六种天气数据，四种生活指数数据等内容，部分功能收费。
• 和风天气 - 支持7-10天预报，实况天气，每小时预报，生活指数，灾害预警，景点天气，历史天气，城市查询等内容，仅国内数据免费。
• 心知天气 - 支持天气实况，逐日预报和历史，24小时逐小时预报，过去24小时天气历史记录，气象灾害预警，空气质量实况与城市排行，逐日和逐小时空气质量预报，过去24小时空气质量历史记录，生活指数，农历、节气、生肖，机动车尾号限行，日出日落，月初月落和月像，城市搜索等内容，仅国内数据免费。

图片与图像处理

• Camera360 - 支持全帧率直播美白滤镜，提供SDK和Demo。
• 嗨图 - 支持图片标注，仅提供iOS版本SDK。
• 名片全能王 - 支持精准识别几十种语言的名片，自动切边并美化名片图像，自动返回识别结果，提供多种版本SDK，收费。
• 企业证件识别 - 支持身份证，驾驶证，护照等，收费。
• 扫描全能王 - 支持图像智能剪裁，五种图像增强模式，手动调节图像细节，自动返回扫描结果等，提供iOS与Android版本SDK，收费。
• 我知图 - 支持相似图像搜索，图像识别匹配，图像识别关键词推荐，重复图片探测等内容。
• 银行卡|信用卡识别 - 提供SDK和API，收费。

外卖

• 百度外卖 - 支持商户，菜品，商品，订单和基础数据等内容，提供SDK和Demo。
• 大众点评 - 支持商户，团购，在线预定，商品点评，数据统计，元数据等内容。
• 饿了么 - 支持查询，预定，订单，其他订单，数据推送，支付，评价，活动，账户同步，数据落地同步等内容。
• 美团外卖 - 支持门店，配送范围，菜品，药品，订单，订单推送等内容。

消息推送

• 百度云推送 - 支持iOS, Android和服务器端，支持推送，统计，组管理等Rest API接口。服务器端支持Java, Python, PHP, REST API。提供所支持各语言版本的SDK。
• 华为推送 - 支持Android，提供SDK。
• 极光 - 支持Android, iOS, WindowsPhone, 服务器端REST API, 提供Java, Python, PHP, Ruby, C#, Node.js等版本的SDK。
• LeanCloud - 支持Android, iOS, WindowsPhone和Web网页推送，使用云引擎和JavaScript创建推送，使用REST API推送消息。提供Objectvie-C(开放源码), JavaScript(开放源码), Android, Unity, .Net, WindowsPhone, Java(开放源码), Python(开放源码), PHP(开放源码), C++(开放源码), Swift(开放源码)版本SDK。同时提供Demo。
• 腾讯信鸽 - 支持iOS和Android平台，服务器端采用Rest API, 同时服务器端支持Java, PHP, Python等语言并提供SDK。
• 小米 - 支持Android和iOS平台，服务器端支持Java, Python并提供SDK。
• 友盟 - 支持Android和iOS平台，服务器端支持PHP, Java, Python并提供SDK。

音乐

• 豆瓣音乐 - 支持音乐信息，评论信息，标签信息，搜索音乐，某个音乐中标记最多的标签，发表、修改、删除评论，用户对音乐的所有标签等内容。
• 考拉FM - 支持获取指定分类下列表和内容，搜索指定关键字内容，专辑/电台/直播详情，指定专辑下列表，指定电台播单，分类下专辑TOP50，指定期(碎片)所在专辑最新分页功能，分类下全部直播计划，版本升级接口，排行榜，精选，传统电台列表/详情/地区等。
• 企鹅FM - 支持获取电台分类列表，电台分类下的专辑信息列表，专辑下节目信息列表，电台节目播放链接，搜索关键字相关主播/专辑/节目，主播名下专辑，特定时间段内新增主播/更新的专辑/新增的专辑等。
• 蜻蜓FM - 支持OAuth2.0授权，音频数据中心，分类，点播，直播，临时直播，排行榜，搜索，内容更新状态，主播，此刻，专题，活动等内容。
• 喜马拉雅FM - 支持Android和iOS平台，并提供相应的SDK和Demo，具体支持内容请下载相关文件查看。

云

• 阿里云 - 支持弹性计算，数据库，存储与CDN，网络，应用服务，域名与网站等类别的内容，并提供了相关SDK。
• 百度云 - 支持计算和网络，存储和CDN，数据库，安全和管理，数据分析，智能多媒体服务，物联网服务，人工智能，应用服务，网站服务，数字营销服务等内容，并提供相关的SDK。
• 腾讯云 - 支持计算，网络，存储与CDN，数据库，安全服务，监控与管理，域名服务，视频服务，大数据与AI等内容，提供相关SDK。

语音识别

• 百度语音 - 支持全平台REST API, 离线在线融合模式，深度语义解析，场景识别定制，自定义上传语料、训练模型，基础服务永久免费。提供相应SDK和Demo应用。
• 搜狗语音云开放平台 - 支持在线/离线语音识别，在线听歌识曲，离线语音合成等内容。提供相应平台SDK。
• 讯飞开放平台 - 支持语音听写/转写，在线/离线命令词识别，语音唤醒等内容，平台支持广泛，提供相应SDK。

综合

• 阿凡达数据 - 支持金融股票，充值认证，便民类，新闻文章，医药交通，科教文艺，创意数据，及时通讯等内容。
• 阿里大于 - 支持验证码，短信通知，语音通知，流量钱包充值，私密专线，群发助手等内容。
• APiX - 支持基础征信数据，信用分析服务，支付缴费接口等数据，部分免费。
• 百度API STORE - 支持多种类型数据，部分免费，提供SDK。
• HaoService - 支持多种类型数据。
• 聚合数据 - 支持多种类型数据，部分免费。
• 通联数据 - 提供金融类数据，支持免费试用。

LearningPython

This is for everyone.

In the begning when God created the heavens and the earth. the earth was a formless void and darkness covered the face of the deep, while a wind from God swept over the face of the waters. Then God said,"Let there be light"; and there was light. And God saw that the light was good; and God separated the light from the darkness. (GENESIS 1:1-4)

针对零基础的学习者，试图实现从基础到精通，还要看自己的造化。

第壹季 基础

第零章 预备

1. 关于python的故事
2. 从小工到专家
3. 安装python的开发环境
4. 集成开发环境==>集成开发环境；python的IDE

第壹章 基本数据类型

1. 数和四则运算==>整数和浮点数；变量；整数溢出问题；
2. 除法==>整数、浮点数相除；from __future__ import division；余数；四舍五入；
3. 常用数学函数和运算优先级==>math模块，求绝对值，运算优先级
4. 写一个简单程序==>程序和语句，注释
5. 字符串(1)==>字符串定义，转义符，字符串拼接，str()与repr()区别
6. 字符串(2)==>raw_input,print，内建函数，原始字符串，再做一个小程序
7. 字符串(3)==>字符串和序列，索引，切片，基本操作
8. 字符串(4)==>字符串格式化，常用的字符串方法
9. 字符编码==>编码的基础知识，python中避免汉字乱码
10. 列表(1)==>列表定义，索引和切片，列表反转，元素追加，基本操作
11. 列表(2)==>列表append/extend/index/count方法，可迭代的和判断方法，列表原地修改
12. 列表(3)==>列表pop/remove/reverse/sort方法
13. 回顾列表和字符串==>比较列表和字符串的相同点和不同点
14. 元组==>元组定义和基本操作，使用意义
15. 字典(1)==>字典创建方法、基本操作（长度、读取值、删除值、判断键是否存在）
16. 字典(2)==>字典方法:copy/deepcopy/clear/get/setdefault/items/iteritems/keys/iterkeys/values/itervalues/pop/popitem/update/has_key
17. 集合(1)==>创建集合，集合方法：add/update,pop/remove/discard/clear，可哈希与不可哈希
18. 集合(2)==>不可变集合，集合关系

第贰章 语句和文件

1. 运算符==>算数运算符，比较运算符，逻辑运算符/布尔类型
2. 语句(1)==>print, import, 赋值语句、增量赋值
3. 语句(2)==>if...elif...else语句，三元操作
4. 语句(3)==>for循环，range()，循环字典
5. 语句(4)==>并行迭代：zip()，enumerate()，list解析
6. 语句(5)==>while循环，while...else，for...else
7. 文件(1)==>文件打开，读取，写入
8. 文件(2)==>文件状态，read/readline/readlines，大文件读取，seek
9. 迭代==>迭代含义，iter()
10. 练习==>通过四个练习，综合运用以前所学
11. 自省==>自省概念，联机帮助，dir()，文档字符串，检查对象，文档

第叁章 函数

1. 函数(1)==>定义函数方法，调用函数方法，命名方法，使用函数注意事项
2. 函数(2)==>函数返回值，函数文档，形参和实参，命名空间，全局变量和局部变量
3. 函数(3)==>收集参数:*和**，及其逆过程，复习参数知识
4. 函数(4)==>递归、传递函数、嵌套函数和装饰器
5. 函数(5)==>filter、map、reduce、lambda、yield
6. 函数练习==>解一元二次方程，统计考试成绩，找素数
7. zip()补充==>对zip()函数的用法进行补充说明

第贰季 进阶

第肆章 类

1. 类(1)==>类的初步认识和基本概念理解：问题空间、对象、面向对象、类和实例化类
2. 类(2)==>新式类和旧式类，类的命名，构造函数，实例化及方法和属性，self的作用
3. 类(3)==>类属性、创建实例、实例属性、self作用、类内外数据流转
4. 类(4)==>绑定方法和非绑定方法，类方法和静态方法
5. 类(5)==>继承，super，多重继承
6. 类(6)==>静态方法和类方法，两者的区别，类的文档
7. 多态和封装==>多态，封装和私有化
8. 特殊方法(1)==>__dict__和__slots__
9. 特殊方法(2)==>__getattr__,__setattr__以及查找属性顺序,双划线解释
10. 迭代器==>迭代器方法__iter__,netx()
11. 生成器==>生成器定义，yield，生成器方法
12. 上下文管理器==>上下文管理器的基本概念，使用方法和contextlib模块

第伍章 错误和异常

1. 错误和异常(1)==>什么是错误和异常，常见异常类型，处理异常(try...except...)
2. 错误和异常(2)==>处理多个异常，else子句，finally子句
3. 错误和异常(3)==>assert断言，异常小结

第陆章 模块

1. 编写模块==>模块是程序，模块的位置
2. 标准库(1)==>引用模块的方式，dir()查看属性和方法，模块文档和帮助
3. 标准库(2)==>sys，copy
4. 标准库(3)==>os模块：操作文件、目录，查看修改属性，执行系统命令，打开网页
5. 标准库(4)==>堆的基本知识，heapq模块，deque模块
6. 标准库(5)==>calendar模块、time模块、datetime模块
7. 标准库(6)==>urllib模块、urllib2模块
8. 标准库(7)==>xml.etree.ElementTree模块：遍历查询、增删改查xml，应用实例
9. 标准库(8)==>json模块：dumps(),loads(),dump(),load()，自定义类型数据的json编码和解码
10. 第三方库==>第三方库的模块安装方法，以requests模块为例说明

第柒章 保存数据

1. 将数据存入文件==>pickle模块，shelve模块
2. MySQL数据库(1)==>MySQL概况，安装，python连接MySQL模块和方法
3. MySQL数据库(2)==>连接对象方法，游标对象方法：数据库的增删改查基本操作
4. MongoDB数据库==>mongodb的安装启动，pymongo模块：连接客户端，数据库的增删改查操作
5. SQLite数据库==>通过sqlite3模块操作SQLite数据库：连接对象方法，游标对象方法，数据库增删改查
6. 电子表格==>python操作Excel文件的第三方库openpyxl使用方法，以及其它与Excel相关的第三方库

第叁季 实战

1. 引

第捌章 用Tornado做网站

1. 为做网站而准备==>开发框架，python的常用web框架，tornado框架介绍和安装
2. 分析Hello==>发布tornado做的网站，并剖析基本结构
3. 用tornado做网站(1)==>网站的基本结构，一个基于tornado框架的网站架子
4. 用tornado做网站(2)==>前端模板，静态文件引入
5. 用tornado做网站(3)==>ajax传输数据，get_argument()接收数据，验证用户名和密码
6. 用tornado做网站(4)==>render()方法使用，模板语法，转义（自动转义，不转义）
7. 用tornado做网站(5)==>模板继承和块语句，CSS文件，cookie以及XSRF安全防护方法
8. 用tornado做网站(6)==>用户验证
9. 用tornado做网站(7)==>概念：同步和异步、阻塞和非阻塞，tornado的同步，tornado的异步设置，实践中的异步

第玖章 科学计算

1. 为计算做准备==>相关模块的安装，ipython notebook
2. Pandas使用(1)==>Series数据类型：定义和基本属性，DataFrame数据类型：定义和基本属性
3. Pandas使用(2)==>读取csv文件，excel文件，以及其它格式数据和从数据库加载数据方法
4. 处理股票数据==>下载yahoo股票数据，matplotlib模块绘图

附：网络文摘

1. 如何成为python高手
2. ASCII、Unicode、GBK和UTF-8字符编码的区别联系
3. 大数据全栈式开发语言 – Python
4. 机器学习编程语言之争，Python夺魁
5. Python 2.7.x 和 3.x 版本的重要区别

FE资源

nodejs学习资料

http://liuqing.pw/
nodejs 篇幅比较巨大
http://rainweb.cn/article/category/Nodejs
篇幅比较少
http://rainweb.cn/article/category/Nodejs
nodejs
http://nqdeng.github.io/7-days-nodejs
大示例是一个静态文件合并服务器
http://www.w3cfuns.com/article-5598538-1-1.html
node express 入门教程
http://my.oschina.net/u/568264/blog/193773
nodejs定时任务
http://60sky.com/
一个nodejs博客

http://www.cnblogs.com/yexiaochai/p/3536547.html
【NodeJS 学习笔记04】新闻发布系统
http://www.cnblogs.com/qqloving/p/3541099.html
过年7天乐，学nodejs 也快乐
https://github.com/nqdeng/7-days-nodejs
七天学会NodeJS
http://www.cnblogs.com/zhongweiv/p/nodejs_events.html
Nodejs学习笔记（二）--- 事件模块
https://github.com/zensh/jsgen
angularjs nodejs
http://www.cnblogs.com/liusuqi/p/3735491.html
nodejs入门
https://github.com/koajs/koa
http://koajs.cn/
http://koa.rednode.cn/
https://github.com/turingou/koa-guide
koa框架
http://blog.fens.me/series-nodejs/
从零开始nodejs系列文章

1.理解nodejs；
http://debuggable.com/posts/understanding-node-js:4bd98440-45e4-4a9a-8ef7-0f7ecbdd56cb
2.nodejs事件轮询；
http://blog.mixu.net/2011/02/01/understanding-the-node-js-event-loop/
http://www.nodebeginner.org/index-zh-cn.html
node入门
http://www.w3cfuns.com/tools.php?mod=booknodejs
nodejs参考手册
3. nodejs cms
http://ourjs.com/detail/53e1f281c5910a9806000001

程序员必备的那些Chrome插件[转]

chrome-plugin-recommand 程序员必备的那些Chrome插件

1.CL1024

由于种种原因....「取消viidii跳转」「种子链接转化磁链接」「去帖子广告」「阅读帖子按楼数快速跳转楼层」「帖子内去掉1024的回复」「今日帖子高亮」「超大图片根据屏幕缩放」



https://chrome.google.com/webstore/detail/cl1024/efdllnloheadnjjahfmdohomdphlgcjm

2.Click&Clean

监控浏览器的一些状态，很方便的清理缓存，历史记录等等.



https://chrome.google.com/webstore/detail/clickclean-app/pdabfienifkbhoihedcgeogidfmibmhp

3.DHC REST Client

可模拟网络请求的一个chrome应用，反正我觉得比postman漂亮多了。



https://chrome.google.com/webstore/detail/dhc-rest-client/aejoelaoggembcahagimdiliamlcdmfm

4.GitHub Hovercard

当鼠标放到github的某个链接是弹出改项目或者作者的信息.



https://chrome.google.com/webstore/detail/github-hovercard/mmoahbbnojgkclgceahhakhnccimnplk

5.Google学术搜索按钮

这个不多说



https://chrome.google.com/webstore/detail/google-scholar-button/ldipcbpaocekfooobnbcddclnhejkcpn

6.Imagus

当鼠标放到图片或者视频上时，自动展示大图.



https://chrome.google.com/webstore/detail/imagus/immpkjjlgappgfkkfieppnmlhakdmaab

7.JSON-handle

很方便的解析json



https://chrome.google.com/webstore/detail/json-handle/iahnhfdhidomcpggpaimmmahffihkfnj

8.Octotree

这个每个程序员必备.在github项目页左侧展示该项目的树结构



https://chrome.google.com/webstore/detail/octotree/bkhaagjahfmjljalopjnoealnfndnagc

9.smartUp手势

一个更好的手势类扩展。功能包括：鼠标手势，简易拖曳，超级拖曳，摇杆手势和滚轮手势。

https://chrome.google.com/webstore/detail/smartup-gestures/bgjfekefhjemchdeigphccilhncnjldn

10.Tampermonkey

类似firefox上的油猴子

推荐几个常用的.

• 让你的github更 material design https://github.com/jiang111/chrome-plugin-recommand/blob/master/js/GitHub-Material-Design.js
• 重新整合微博页面,屏蔽那些天天秀恩爱又不好意思取关的那些人 https://github.com/jiang111/chrome-plugin-recommand/blob/master/js/Yet-Another-Weibo-Filter.js
• 方便下载youtube的字幕,有下载字幕肯定得有下载视频的 http://www.clipconverter.cc/, https://github.com/jiang111/chrome-plugin-recommand/blob/master/js/Youtube%20Auto-Subtitle-Downloader.js
  https://chrome.google.com/webstore/detail/tampermonkey/dhdgffkkebhmkfjojejmpbldmpobfkfo

11. Vysor (Beta)

android程序员必备,连接并显示安卓屏幕的内容



https://chrome.google.com/webstore/detail/vysor-beta/gidgenkbbabolejbgbpnhbimgjbffefm

12.划词翻译

支持谷歌、百度、有道、必应四大翻译和朗读引擎，可以方便的查看、复制和朗读不同引擎的翻译结果。

https://chrome.google.com/webstore/detail/%E5%88%92%E8%AF%8D%E7%BF%BB%E8%AF%91/ikhdkkncnoglghljlkmcimlnlhkeamad

13.Holmes

更方便的书签管理器

https://chrome.google.com/webstore/detail/holmes/gokficnebmomagijbakglkcmhdbchbhn

14.Vimium

The Hacker's Browser. Vimium provides keyboard shortcuts for navigation and control in the spirit of Vim.

https://chrome.google.com/webstore/detail/vimium/dbepggeogbaibhgnhhndojpepiihcmeb

15. FireBug

IT前端民工必备

https://chrome.google.com/webstore/detail/firebug-lite-for-google-c/bmagokdooijbeehmkpknfglimnifench

16.Window Resizer

可以快速调整浏览器窗口的尺寸，用于观察网站页面宽度

https://chrome.google.com/webstore/detail/window-resizer/kkelicaakdanhinjdeammmilcgefonfh

17.PageMonitor

页面监控，如果内容有更新就通知你,你抢电子产品的时候肯定需要

https://chrome.google.com/webstore/detail/visualping/pemhgklkefakciniebenbfclihhmmfcd

18.EyeDroper

浏览器窗口内取色

https://chrome.google.com/webstore/detail/eye-dropper/hmdcmlfkchdmnmnmheododdhjedfccka

19.sourcegraph-chrome-extens

更好的查看github的代码，直接从源代码的引用跳至定义，更好的搜索效果。源代码搬运工福利来了！
https://chrome.google.com/webstore/detail/sourcegraph-chrome-extens/dgjhfomjieaadpoljlnidmbgkdffpack

20.Hacker Vision

快速实现网页的黑白切换
https://chrome.google.com/webstore/detail/hacker-vision/fommidcneendjonelhhhkmoekeicedej

21.download-any-for-github

可以下载GitHub指定文件夹和文件

https://github.com/onlylemi/download-any-for-github

22.WEB前端助手（FeHelper）

FeHelper，Chrome浏览器插件，包含一些前端实用的工具，推荐安装！

23.掘金

https://chrome.google.com/webstore/detail/%E6%8E%98%E9%87%91/lecdifefmmfjnjjinhaennhdlmcaeeeb

24.Wappalyzer

展示你访问的网页由什么技术栈所构建.


https://chrome.google.com/webstore/detail/wappalyzer/gppongmhjkpfnbhagpmjfkannfbllamg

推荐

• 收集Android你不知道的那些小技巧:https://github.com/jiang111/awesome-android-tips
• 收集Android studio 常用的插件,请看这里:https://github.com/jiang111/awesome-androidstudio-plugins
• 收集程序员必备的那些Chrome插件: https://github.com/jiang111/chrome-plugin-recommand
• 通过RecyclerView实现的联系人: https://github.com/jiang111/IndexRecyclerView
• 用于学习RxJava操作符的APP: https://github.com/jiang111/RxJavaApp
• 展示注册进度的view: https://github.com/jiang111/ProgressView
• 可定制的ViewPagerIndicator: https://github.com/jiang111/ScalableTabIndicator
• 通过viewpager的滑动来对fragment内的元素进行动画操作: https://github.com/jiang111/ViewPagerTransformer

前端涉及的知识体系

综合类

综合类	地址
前端知识体系	http://www.cnblogs.com/sb19871023/p/3894452.html
前端知识结构	https://github.com/JacksonTian/fks
Web前端开发大系概览	https://github.com/unruledboy/WebFrontEndStack
Web前端开发大系概览-中文版	http://www.cnblogs.com/unruledboy/p/WebFrontEndStack.html
Web Front-end Stack v2.2	Web Front-end Stack v2.2
免费的编程中文书籍索引	https://github.com/justjavac/free-programming-books-zh_CN
前端书籍	https://github.com/dypsilon/frontend-dev-bookmarks
前端免费书籍大全	https://github.com/vhf/free-programming-books
前端知识体系	http://www.cnblogs.com/sb19871023/p/3894452.html
免费的编程中文书籍索引	https://github.com/justjavac/free-programming-books-zh_CN
智能社 - 精通JavaScript开发	http://study.163.com/course/introduction/224014.htm
重新介绍 JavaScript（JS 教程）	https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/A_re-introduction_to_JavaScript
麻省理工学院公开课：计算机科学及编程导论	http://v.163.com/special/opencourse/bianchengdaolun.html
JavaScript中的this陷阱的最全收集--没有之一	http://segmentfault.com/a/1190000002640298
JS函数式编程指南	https://llh911001.gitbooks.io/mostly-adequate-guide-chinese/content/ch1.html
JavaScript Promise迷你书（中文版）	http://liubin.github.io/promises-book
腾讯移动Web前端知识库	https://github.com/AlloyTeam/Mars
Front-End-Develop-Guide 前端开发指南	https://github.com/Front-End-Developers-Hunan/Front-End-Develop-Guide
前端开发笔记本	https://li-xinyang.gitbooks.io/frontend-notebook/content
大前端工具集 - 聂微东	https://github.com/nieweidong/fetool
前端开发者手册	https://dwqs.gitbooks.io/frontenddevhandbook/content

入门类

入门类	地址
前端入门教程	http://www.cnblogs.com/jikey/p/3613082.html
瘳雪峰的Javascript教程	http://www.liaoxuefeng.com/wiki/001434446689867b27157e896e74d51a89c25cc8b43bdb3000
jQuery基础教程	http://www.imooc.com/view/11
前端工程师必备的PS技能——切图篇	http://www.imooc.com/view/506
结合个人经历总结的前端入门方法	https://github.com/qiu-deqing/FE-learning

工具类

工具类	地址
前端人的俱乐部	http://f2er.club/ 真可以解放你的收藏夹
如何优雅地使用Sublime Text	http://www.jeffjade.com/2015/12/15/2015-04-17-toss-sublime-text/#
新编码神器Atom使用纪要	http://www.jeffjade.com/2016/03/03/2016-03-02-how-to-use-atom/
css sprite 雪碧图制作	http://www.imooc.com/learn/93
版本控制入门 – 搬进 Github	http://www.imooc.com/learn/390
Grunt-beginner前端自动化工具	http://www.imooc.com/learn/30
IntelliJ IDEA 简体中文专题教程	https://github.com/judasn/IntelliJ-IDEA-Tutorial
Webstorm,InterllIdea,Phpstorm	http://t.cn/8kZZ1Uy
SublimeText	https://github.com/jikeytang/sublime-text
Atom	https://atom.io
visual studio code	https://code.visualstudio.com

综合效果搜索平台

综合效果搜索平台	地址
zoommyapp.com	http://zoommyapp.com/ 高质量图库
unsplash.com	https://unsplash.com/ 高质量图库
www.pinterest.com	https://www.pinterest.com/ 图库
New Old Stock	http://nos.twnsnd.co 复古风图库
效果网	http://www.jq22.com
花瓣网	http://huaban.com/
优美图	http://www.topit.me/
codepen	http://codepen.io/
17素材	http://www.17sucai.com
摄图网	http://699pic.com/
常用的JavaScript代码片段	http://microjs.com

周报类

周报类	地址
奇舞周刊	http://old.75team.com/weekly/
码农周刊	http://weekly.manong.io
JS前端开发群月报	http://www.kancloud.cn/jsfront/month/82796
WEB前端开发	http://www.css88.com
A JS tip per day!	http://www.jstips.co
平安科技移动开发二队技术周报	https://github.com/PaicHyperionDev/MobileDevWeekly

开发中心

开发中心	地址
mozilla js参考	https://developer.mozilla.org/zh-CN/docs/Web/JavaScript
chrome开发中心（chrome的内核已转向blink）	https://developer.chrome.com/extensions/api_index.html
safari开发中心	https://developer.apple.com/library/safari/navigation
microsoft js参考	https://msdn.microsoft.com/zh-cn/library/d1et7k7c(v=vs.94.aspx
js秘密花园	http://sanshi.me/articles/JavaScript-Garden-CN/html/index.html
js秘密花园	http://bonsaiden.github.io/JavaScript-Garden/zh
w3help	http://www.w3help.org 综合Bug集合网站

Nodejs

Nodejs	地址
nodejs 篇幅比较巨大	http://liuqing.pw
Node.js 包教不包会	https://github.com/alsotang/node-lessons
篇幅比较少	http://www.rainweb.cn/article/category/Nodejs
node express 入门教程	http://www.w3cfuns.com/article-5598538-1-1.html
nodejs定时任务	http://my.oschina.net/u/568264/blog/193773
一个nodejs博客	http://60sky.com
【NodeJS 学习笔记04】新闻发布系统	http://www.cnblogs.com/yexiaochai/p/3536547.html
过年7天乐，学nodejs 也快乐	http://www.cnblogs.com/qqloving/p/3541099.html
七天学会NodeJS	https://github.com/nqdeng/7-days-nodejs
Nodejs学习笔记（二）--- 事件模块	http://www.cnblogs.com/zhongweiv/p/nodejs_events.html
nodejs入门	http://www.cnblogs.com/liusuqi/p/3735491.html
angularjs nodejs	https://github.com/zensh/jsgen
从零开始nodejs系列文章	http://blog.fens.me/series-nodejs
理解nodejs	http://debuggable.com/posts/understanding-node-js:4bd98440-45e4-4a9a-8ef7-0f7ecbdd56cb
nodejs事件轮询	http://blog.mixu.net/2011/02/01/understanding-the-node-js-event-loop
node入门	http://www.nodebeginner.org/index-zh-cn.html
nodejs cms	http://ourjs.com/detail/53e1f281c5910a9806000001
Node初学者入门，一本全面的NodeJS教程	http://ourjs.com/detail/529ca5950cb6498814000005
NodeJS的代码调试和性能调优	http://www.barretlee.com/blog/2015/10/07/debug-nodejs-in-command-line

综合API

综合API	地址
javascripting	http://www.javascripting.com
各种流行库搜索	http://microjs.com
runoob.com-包含各种API集合	http://www.runoob.com
开源**在线API文档合集	http://tool.oschina.net/apidocs
devdocs	http://devdocs.io 英文综合API网站

Ecmascript

Ecmascript	地址
Understanding ECMAScript 6 - Nicholas C. Zakas	https://leanpub.com/understandinges6/read
exploring-es6	https://leanpub.com/exploring-es6/read
exploring-es6翻译	https://github.com/es6-org/exploring-es6
exploring-es6翻译后预览	http://es6-org.github.io/exploring-es6
阮一峰 es6	http://es6.ruanyifeng.com
阮一峰 Javascript	http://javascript.ruanyifeng.com
ECMA-262，第 5 版	http://yanhaijing.com/es5
es5	http://es5.github.io

Js template

Js template	地址
template-chooser	http://garann.github.io/template-chooser
artTemplate	https://github.com/aui/artTemplate
tomdjs	https://github.com/aui/tmodjs/blob/master/README.md
淘宝模板juicer模板	http://juicer.name/docs/docs_zh_cn.html
Fxtpl v1.0 繁星前端模板引擎	http://koen301.github.io/fxtpl
laytpl	http://laytpl.layui.com
mozilla - nunjucks	https://github.com/mozilla/nunjucks
Juicer	https://github.com/PaulGuo/Juicer
dustjs	http://akdubya.github.io/dustjs
etpl	http://ecomfe.github.io/etpl

CSS

CSS	地址
CSS 语法参考	http://tympanus.net/codrops/css_reference
CSS3动画手册	http://isux.tencent.com/css3/index.html
腾讯css3动画制作工具	http://isux.tencent.com/css3/tools.html
志爷css小工具集合	http://linxz.github.io/tianyizone
css3 js 移动大杂烩	http://www.note12.com/category/blog/2014-6-5/538fe0a9f786f1b7019a4dfb
bouncejs 触摸库	http://bouncejs.com
css3 按钮动画	http://fian.my.id/Waves
animate.css	http://daneden.github.io/animate.css
全局CSS的终结(狗带 [译]	http://www.alloyteam.com/2015/10/8536
browserhacks	http://browserhacks.com

Angularjs

Angularjs	地址
Angular.js 的一些学习资源	https://github.com/dolymood/AngularLearning
angularjs中文社区	http://angularjs.cn
Angularjs源码学习	http://www.cnblogs.com/xuwenmin888/p/3739096.html
Angularjs源码学习	http://www.ifeenan.com/?c=AngularJS
angular对bootstrap的封装	http://angular-ui.github.io/bootstrap
angularjs + nodejs	https://cnodejs.org/topic/51404e0f069911196d2e3923
吕大豹 Angularjs	http://www.cnblogs.com/lvdabao/tag/AngularJs
AngularJS 最佳实践	http://www.infoq.com/cn/news/2013/02/angular-web-app
Angular的一些扩展指令	http://www.lovelucy.info/angularjs-best-practices.html
Angular数据绑定原理	https://github.com/Pasvaz/bindonce
一些扩展Angular UI组件	https://github.com/angular-ui
Ember和AngularJS的性能测试	http://voidcanvas.com/emberjs-vs-angularjs-performance-testing
带你走近AngularJS - 基本功能介绍	http://www.cnblogs.com/powertoolsteam/p/angularjs-introdection.html
Angularjs开发指南	http://angular.duapp.com/docs/guide
Angularjs学习	http://www.cnblogs.com/amosli/p/3710648.html
不要带着jQuery的思维去学习AngularJS	http://www.rainweb.cn/article/angularjs-jquery.html
angularjs 学习笔记	http://wangjiatao.diandian.com/?tag=angularjs
angularjs 开发指南	http://www.angularjs.cn/T008
angularjs 英文资料	https://github.com/jmcunningham/AngularJS-Learning
angular bootstrap	http://angular-ui.github.io/bootstrap
angular jq mobile	https://github.com/opitzconsulting/jquery-mobile-angular-adapter
angular ui	http://mgcrea.github.io/angular-strap
整合jQuery Mobile+AngularJS经验谈	http://www.tuicool.com/articles/7ZZVr2
有jQuery背景，该如何用AngularJS编程**	http://blog.jobbole.com/46589/
AngularJS在线教程	http://each.sinaapp.com/angular
angular学习笔记	http://www.zouyesheng.com/angular.html

React

React	地址
react.js 中文论坛	http://www.react-china.org
react.js 官方网址	https://facebook.github.io/react/index.html
react.js 官方文档	https://facebook.github.io/react/docs/getting-started.html
react.js material UI	http://material-ui.com/#
react.js TouchstoneJS UI	http://touchstonejs.io
react.js amazeui UI	http://amazeui.org/react
React 入门实例教程 - 阮一峰	http://www.ruanyifeng.com/blog/2015/03/react.html
React Native 中文版	http://wiki.jikexueyuan.com/project/react-native
Webpack 和 React 小书 - 前端乱炖	http://www.html-js.com/article/Fakefish%203053
Webpack 和 React 小书 - gitbook	https://fakefish.github.io/react-webpack-cookbook
webpack	https://github.com/webpack/webpack
Webpack，101入门体验	http://html-js.com/article/3009
webpack入门教程	http://html-js.com/article/3113
基于webpack搭建前端工程解决方案探索	http://segmentfault.com/a/1190000003499526
React原创实战视频教程	http://www.piliyu.com

vue

vue	地址
Vue	http://cn.vuejs.org
Vue 论坛	http://forum.vuejs.org
Vue 入门指南	http://www.cnblogs.com/aaronjs/p/3660102.html
Vue 的一些资源索引	http://segmentfault.com/a/1190000000411057
awesome-vue	https://github.com/vuejs/awesome-vue

移动端API

移动端API	地址
99移动端知识集合	https://github.com/jtyjty99999/mobileTech
移动端前端开发知识库	https://github.com/AlloyTeam/Mars
移动前端的一些坑和解决方法（外观表现）	http://caibaojian.com/mobile-web-bug.html
【原】移动web资源整理	http://www.cnblogs.com/PeunZhang/p/3407453.html
zepto 1.0 中文手册	http://mweb.baidu.com/zeptoapi
zepto 1.0 中文手册	http://www.html-5.cn/Manual/Zepto
zepto 1.1.2	http://www.css88.com/doc/zeptojs_api
zepto 中文注释	http://www.cnblogs.com/sky000/archive/2013/03/29/2988952.html
jqmobile 手册	http://app-framework-software.intel.com/api.php
移动浏览器开发集合	https://github.com/maxzhang/maxzhang.github.com/issues
移动开发大杂烩	https://github.com/hoosin/mobile-web-favorites

jQuery

jQuery	地址
jQuery API 中文文档	http://www.jquery123.com
hemin 在线版	http://hemin.cn/jq
css88 jq api	http://www.css88.com/jqapi-1.9/on
css88 jqui api	http://www.css88.com/jquery-ui-api
学习jquery	http://learn.jquery.com
jquery 源码查找	http://james.padolsey.com/jquery

D3

D3	地址
d3 Tutorials	https://github.com/mbostock/d3/wiki/Tutorials
Gallery	https://github.com/mbostock/d3/wiki/Gallery
lofter	http://datavisual.lofter.com/post/40cf3a_188e535
iteye	http://alanland.iteye.com/blog/1878595
ruanyifeng	http://javascript.ruanyifeng.com/library/d3.html

Requriejs

Requriejs	地址
Javascript模块化编程（一）：模块的写法	http://www.ruanyifeng.com/blog/2012/10/javascript_module.html
Javascript模块化编程（二）：AMD规范	http://www.ruanyifeng.com/blog/2012/10/asynchronous_module_definition.html
Javascript模块化编程（三）：require.js的用法	http://www.ruanyifeng.com/blog/2012/11/require_js.html
RequireJS入门（一）	http://www.cnblogs.com/snandy/archive/2012/05/22/2513652.html
RequireJS入门（二）	http://www.cnblogs.com/snandy/archive/2012/05/23/2513712.html
RequireJS进阶（三）	http://www.cnblogs.com/snandy/archive/2012/06/08/2538001.html
requrie源码学习	http://www.cnblogs.com/yexiaochai/p/3632580.html
requrie 入门指南	http://www.oschina.net/translate/getting-started-with-the-requirejs-library
requrieJS 学习笔记	http://www.cnblogs.com/yexiaochai/p/3214926.html
requriejs 其一	http://cyj.me/why-seajs/requirejs/
require backbone结合	http://www.cnblogs.com/yexiaochai/p/3221081.html

Seajs

Seajs	地址
seajs	http://seajs.org
seajs 中文手册	http://cyj.me/why-seajs/zh

Less,sass

Less,sass	地址
sass	http://www.w3cplus.com/sassguide
sass教程-sass**	http://www.sass.hk
Sass 中文文档	http://sass.bootcss.com
less	http://less.bootcss.com

Markdown

Markdown	地址
Markdown 语法说明 (简体中文版	http://wowubuntu.com/markdown
markdown入门参考	https://github.com/LearnShare/Learning-Markdown/blob/master/README.md
gitbook	https://www.gitbook.com 国外的在线markdown可编辑成书
mdeditor	https://www.zybuluo.com/mdeditor 一款国内的在线markdown编辑器
stackedit	https://stackedit.io 国外的在线markdown编辑器，功能强大，同步云盘
mditor	http://bh-lay.github.io/mditor 一款轻量级的markdown编辑器
lepture-editor	https://github.com/lepture/editor
markdown-editor	https://github.com/jbt/markdown-editor
作业部落	https://www.zybuluo.com 功能强大，速度流畅，全平台同步

兼容性

兼容性	地址
esma 兼容列表	http://kangax.github.io/compat-table/es6
W3C CSS验证服务	http://jigsaw.w3.org/css-validator/validator.html.zh-cn
caniuse	http://caniuse.com/#index
csscreator	http://csscreator.com/properties
microsoft	https://msdn.microsoft.com/zh-cn/library/cc351024(v=vs.85.aspx
在线测兼容-移动端	http://www.responsinator.com
emulators	https://www.manymo.com/emulators

UI相关

UI相关	地址
bootcss	http://v3.bootcss.com
MetroUICSS	http://www.w3cplus.com/MetroUICSS
semantic	http://semantic-ui.com
Buttons	http://alexwolfe.github.io/Buttons
kitecss	http://hiloki.github.io/kitecss
pintuer	http://www.pintuer.com
amazeui	http://amazeui.org
worldhello	http://www.worldhello.net/gotgithub/index.html
linuxtoy	http://igit.linuxtoy.org/contents.html
gitmagic	http://www-cs-students.stanford.edu/~blynn/gitmagic/intl/zh_cn
rogerdudler	http://rogerdudler.github.io/git-guide/index.zh.html
gitref	http://gitref.justjavac.com
book	http://git-scm.com/book/zh
gogojimmy	http://gogojimmy.net/2012/01/17/how-to-use-git-1-git-basic

其它API

其它API	地址
HTTP API 设计指南	http://segmentfault.com/bookmark/1230000002521721
javascript流行库汇总	javascriptoo
验证api	http://niceue.com/validator/demo/index.php
underscore 中文手册	http://www.css88.com/doc/underscore
underscore源码分析	http://www.html-js.com/article/Underscorejs-source-code-analysis-of-underscorejs-source-code-analysis%203031
underscore源码分析-亚里士朱德的博客	http://yalishizhude.github.io/tags/underscore
underscrejs en api	http://underscorejs.org
lodash - underscore的代替品	https://lodash.com
ext4api	http://extjs-doc-cn.github.io/ext4api
backbone 中文手册	http://www.csser.com/tools/backbone/backbone.js.html
qwrap手册	http://dev.qwrap.com/resource/js/_docs/_youa/#/qw/base/loadJs_.htm
缓动函数	http://easings.net/zh-cn
svg 中文参考	http://www.w3school.com.cn/svg/svg_reference.asp
svg mdn参考	https://developer.mozilla.org/en-US/docs/Web/SVG
svg 导出 canvas	https://github.com/gabelerner/canvg
svg 导出 png	https://github.com/exupero/saveSvgAsPng
ai-to-svg	http://www.zamzar.com/convert/ai-to-svg
localStorage 库	https://github.com/machao/localStorage

图表类

图表类	地址
Highcharts 中文API	http://www.hcharts.cn/api/index.php
Highcharts 英文API	http://api.highcharts.com/highcharts
ECharts 百度的图表软件	http://echarts.baidu.com/
高德地图	http://lbs.amap.com/api
开源的矢量图脚本框架	http://paperjs.org
svg 地图	http://jvectormap.com

正则

正则	地址
JS正则表达式元字符	http://segmentfault.com/a/1190000002471140
正则表达式30分钟入门教程	http://deerchao.net/tutorials/regex/regex.htm
MDN-正则表达式	https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Regular_Expressions
ruanyifeng - RegExp对象	http://javascript.ruanyifeng.com/stdlib/regexp.html
小胡子哥 - 进阶正则表达式	http://div.io/topic/764?page=1
is.js	https://github.com/Cedriking/is.js/blob/master/is.js
正则在线测试	http://regexper.com

前端

前端	地址
通过分析github代码库总结出来的工程师代码书写习惯	http://alloyteam.github.io/CodeGuide
HTML&CSS编码规范 by @mdo	http://codeguide.bootcss.com
团队合作的css命名规范-腾讯AlloyTeam前端团队	http://www.alloyteam.com/2011/10/css-on-team-naming/
前端编码规范之js - by yuwenhui	http://yuwenhui.github.io
前端编码规范之js - by 李靖	http://www.cnblogs.com/hustskyking/p/javascript-spec.html
前端开发规范手册	http://zhibimo.com/read/Ashu/front-end-style-guide
Airbnb JavaScript 编码规范（简体中文版）	https://github.com/yuche/javascript#table-of-contents
AMD与CMD规范的区别	http://www.zhihu.com/question/20351507
AMD与CMD规范的区别	http://www.cnblogs.com/tugenhua0707/p/3507957.html
KISSY 源码规范	http://docs.kissyui.com/1.4/docs/html/tutorials/style-guide/kissy-source-style.html
bt编码规范	http://codeguide.bootcss.com
规范加强版	https://github.com/Suxiaogang/Code_Guide
前端代码规范 及 最佳实践	http://blog.jobbole.com/79075
百度前端规范	http://coderlmn.github.io/code-standards
百度前端规范	http://isobar-idev.github.io/code-standards
百度前端规范	http://zhuanlan.zhihu.com/fuyun/19884834
ECMAScript6 编码规范--广发证券前端团队	https://github.com/gf-rd/es6-coding-style
JavaScript 风格指南/编码规范（Airbnb公司版）	http://blog.jobbole.com/79484
网易前端开发规范	http://nec.netease.com/standard
css模块	http://www.75team.com/archives/1049
前端规范资源列表	https://github.com/ecomfe/spec

PHP

PHP	地址
最流行的PHP 代码规范	http://segmentfault.com/a/1190000000443795
最流行的PHP 代码规范	https://github.com/hfcorriez/fig-standards/blob/zh_CN/%E6%8E%A5%E5%8F%97/PSR-2-coding-style-guide.md

各大公司开源项目

各大公司开源项目	地址
Facebook Projects	https://code.facebook.com/projects/web
百度web前端研发部	http://fex.baidu.com
百度EFE	http://efe.baidu.com
百度github	https://github.com/fex-team
alloyteam	http://www.alloyteam.com
alloyteam-github	http://alloyteam.github.io
alloyteam-AlloyGameEngine	https://github.com/AlloyTeam/AlloyGameEngine
AlloyDesigner	http://alloyteam.github.io/AlloyDesigner 即时修改，即时保存，设计稿较正，其它开发辅助工具
H5交互页编辑器AEditor介绍	http://www.alloyteam.com/2015/06/h5-jiao-hu-ye-bian-ji-qi-aeditor-jie-shao H5动画交互页开发的工具介绍
AEditor	http://aeditor.alloyteam.com H5动画交互页开发的工具
maka	http://forum.maka.im/wordpress
值得订阅的weekly	https://github.com/fenbility/weekly-feed
腾讯html5	http://cube.qq.com
奇舞团开源项目	http://75team.github.io
Qunar UED	http://ued.qunar.com
Scrat	http://scrat.io

常用

常用	地址
ieBetter.js-让IE6-IE8拥有IE9+,Chrome等浏览器特性	http://www.zhangxinxu.com/wordpress/2013/12/iebetter-js-make-ie6-ie8-like-modern-browser-ie9-chrome
模拟键盘	http://mottie.github.io/Keyboard
拼音	https://github.com/hotoo/pinyin
**个人身份证号验证	https://github.com/mc-zone/IDValidator

算法

算法	地址
数据结构与算法 JavaScript 描述. 章节练习	https://github.com/Ralph-Wang/algorithm.in.js
常见排序算法（JS版）	https://github.com/twobin/twobinSort
经典排序	https://github.com/luofei2011/jsAgm/blob/master/js/sort.js
常见排序算法-js版本	https://github.com/hechangmin/jssort
JavaScript 算法与数据结构 精华集	https://github.com/lightningtgc/JavaScript-Algorithms
面试常考算法题精讲	http://www.nowcoder.com/live/courses

移动端

移动端	地址
fastclick	https://github.com/ftlabs/fastclick
no-click-delay	https://github.com/mmastrac/jquery-noclickdelay
【敏捷开发】Android团队开发规范	http://www.cnblogs.com/lcw/p/3619181.html
Android 开发规范与应用	http://www.jianshu.com/p/4390f4fe19b3
ionic	https://github.com/ychow/ionic-guide

JSON

JSON	地址
模拟生成JSON数据	http://beta.json-generator.com
返回跨域JSONAPI	http://jsonp.afeld.me

焦点图

焦点图	地址
myfocus	https://github.com/koen301/myfocus
myfocus-官方演示站	http://www.chhua.com/myfocus
SuperSlidev2.1 -- 大话主席	http://www.superslide2.com
soChange	http://www.bujichong.com/sojs/soChange/index.html

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

Ext, EasyUI, J-UI 及其它各种UI方案	地址
extjs	https://www.sencha.com/products/extjs
ext4英文api	http://docs.sencha.com/extjs/4.0.7
ext4中文api	http://extjs-doc-cn.github.io/ext4api
jquery easyui 未压缩源代码	http://jquery-easyui.googlecode.com/svn/trunk/src
J-UI	http://jui.org
MUI-最接近原生APP体验的高性能前端框架	http://dcloudio.github.io/mui
Amaze UI	**首个开源 HTML5 跨屏前端框架
淘宝 HTML5 前端框架	http://m.sui.taobao.org
KISSY - 阿里前端JavaScript库	http://docs.kissyui.com
网易Nej - Nice Easy Javascript	http://nej.netease.com
Kendo UI MVVM Demo	http://demos.telerik.com/kendo-ui/mvvm/index
Bootstrap	http://www.bootcss.com
Smart UI	http://smartui.chinamzz.com
雅虎UI - CSS UI	http://developer.yahoo.com/yui/grids

页面 社会化 分享功能

页面 社会化 分享功能	地址
百度分享	http://share.baidu.com pc端
JiaThis	http://jiathis.com pc端
社会化分享组件	http://developer.baidu.com/soc/share 移动端
ShareSDK 轻松实现社会化功能	http://www.mob.com/#/index 移动端
友盟分享	http://dev.umeng.com/social/android/quick-integration 移动端

富文本编辑器

富文本编辑器	地址
功能齐全 tinymce	https://www.tinymce.com
百度 ueditor	http://ueditor.baidu.com/website
经典的ckeditor	http://ckeditor.com
经典的kindeditor	http://kindeditor.net
wysiwyg	http://www.bootcss.com/p/bootstrap-wysiwyg
一个有情怀的编辑器。Bach's Editor	http://integ.github.io/BachEditor
tower用的编辑器	https://github.com/mycolorway/simditor
summernote 编辑器	https://github.com/summernote/summernote
html5编辑器	http://neilj.github.io/Squire
XEditor	http://lab.hustlzp.com/XEditor
wangEditor	https://github.com/wangfupeng1988/wangEditor

前端概述

前端概述	地址
前端工具大全	http://www.awesomes.cn
什么是前端工程化	https://github.com/fouber/blog/issues/10?from=timeline&isappinstalled=0#

Gulp

Gulp	地址
Gulp官网	http://gulpjs.com
Gulp中文网	http://www.gulpjs.com.cn
gulp资料收集	https://github.com/Platform-CUF/use-gulp
Gulp：任务自动管理工具 - ruanyifeng	http://javascript.ruanyifeng.com/tool/gulp.html
Gulp插件	http://gulpjs.com/plugins
Gulp探究折腾之路(I)	http://www.jeffjade.com/2015/11/25/2015-11-25-toss-gulp/
Gulp折腾之路(II)	http://www.jeffjade.com/2016/01/19/2016-01-19-toss-gulp/
Gulp不完全入门教程	http://www.ido321.com/1622.html
为什么使用gulp?	hjzheng/CUF_meeting_knowledge_share#33
Gulp安装及配合组件构建前端开发一体化	http://www.dbpoo.com/getting-started-with-gulp
Gulp 入门指南	https://github.com/nimojs/gulp-book
Gulp 入门指南 - nimojs	https://github.com/nimojs/blog/issues/19
Gulp in Action	http://www.imooc.com/video/5692
Gulp开发教程（翻译）	http://www.w3ctech.com/topic/134
前端构建工具gulpjs的使用介绍及技巧	http://www.cnblogs.com/2050/p/4198792.html

Grunt

Grunt	地址
gruntjs	http://gruntjs.com
Grunt中文网	http://www.gruntjs.net

Fis

Fis	地址
fis 官网	http://fex-team.github.io/fis-site/index.html
fis	http://fis.baidu.com

pc图轮

pc图轮	地址
单屏轮播sochange	http://www.jsfoot.com/jquery/demo/2011-09-20/192.html
左右按钮多图切换	http://bxslider.com/examples/carousel-demystified
fullpage全屏轮播	https://github.com/alvarotrigo/fullPage.js

移动端图轮

移动端图轮	地址
无缝切换	http://www.swipejs.com
滑屏效果	http://www.idangero.us/swiper
全屏fullpage	https://github.com/peunzhang/fullpage
单个图片切换	https://github.com/qiqiboy/touchslider
单个全屏切换	https://github.com/peunzhang/slip.js
百度的切换库	http://touch.code.baidu.com/examples.html?qq-pf-to=pcqq.group
单个全屏切换	https://github.com/peunzhang/iSlider
滑屏效果	https://github.com/saw/touch-interfaces
旋转拖动设置	http://baijs.com/tinycircleslider
类似于swipe切换	http://touchslider.com
支持多种形式的触摸滑动	http://www.swiper.com.cn/demo/index.html
滑屏效果	https://github.com/joker-ye/main/blob/master/wap/index.html
大话主席pc移动图片轮换	http://www.superslide2.com
滑屏效果	https://github.com/hahnzhu/parallax.js
基于zepto的fullpage	https://github.com/yanhaijing/zepto.fullpage
[WebApp]定宽网页设计下，固定宽度布局开发WebApp并实现多终端下WebApp布局自适应	http://www.cnblogs.com/plums/archive/2013/01/10/WebApp-fixed-width-layout-of-multi-terminal-adapter-since.html
判断微信客户端的那些坑	http://loo2k.com/blog/detecting-wechat-client
可以通过javascript直接调用原生分享的工具	https://github.com/JefferyWang/nativeShare.js
JiaThis 分享到微信代码	http://www.jiathis.com/help/html/weixin-share-code
聊聊移动端跨平台开发的各种技术	http://fex.baidu.com/blog/2015/05/cross-mobile
前端自动化测试	http://www.zhihu.com/question/29922082
多种轮换图片	http://ajccom.github.io/niceslider
滑动侧边栏	https://mango.github.io/slideout

文件上传

文件上传	地址
百度上传组件	http://fex.baidu.com/webuploader
上传	https://blueimp.github.io/jQuery-File-Upload
flash 头像上传	http://www.hdfu.net
图片上传预览	http://www.dropzonejs.com
图片裁剪	http://elemefe.github.io/image-cropper
图片裁剪-shearphoto	http://www.shearphoto.com
jQuery图片处理	http://www.oschina.net/project/tag/284/jquery-image-tools?lang=0&os=0&sort=view&p=2

模拟select

模拟select	地址
糖饼 select	http://aui.github.io/popupjs/doc/selectbox.html
flexselect	https://github.com/rmm5t/jquery-flexselect
双select	http://loudev.com
select2	http://select2.github.io

取色插件

取色插件	地址
类似 Photoshop 的界面取色插件	http://www.jq22.com/plugin/367
jquery color	https://github.com/jquery/jquery-color
取色插件集合	http://www.oschina.net/project/tag/287/color-picker
farbtastic 圆环＋正方形	https://github.com/mattfarina/farbtastic

城市联动

城市联动	地址
jquery.cityselect.js基于jQuery+JSON的省市或自定义联动效果	http://www.ijquery.cn/?p=360

剪贴板

剪贴板	地址
剪贴板	https://github.com/zeroclipboard/zeroclipboard
clipboard 最新的剪切方案	http://zenorocha.github.io/clipboard.js
不是Flash的剪贴板	https://github.com/zenorocha/clipboard.js

简繁转换

简繁转换	地址
简繁转换	https://github.com/BYVoid/OpenCC

表格 Grid

表格 Grid	地址
facebook表格	http://facebook.github.io/fixed-data-table
类似于Excel编辑表格-handsontable	http://handsontable.com
bootstrap-table插件	http://bootstrap-table.wenzhixin.net.cn
datatables	https://www.datatables.net

在线演示

在线演示	地址
js 在线编辑 - runjs	http://runjs.cn
js 在线编辑 - jsbin	http://jsbin.com
js 在线编辑 - codepen	http://codepen.io
js 在线编辑 - jsfiddle	http://jsfiddle.net
java 在线编辑 - runjs	http://ideone.com
js 在线编辑 - hcharts	http://code.hcharts.cn
js 在线编辑 - jsdm	http://jsdm.com
sql 在线编辑 - sqlfiddle	http://sqlfiddle.com
mozilla 在线编辑器	https://thimble.mozilla.org

常规优化

常规优化	地址
Javascript高性能动画与页面渲染	http://www.infoq.com/cn/articles/javascript-high-performance-animation-and-page-rendering
移动H5前端性能优化指南	http://isux.tencent.com/h5-performance.html
5173首页前端性能优化实践	http://ued.5173.com/?p=1731
给网页设计师和前端开发者看的前端性能优化	http://www.uisdc.com/front-end-performance-for-web-designers-and-front-end-developers
复杂应用的 CSS 性能分析和优化建议	http://www.orzpoint.com/profiling-css-and-optimization-notes
张鑫旭——前端性能	张鑫旭——前端性能
前端性能监控总结	http://www.xiaoqiang.org/javascript/font-end-performance-monitor.html
网站性能优化之CSS无图片技术	网站性能优化之CSS无图片技术
web前端性能优化进阶路	web前端性能优化进阶路
前端技术：网站性能优化之CSS无图片技术	http://my.eoe.cn/tuwandou/archive/4544.html
浏览器的加载与页面性能优化	http://www.baiduux.com/blog/2011/02/15/browser-loading
页面加载中的图片性能优化	http://www.w3ctech.com/p/1503
Hey——前端性能	Hey——前端性能
html优化	html优化
99css——性能	99css——性能
Yslow——性能优化	http://www.yslow.net/category.php?cid=20
YSLOW中文介绍	http://www.cnblogs.com/yslow
转一篇Yahoo关于网站性能优化的文章，兼谈本站要做的优化	http://www.360ito.com/article/40.html
Yahoo!团队实践分享：网站性能	http://www.360doc.com/content/10/0928/09/2588264_56971287.shtml
网站性能优化指南：什么使我们的网站变慢？	http://blog.jiasule.com/i/153
网站性能优化实践，减少加载时间，提高用户体验	http://www.powereasy.net/helpyou/knowledge/ecommerce/9593.html
浅谈网站性能优化 前端篇	http://www.umtry.com/archives/747.html
前端重构实践之如何对网站性能优化？	http://www.adinnet.cn/blog/designview/2012-7-12/678.html
前端性能优化：使用媒体查询加载指定大小的背景图片	http://www.gbin1.com/technology/javascript/20130708-front-end-performance-optimization-9
网站性能系列博文	http://www.mykuer.com/post/factors-that-affect-the-speed-of-web-site-open.html
加载，不只是少一点点	http://tgideas.qq.com/webplat/info/news_version3/804/808/811/m579/201109/41355.shtml
前端性能的测试与优化	http://mzhou.me/article/95310
分享网页加载速度优化的一些技巧？	http://www.gbin1.com/technology/html/20130217-tips-for-speed-up-page-loading
页面加载中的图片性能优化	http://www.f2es.com/images-bytes-opt
web前端优化(基于Yslow	http://www.tcreator.info/webSchool/website/Front-end-Opt-Yslow.html
网站性能优化工具大全	https://www.qianduan.net/website-performance-optimization-tool.html
【高性能前端1】高性能HTML	http://www.alloyteam.com/2012/10/high-performance-html
【高性能前端2】高性能CSS	http://www.alloyteam.com/2012/10/high-performance-css
由12306谈谈网站前端性能和后端性能优化	http://coolshell.cn/articles/6470.html
AlloyTeam——前端优化	AlloyTeam——前端优化
毫秒必争，前端网页性能最佳实践	http://www.cnblogs.com/developersupport/p/3248695.html
网站性能工具Yslow的使用方法	http://blog.sina.com.cn/s/blog_6e9d2e0701017kvu.html
前端工程与性能优化（上）：静态资源版本更新与缓存	http://www.infoq.com/cn/articles/front-end-engineering-and-performance-optimization-part1
前端工程与性能优化（下）：静态资源管理与模板框架	http://www.infoq.com/cn/articles/front-end-engineering-and-performance-optimization-part2
HTTPS连接的前几毫秒发生了什么	http://blog.jobbole.com/48369
Yslow	http://uicss.cn/yslow/#more-12319
Essential Web Performance Metrics — A Primer, Part 1	http://blog.smartbear.com/web-performance/essential-web-performance-metrics-a-primer-part-1
Essential Web Performance Metrics — Part 2	http://blog.smartbear.com/performance/essential-web-performance-metrics-part-2
YUISlide,针对移动设备的动画性能优化	http://jayli.github.io/blog/data/2011/12/23/yuislide.html
Improving Site Performance	http://joelglovier.com/improving-site-performance
让网站提速的最佳前端实践	http://segmentfault.com/a/1190000000367899
Why Website Speed is Important	http://sixrevisions.com/web-development/why-website-speed-is-important
Need for Speed – How to Improve your Website Performance	https://www.devbridge.com/articles/need-for-speed-how-to-improve-your-website-performance
阿里无线前端性能优化指南 (Pt.1 加载期优化	amfe/article#1

优化工具

优化工具	地址
JavaScript 性能分析新工具 OneProfile	http://www.html-js.com/article/3083
JavaScript 堆内存分析新工具 OneHeap	http://www.html-js.com/article/3091

在线工具

在线工具	地址
google在线工具	https://developers.google.com/speed/pagespeed/insights
阿里测	http://www.alibench.com
阿里-免费测试服务	http://itest.aliyun.com
阿里-F2etest多浏览器兼容性测试解决方案	https://github.com/alibaba/f2etest
js性能测试	http://jsperf.com

前端架构

前端架构	地址
技术架构	http://www.zhihu.com/topic/19612641
前端架构	http://saito.im/note/The-Architecture-of-F2E
如何成为前端架构师	http://www.zhihu.com/question/24092572
关于前端架构-张克军	http://hikejun.com/sharing/2010webrebuild/?file=fe-infrastructure.html
百度腾讯offer比较（腾讯游戏VS百度基础架构）	http://www.zhihu.com/question/25583350

推荐作品

推荐作品	地址
winter代码片段需要翻墙	https://gist.github.com/wintercn
fgm	http://www.fgm.cc/learn
岑安作品集	https://github.com/hongru/hongru.github.com
当耐特demo集合	http://kmdjs.github.io
米空格 js作品	http://www.laoshu133.com/Lab
myFocus	http://koen301.github.io
SeaJS组件库	http://panxuepeng.github.io/seajslib
颜海镜作品	http://yanhaijing.com/myProject
脚儿网作品	http://jo2.org/category/myworks
javascript个人作品	http://www.cnitblog.com/yemoo/category/3107.html
妙味的雷东升游戏作品	http://bbs.miaov.com/forum.php?mod=viewthread&tid=7790
javascript作品集	http://bbs.csdn.net/topics/380227212
云五笔，灰度产生生成工具	https://github.com/TooBug/works
项目主页	http://koen301.github.io
个性的作品主页	http://zaole.net
播放器	http://static.tingall.com/v2/player
ucren js demos 集	http://ucren.com/blog/demos
智能社	http://www.zhinengshe.com/works_list.html
实例陈列架	http://demos.shizuwu.cn
zoye demo	http://zoye.sinaapp.com/demo
王员外	http://lab.yuanwai.wang
平凡	http://pingfan1990.sinaapp.com
jyg 游戏案例	http://www.lovewebgames.com
很多jquery插件	http://www.helloweba.com/list.html
不羁虫 - soJs 作品系列	http://www.bujichong.com/sojs/api/index.html
frozenui	http://frozenui.github.io/case.html
黑白棋	http://js-game.github.io/othello
fromone	http://yansm.github.io/fromone/index.html
pazguille	http://pazguille.me
Html5 VideoPlayer	https://github.com/zmmbreeze/DeadSimpleVideoPlayer
Proton 烟花	http://a-jie.github.io/Proton/#example

简历模板

简历模板	地址
不错的个人简历	http://learnshare.github.io/about/index.html
简历	http://hcy2367.github.io/resume
张伦	http://ncuey.sinaapp.com/CrispElite/
简历	https://github.com/hacke2/ResumeSample
翁天信	http://blog.dandyweng.com/2013/07/how-my-website-was-created
动画方式的简历	http://www.webhek.com/misc/interactive-resume
组件丰富简历	http://www.linqing07.com/resume.html
简历池	http://www.mojianli.com/resume/view
haorooms博客	http://www.haorooms.com/about
Justin Young	http://cv.youngdze.com

面试题

面试题	地址
那几个月在找工作（百度，网易游戏）	http://www.nowcoder.com/discuss/3196
2014最新面试题	http://www.html-js.com/article/1743
阿里前端面试题	http://www.w3cfuns.com/thread-5598563-2-1.html
2016校招内推 -- 阿里巴巴前端 -- 三面面试经历	http://www.cnblogs.com/imwtr/p/4685546.html
腾讯面试题	http://www.w3cfuns.com/article-5599657-1-1.html
年后跳槽那点事：乐视+金山+360面试之行	http://www.cnblogs.com/lvdabao/p/3660707.html
阿里前端面试题上线	http://fatesinger.com/2722.html
拉勾网js面试题	http://www.cnblogs.com/52cik/p/js-question-lg.html
前端面试	http://www.cnblogs.com/allenxing/p/3724382.html
Web开发笔试面试题 大全	http://mianshiti.diandian.com
前端开发面试题	http://segmentfault.com/a/1190000000465431
2014最新前端面试题	https://github.com/markyun/My-blog/tree/master/Front-end-Developer-Questions
百度面试	https://github.com/fex-team/interview-questions
面试题	http://www.w3cfuns.com/forum.php?mod=forumdisplay&fid=51&filter=typeid&typeid=177
前端工作面试问题	https://github.com/darcyclarke/Front-end-Developer-Interview-Questions/tree/master/Chinese
前端开发面试题	http://segmentfault.com/a/1190000000465431
5个经典的前端面试问题	5个经典的前端面试问题
最全前端面试问题及答案总结	http://segmentfault.com/a/1190000002562454
如何面试一名前端开发工程师？	http://www.html-js.com/article/Large-search-front-team-column%202961
史上最全 前端开发面试问题及答案整理	https://github.com/hawx1993/Front-end-Interview-questions
前端实习生面试总结	http://www.cnblogs.com/xiaoruo/p/4665163.html
史上最全 前端开发面试问题及答案整理	https://github.com/hawx1993/Front-end-Interview-questions
BAT及各大互联网公司2014前端笔试面试题：JavaScript篇	http://blog.jobbole.com/78738
前端开发面试题大收集	https://github.com/paddingme/Front-end-Web-Development-Interview-Question
收集的前端面试题和答案	https://github.com/qiu-deqing/FE-interview
如何面试前端工程师	http://www.zhihu.com/question/19568008
前端开发面试题	https://github.com/markyun/My-blog/blob/master/Front-end-Developer-Questions/Questions-and-Answers/README.md
牛客网-笔试面经	http://www.nowcoder.com/discuss?type=2

iconfont

iconfont	地址
中文字体	http://www.zhihu.com/question/21253343
淘宝字库	http://iconfont.cn
字体	http://mux.alimama.com/fonts
制作教程	http://iconfont.cn/help/platform.html
zhangxinxu-icommon	http://www.zhangxinxu.com/wordpress/?s=icomoon
icommon	https://icomoon.io/app
用字体在网页中画ICON图标(推荐教程	http://imooc.com/learn/243
字体压缩工具	http://font-spider.org

Fiddler

Fiddler	地址
Fiddler调式使用知多少(一深入研究	http://www.cnblogs.com/tugenhua0707/p/4623317.html
微信fiddle	http://www.cnblogs.com/strick/p/4570006.html
微信fiddle	http://gaoboy.com/article/26.html

Chrome

Chrome	地址
Google Chrome 官方	https://developer.chrome.com/devtools
Chrome - 基础	http://www.cnblogs.com/constantince/p/4565261.html
Chrome - 进阶	http://www.cnblogs.com/constantince/p/4579121.html
Chrome - 性能	http://www.cnblogs.com/constantince/p/4585983.html
Chrome - 性能进阶	http://www.cnblogs.com/constantince/p/4607497.html
Chrome - 移动	http://www.cnblogs.com/constantince/p/4624241.html
Chrome - 使用技巧	http://www.cnblogs.com/liyunhua/p/4544738.html
Chrome - Console控制台不完全指南	http://www.cnblogs.com/Wayou/p/chrome-console-tips-and-tricks.html
Chrome - Workspace使浏览器变成IDE	http://c7sky.com/chrome-devtools-workspace.html
network面板	http://www.html-js.com/article/Nothing-blind%202975
chrome开发工具快捷键	http://anti-code.com/devtools-cheatsheet
chrome调试工具常用功能整理	http://www.html-js.com/article/2327
Chrome 开发工具 Workspace 使用	http://www.iinterest.net/2014/05/09/chrome-dev-tool-workspace
Chrome神器Vimium快捷键学习记录	http://www.cppblog.com/deercoder/archive/2011/10/22/158886.html
sass调试-w3cplus	http://www.w3cplus.com/sassguide/debug.html
如何更专业的使用Chrome开发者工具-w3cplus	http://www.w3cplus.com/tools/how-to-use-chrome-devtools-like-a-pro.html
chrome调试canvas	http://sentsin.com/web/253.html
chrome profiles1	https://developer.chrome.com/devtools/index
chrome profiles2	http://h5dev.uc.cn/article-25-1.html
chrome profiles3	http://www.oschina.net/translate/performance-optimisation-with-timeline-profiles
chrome移动版调试	https://developer.chrome.com/devtools/docs/mobile-emulation
chrome调试	http://ued.taobao.org/blog/2012/06/debug-with-chrome-dev-tool
chrome的调试	http://www.cnblogs.com/QLeelulu/archive/2011/08/28/2156402.html
chrome console 命令详解	https://developer.chrome.com/devtools/docs/commandline-api
查看事件绑定1	http://www.cnblogs.com/leonkao/p/3809655.html
查看事件绑定2	http://www.cnblogs.com/xiaoyao2011/p/3447421.html
神器——Chrome开发者工具(一	http://segmentfault.com/a/1190000000683599
奇趣百科性能优化(Chrome DevTools 中的 Timeline Profils 等工具使用介绍	https://xinranliu.me/2015-05-22-qiqu-performance
chrome 开发者工具的 15 个小技巧	http://frontenddev.org/link/15-tips-of-chrome-developer-tools.html
Chrome开发者工具不完全指南	http://1ke.co/course/361
Chrome 开发者工具使用技巧	http://segmentfault.com/a/1190000003882567

Firebug

Firebug	地址
firebug视频教程	http://www.imooc.com/learn/137
firefox 模拟器	https://developer.mozilla.org/zh-CN/docs/Tools/WebIDE
console.log 命令详解	http://www.cnblogs.com/ctriphire/p/4116207.html
Firebug入门指南	http://www.ruanyifeng.com/blog/2008/06/firebug_tutorial.html
Firebug控制台详解	http://www.ruanyifeng.com/blog/2011/03/firebug_console_tutorial.html

移动,微信调试

移动,微信调试	地址
浏览器端调试安卓	https://openstf.github.io
移动端前端开发调试	http://yujiangshui.com/multidevice-frontend-debug
使用 Chrome 远程调试 Android 设备	https://github.com/yujiangshui/CN-Chrome-DevTools/blob/remote-debugging/md/Use-Tools/remote-debugging.md
mac移动端调试	http://plus.uc.cn/document/webapp/doc5.html
mac移动端调试	http://www.mihtool.com
无线调试攻略	http://thx.github.io/mobile/debugging-in-mobile
无线调试攻略	http://yanhaijing.com/mobile/2014/12/17/web-debug-for-mobile
屌爆了,完美调试 微信webview(x5	http://www.jianshu.com/p/ccf124f1f74b
微信调试的那些事	微信调试的那些事
远程console	http://jsconsole.com
微信调试工具	http://blog.qqbrowser.cc
各种真机远程调试方法汇总	https://github.com/jieyou/remote_inspect_web_on_real_device

iOS Simulator

iOS Simulator	地址
Simulator	iOS_Simulator_Guide-Introduction
iOS Simulator的介绍和使用心得	http://www.crifan.com/intro_ios_simulator_in_xcode_and_usage_summary

img

img	地址
loading img	http://preloaders.net/en/circular
智图-图片优化平台	http://zhitu.isux.us
在线png优化	https://tinypng.com

生成二维码

生成二维码	地址
生成二维码	http://cli.im

浏览器同步

浏览器同步	地址
puer	https://github.com/leeluolee/puer
liveReload	http://livereload.com
f5	http://getf5.com
File Watchers	http://geek100.com/2608

在线PPT制作

在线PPT制作	地址
nodePPT	nodePPT
Cleaver快速制作网页PPT	http://www.jeffjade.com/2015/10/15/2015-10-16-cleaver-make-ppt/
impress.js	http://www.cnblogs.com/Darren_code/archive/2013/01/04/impressjs.html
PPT	https://github.com/ksky521/nodePPT
reveal	https://github.com/hakimel/reveal.js
slippy	https://github.com/Seldaek/slippy

前端导航网站

前端导航网站	地址
界面清爽的前端导航	http://uxbees.com/index.html
前端导航	http://whycss.com
前端网址导航	http://www.daqianduan.com/nav
前端名录	http://sentsin.com/daohang
前端导航	http://123.jser.us
前端开发资源	http://www.css88.com/nav
网址导航	http://www.haourl.cn
前端开发仓库 - 众多效果的收集地	http://code.ciaoca.com
前端资源导航	https://github.com/jnoodle/f2e-collect
F2E 前端导航	http://f2e.im/static/pages/nav/index.html

常用CDN

常用CDN	地址
新浪CDN	http://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加速 - jq22	http://www.jq22.com/cdn
jQuery CDN	http://code.jquery.com
Google jQuery CDN	http://www.google-jquery-cdn.com
微软CDN	http://www.asp.net/ajax/cdn

Git

Git	地址
git-scm	http://git-scm.com
廖雪峰-Git教程	廖雪峰-Git教程
git-for-windows	https://git-for-windows.github.io
GitHub 添加 SSH keys	http://daemon369.github.io/git/2015/03/10/add-ssh-keys-for-github
gogithub	http://www.worldhello.net/gotgithub/index.html
git常规命令练习	http://pcottle.github.io/learnGitBranching
git的资料整理	https://github.com/xirong/my-git
我所记录的git命令（非常实用）	http://www.cnblogs.com/fanfan259/p/4810517.html
企业开发git工作流模式探索部分休整	https://github.com/xirong/my-git/blob/master/git-workflow-tutorial.md
GitHub 漫游指南	https://github.com/phodal/github-roam
GitHub秘籍	https://github.com/tiimgreen/github-cheat-sheet/blob/master/README.zh-cn.md
使用git和github进行协同开发流程	http://livoras.com/post/28
动画方式练习git	http://onlywei.github.io/explain-git-with-d3

各种日期日历

各种日期日历	地址
经典my97	http://www.my97.net/dp/demo/index.htm
强大的独立日期选择器	http://www.cnblogs.com/gbin1/archive/2012/04/16/2452105.html
fullcalendar	http://fullcalendar.io
fullcalendar日历控件知识点集合	http://blog.csdn.net/francislaw/article/details/7740630
中文api	http://blog.sina.com.cn/s/blog_9475b1c101012c5f.html
农历日历	https://github.com/zzyss86/LunarCalendar
超酷的仿百度带节日日历老黄历控件	http://www.sucaisj.com/jiaoben/date/201509/16856.html
日期格式化	http://momentjs.com
大牛日历控件	https://github.com/Johnqing/QPAYCalendar
我群某管理作品	https://github.com/Iamlars/dateMarker
input按位替换-官网	http://digitalbush.com/projects/masked-input-plugin
input按位替换-github	https://github.com/digitalBush/jquery.maskedinput/tree/1.2.2
bootstrap-daterangepicker	https://github.com/dangrossman/bootstrap-daterangepicker
国外30个插件集合	http://www.vandelaydesign.com/30-best-free-jquery-plugins
JavaScript datepicker	http://dbushell.com/2012/10/09/pikaday-javascript-datepicker
Datepair.js	http://jonthornton.github.io/Datepair.js
一个风格多样的日历	https://github.com/glad/glDatePicker
弹出层式的全日历	http://amsul.ca/pickadate.js/date
jquery双日历	http://www.daterangepicker.com
大气实用jQuery手机移动端日历日期选择插件	http://www.frankdemo.cn/index.php?c=content&a=show&id=115
jQuery Mobile 移动开发中的日期插件Mobiscroll	https://mobiscroll.com

Date library

Date library	地址
Datejs	https://github.com/datejs/Datejs
sugarjs	http://sugarjs.com/api/Date

其它

其它	地址
Mock.js 是一款模拟数据生成器	http://mockjs.com
特色的HTML框架可以创建精美的iOS应用	http://framework7.taobao.org
淘宝SUI	http://m.sui.taobao.org
avalonjs	http://avalonjs.github.io
Avalon新一代UI库： OniUI	http://ued.qunar.com/oniui/index.html
avalon.oniui-基于avalon的组件库	https://github.com/RubyLouvre/avalon.oniui

效果类

效果类	地址
弹出层	http://www.imooc.com/learn/58
焦点图轮播特效	http://www.imooc.com/learn/18
HTML5 有哪些让你惊艳的 demo？	http://www.zhihu.com/question/24398907

弹出层

弹出层	地址
artDialog 最新版	https://github.com/aui/artDialog
artDialog 文档	http://aui.github.io/artDialog/doc/index.html
google code 下载地址	https://code.google.com/p/artdialog/downloads/list
贤心弹出层	http://layer.layui.com
响应式用户交互组件库	https://github.com/bh-lay/UI
sweetalert-有css3动画弹出层	http://t4t5.github.io/sweetalert

优秀JavaScript项目

优秀JavaScript项目	地址
Angular和Webpack种子文件	https://github.com/AngularClass/angular2-webpack-starter
Fis3面向前端的工程构建系统	https://github.com/fex-team/fis3
Fis3 DEMO	https://github.com/fex-team/fis3-demo
前端JQuery系列:源码剖析	https://github.com/JsAaron/jQuery
avalon框架	https://github.com/RubyLouvre/avalon
Microsoft ChakraCore 微软的Chakra引擎	https://github.com/Microsoft/ChakraCore
Quintus HTML游戏引擎	https://github.com/cykod/Quintus
一个用node.js搭建的有趣博客	https://github.com/STRML/strml.net
Web前端助手--FeHelper（Chrome扩展）	https://github.com/zxlie/FeHelper
百度前端技术学院	https://github.com/baidu-ife/ife
Cheerio（node.js中的jQuery）	https://github.com/cheeriojs/cheerio
nodejs的一个聊天软件 类似微信	https://github.com/BryanYang/freechat
使用html5和node.js构建的网易云音乐	https://github.com/stkevintan/Cube
babel ES6转换为ES5	https://github.com/babel/babel
一个JS富文本编辑器	https://github.com/fex-team/ueditor
一个JS脑图可视化工具	https://github.com/fex-team/kityminder-core
一个JS写的Flappy Bird Game	https://github.com/ellisonleao/clumsy-bird
一个JS写的GBA模拟器	https://github.com/taisel/IodineGBA
SegmentFault写的Markdown解析器	https://github.com/SegmentFault/HyperDown.js
基于node.js的Ghost博客	https://github.com/TryGhost/Ghost
学习react的demos	https://github.com/ruanyf/react-demos

送给前端的你，推荐几篇前端汇总文章

• 送给前端的你，推荐几篇前端汇总文章

前端

必备基础技能

前端技能汇总（https://github.com/JacksonTian/fks）这个项目详细记录 了前端工程师牵涉到的各方面知识。在具备基本技能之后可以在里面找到学习 的方向，完善技能和知识面。

frontend-dev-bookmarks（https://github.com/dypsilon/frontend-dev-bookmarks）是老外总结的前端开发资源。覆盖面非常广。包括各种知识点、工具、技术，非常全面。

以下是入门阶段应该熟练掌握的基础技能：

HTML4，HTML5语法、标签、语义
CSS2.1，CSS3规范，与HTML结合实现各种布局、效果
Ecma-262定义的javascript的语言核心，原生客户端javascript，DOM操作，HTML5新增功能
一个成熟的客户端javascript库，推荐jquery
一门服务器端语言：如果有服务器端开发经验，使用已经会的语言即可，如果没有服务器端开发经验，熟悉Java可以选择Servlet，不熟悉的可以选PHP，能实现简单登陆注册功能就足够支持前端开发了，后续可能需要继续学习，最基本要求是实现简单的功能模拟，
HTTP
在掌握以上基础技能之后，工作中遇到需要的技术也能快速学习。

基本开发工具

恰当的工具能有效提高学习效率，将重点放在知识本身，在出现问题时能快速定位并 解决问题，以下是个人觉得必备的前端开发工具：

文本编辑器：推荐Sublime Text，支持各种插件、主题、设置，使用方便
浏览器：推荐Google Chrome，更新快，对前端各种标准提供了非常好的支持
调试工具：推荐Chrome自带的Chrome develop tools，可以轻松查看DOM结构、样式，通过控制台输出调试信息，调试javascript，查看网络等
辅助工具：PhotoShop编辑图片、取色，fireworks量尺寸，AlloyDesigner对比尺寸，以及前面的到的Chrome develop tools，
翻墙工具：lantern, 壁虎漫步
学习方法和学习目标

方法：

入门阶段反复阅读经典书籍的中文版，书籍中的每一个例子都动手实现并在浏览器中查看效果
在具备一定基础之后可以上网搜各种教程、demo，了解各种功能的实际用法和常见功能的实现方法
阅读HTML，CSS，Javascript标准全面完善知识点
阅读前端牛人的博客、文章提升对知识的理解
善用搜索引擎
目标：

熟记前面知识点部分的重要概念，结合学习经历得到自己的理解
熟悉常见功能的实现方法，如常见CSS布局，Tab控件等。
入门之路

以下是入门阶段不错的书籍和资料

HTML先看《HTML & CSS: Design and Build Websites》1-9章，然后《HTML5: The Missing Manual》1-4章。
CSS先看《CSS: The Missing Manual》，然后《CSS权威指南》
javascript先看《javascript高级程序设计》，然后《javascript权威指南》
HTTP看HTTP权威指南
在整个学习过程中HTML JavaScript会有很多地方需要互相结合，实际工作中也是这样，一个简单的功能模块都需要三者结合才能实现。
动手是学习的重要组成部分，书籍重点讲解知识点，例子可能不是很充足，这就需要- 利用搜索引擎寻找一些简单教程，照着教程实现功能。以下是一些比较好的教程网址
可以搜索各大公司前端校招笔试面试题作为练习题或者他人总结的前端面试题还有个人总结的面试题（带参考答案）
http://code.tutsplus.com有各种各样的教程
MDN也有很多教程，更重要的是里面有详细的文档，需要查找某个功能时在Google搜索：xxx site:https://developer.mozilla.org
http://www.html5rocks.com/zh/也有很多优质教程
http://www.sitepoint.com/
http://alistapart.com/
原生javascript是需要重点掌握的技能，在掌握原生javascript的基础上推荐熟练掌握jQuery，在实际工作中用处很大，这方面的书籍有《Learning jQuery》或者去jQuery官网
建一个https://github.com/账号，保存平时学习中的各种代码和项目。
有了一定基础之后可以搭建一个个人博客，记录学习过程中遇到的问题和解决方法，方便自己查阅也为其他人提供了帮助。也可以去http://www.cnblogs.com/或者http://www.csdn.net/这样的网站注册账号，方便实用
经常实用Google搜索英文资料应该经常找到来自http://stackoverflow.com/的高质量答案，与到问题可以直接在这里搜索，如果有精力，注册一个账号为别人解答问题也能极大提高个人能力。
经典书籍熟读之后，可以打开前面必备基础技能部分的链接。认真读对应标准，全面掌握知识
继续提高

有了前面的基础之后，前端基本算是入门了，这时候可能每个人心中都有了一些学习方向，如果还是没有。 可以参考前面必备技能部分提到的那两个项目，从里面选一些进行发展学习。以下是一些不错的方面：

Grunt：前端自动化工具，提高工作效率
less css：优秀的CSS预处理器
bootstrap：优秀的CSS框架，对没有设计师的团队很不错，与less结合使用效果完美
requirejs：AMD规范的模块加载器，前端模块化趋势的必备工具
Node.js：JavaScript也可以做后台，前端工程师地位更上一步
AngularJS：做Single Page Application的好工具
移动端web开发：智能手机的普及让移动端的流量正在逐步赶超PC端
Javascript内存管理：SPA长期运行需要注意内存泄露的问题
High Performance JavaScript(Build Faster Web Application Interfaces)
Best Practices for Speeding Up Your Web Site：重要技能
一些学习经历

工具

chrome dev tools：前端开发调试利器，着重注意几个功能：
console（重要）
elements:元素样式调整，很常用
sources：代码中添加断点，单步调试，以及单步调试过程中查看内存中的对象
watch expression：通过表达式查看当前内存中的值
call stack：查看调用栈，开启async，可以看异步调用栈（这个非常有用，尤其是ajax调试的时候）
scope variables：作用域链上的变量，非常有用
network：抓包查看每个请求，非常重要，前后端联调必备
timeline：分析渲染、js执行等等各个阶段，性能优化利器
emulation：模拟移动端环境，mobile页面开发必备
一些插件:

liveload: 修改页面后自动刷新，不用按F5
dimensions：直接在页面上测量的利器
livestyle：css样式修改后自动起效果，不需要刷新，elements修改后也能同步到代码中
image tool：测量，取色
UC二维码：移动端调试扫码必备
pagespeed，YSlow：页面性能分析和优化插件
马克飞象：优秀的在线markdown编辑器，快速写周报，做记录
sublime text2：编码方便，插件多，速度快，性能好
emmet：提升html编码速度必备
sublimelinter + 各种语言的lint和hint：代码纠错
一些snippets：自动补全，提升开发效率
Intellij IDEA和WebStorm：集成开发环境，集成了各种功能，开发比sublime要方便，但会比较吃性能
Mark Men：测量、取色、标注利器，拿到视觉稿之后第一个打开的软件
GFW Fucker：我用红杏，可以的话买个虚拟服务器当梯子
iHosts：非常优秀的hosts管理软件，轻松修改hosts，开发调试必备
Charles：Mac 平台最好用的抓包分析工具
Rythem：AlloyTeam出品的代理抓包软件，非常轻量，安装简单，移动端（真机）开发调试很好用
Wunderlist：一个非常不错的Todo List，任务、需求多的时候管理起来很方便
技能

前端的技能其实除了JavaScript（包括NodeJS）、HTML、CSS以外，还有很多。其实前端的技能树很大，这里只能列一些我开发中见到的说一说

语言基础

JavaScript：

作用域链、闭包、运行时上下文、this
原型链、继承
NodeJS基础和常用API
CSS：

选择器
浏览器兼容性及常见的hack处理
CSS布局的方式和原理（盒子模型、BFC、IFC等等）
CSS 3，如animation、gradient、等等
HTML：

语义化标签
进阶

JavaScript:

异步控制（Promise、ES6 generator、Async）
模块化的开发方式（AMD、CMD、KMD等等）
JavaScript解释器的一些相关知识
异步IO实现
垃圾回收
事件队列
常用框架使用及其原理

jQuery：基于选择器的框架，但个人认为不能叫框架，应该算工具库，因为不具备模块加载机制，其中源码很适合阅读钻研
AngularJS/Avalon等MVVM框架：着重理解MVVM模式本身的理念和双向绑定的实现，如何解耦
underscore：优秀的工具库，方便的理解常用工具代码片段的实现
polymer/React: 组件化开发，面向未来，理解组件化开发的原理
CSS和HTML：主要是CSS3的特性和HTML5的特性，以及浏览器处理的流程和绘制原理
DOM树、CSSOM树、渲染树的构建流程及页面渲染的过程
解析HTML、CSS、JavaScript时造成的阻塞
HTML5相关

SVG及矢量图原理
Canvas开发及动画原理（帧动画）
Video和Audio
flex box布局方式
icon fonts的使用
常用NodeJs的package：

koa
express
underscore
async
gulp
grunt
connect
request
一些理念：

响应式Web
优雅降级、渐进增强
dont make me think
网页可用性、可访问性、其中的意义
SEO搜索引擎优化，了解搜索引擎的原理
SPA的好处和问题
性能优化：

减少请求数量（sprite、combo）
善用缓存（application cache、http缓存、CDN、localstorage、sessionstorage，备忘录模式）
减少选择器消耗（从右到左），减少DOM操作（DOM和JavaScript解释器的分离）
CSS的回流与重绘
项目

版本管理：首推Git，用过Git都不会想用SVN了
Git：本地版本管理的机制
SVN：远程中心的版本管理机制
自动化构建：主要就是less、模板、coffee等的预处理以及对代码压缩和合并
Gulp：基于流构建，速度快、模块质量好
Grunt：独立任务构建，速度慢，配置蛋疼，灵活性高
预处理和模板引擎
less：语法简单，但功能有限
jade、ejs、velocity等模板引擎，各有各的长处
coffee：python工程师最爱，还没用过
环境搭建：主要是将线上代码映射到本地，并在本地启动一个demo服务器，至于模拟数据的mock，见仁见智了
本地代理：ihosts
自动化测试：在业务较为稳定的情况下，可以通过自动化测试来减少测试的事件，但需求较多的时候，维护测试用例的成本会很高，可能用自动化测试会起到反效果
jasmine
mocha
生态系统
npm
bower
spm
搭建一个属于自己的博客
git pages
hexo
jekyll
未来

Web Componets：面向未来的组件化开发方式
HTML模板
Shadow DOM
Custom Elements
HTML Import
移动端Native开发：这也是需要了解的，以后前端工程师会经常地和webview打交道，也要了解native开发
其他

有些东西不是考敲码就能弄好的，也要重视自己的素质发展

对于业务的思考：我个人这方面非常欠缺，所以放在最前面，在敲码前要多思考业务
交流和沟通能力：这个非常重要，前端同时需要与项目经理、产品、交互、后台打交道，沟通不善会导致很多无用功，延缓项目
知识管理、时间管理：input和output的平衡，output是最好的input。如何做好分享，参与社区，做好交流，作好记录
对新技术的渴望，以及敢于尝试
入门书

入门可以通过啃书，但书本上的东西很多都已经过时了，在啃书的同时，也要持续关注技术的新动态。这里推几本觉着不错的书：

《JavaScript高级编程》：可以作为入门书籍，但同时也是高级书籍，可以快速吸收基础，等到提升再回来重新看
《JavaScript权威指南》：不太适合入门，但是必备，不理解的地方就去查阅一下，很有帮助
《编写可维护的JavaScript》和：
《Node.js开发指南》：不错的Nodejs入门书籍
《深入浅出Node.js》：Nodejs进阶书籍，必备
《JavaScript异步编程》：理解JS异步的编程理念
《JavaScript模式》和《JavaScript设计模式》：JavaScript的代码模式和设计模式，将开发思维转变到JavaScript，非常好的书
《JavaScript框架设计》：在用轮子同时，应当知道轮子是怎么转起来的，讲解很详细，从源码级别讲解框架的各个部分的实现，配合一个现有框架阅读，可以学到很多东西
《Dont make me think》：网页设计的理念，了解用户行为，非常不错
《CSS禅意花园》：经久不衰的一部著作，同样传递了网页设计中的理念以及设计中需要注意的问题
《高性能JavaScript》和《高性能HTML5》：强调性能的书，其中不只是性能优化，还有很多原理层面的东西值得学习
《HTML5 Canvas核心技术》：我正在读的一本书，对于canvas的使用，动画的实现，以及动画框架的开发都非常有帮助
《HTTP权威指南》：HTTP协议相关必备，前端开发调试的时候也会经常涉及到其中的知识
《响应式Web设计》：技术本身不难，重要的是响应式网页的设计理念，以及移动先行的**
《JavaScript语言精粹》：老道的书，也是普及JavaScript的开发思维的一本好书，非常适合入门
一些不错的网站

github：没啥好说的，多阅读别人的源码，多上传自己的源码，向世界各地的大牛学习
codepen：感受前端之美的必选之地，里面有很多酷炫的效果和优秀的插件
echojs：快速了解js新资讯的网站
stackoverflow和segmentfault：基本上各种问题都能在上面获得解答
google web fundamentals：每篇文章都适合仔细阅读
static files：开放的CDN，很好用
iconfont：阿里的矢量图标库，非常不错，支持CDN而且支持项目
html5 rocks: 一个不错的网站，很多浏览器的新特性以及前沿的技术，都能在这上面找到文章
css tricks：如何活用CSS，以及了解CSS新特性，这里可以满足你
JavaScript 秘密花园 JavaScript初学必看，非常不错
w3cplus：一个前端学习的网站，里面的文章质量都挺不错的
node school：一个不错的node学习网站
learn git branch：一个git学习网站，交互很棒
前端乱炖：一个前端文章分享的社区，有很多优秀文章
正则表达式：一个正则表达式入门教程，非常值得一看
阮一峰的博客和张鑫旭的博客：快速了解某些知识的捷径，但是如果需要深挖，还需要其他的资源
各路大牛的博客：这个太多了，就不贴了，知乎上有很全的
各种规范的官方网站，不懂得时候读规范
byr论坛yiyizym的建议

与grunt相比，学习gulp会比较简单
做SPA的话，推荐backbone.js和 backbone.marionette.js
翻墙不用折腾，花十块钱买一个月的 红杏。
把基础打扎实了再学这些都没问题。
html 没什么好说的，有空学学html5。
css 尽量看文档 ，因为很多中文资料都各执一辞，看多了反而会糊涂。
有个网站可以查找html/css标签、属性在各个浏览器中的支持情况，挺好用的。
javascript 就看 javascript高级程序设计 。不过这么厚的书看过就会忘。对javascript核心概念的讲解：对象/原型链/ 构造函数/执行上下文/作用域链/闭包/this，这里有篇不错的文章。
有闲情可以看看 ecmascript 6，计划明年6月就发布啦。阮一峰的网站有入门资料。
jquery 有很多 API,这个网站可以方便查到。有时间弄清楚jquery deferred 的用法。
多给 sublimetext 装插件，比如说检查代码错误的，新建目录文件的，整理代码的

国内知名 IT 公司前端团队

Awesome Front-end Teams

国内知名 IT 公司前端团队 (排名不分先后)

百度 ( Baidu )

• FEX: http://fex.baidu.com/ ( GitHub )
• EFE: http://efe.baidu.com/ ( GitHub )

阿里巴巴 ( Alibaba )

• FED (淘宝前端): http://taobaofed.org/
• TaobaoUED (淘宝): http://ued.taobao.org/
• AMFE (淘宝手机前端): https://github.com/amfe/article
• Alinode: http://alinode.aliyun.com/blog
• TmallFE (天猫前端): https://tmallfe.github.io/
• THX (阿里妈妈 MUX): http://thx.github.io/

腾讯 ( Tencent )

• IMWeb: http://imweb.io/
• AlloyTeam: http://www.alloyteam.com/
• ISUX: http://isux.tencent.com/
• TID: http://tid.tenpay.com/

奇虎 360 ( Qihoo 360 )

• 奇舞团: http://www.75team.com/

新浪 ( Sina )

• 新浪 UED: http://ued.sina.com.cn/

京东 ( JD )

• 凹凸实验室: http://aotu.io/ ( GitHub )

美团 ( Meituan )

• 美团前端: http://fe.meituan.com/

去哪儿 ( Qunar )

• UED: http://ued.qunar.com/
• MFE: http://ued.qunar.com/mobile/blog/

携程 ( Ctrip )

• 携程设计委员会: http://ued.ctrip.com/

大搜车（Souche）

• 大搜车前端团队：http://f2e.souche.com/blog/

豆瓣 ( Douban )

• 豆瓣前端: https://github.com/douban-f2e

Chrome 插件集

使用说明

• 以下所有插件链接均为Google官方链接，需要先自行翻墙(点我马上翻墙)方可打开。

目录

• 前端开发
• 后端开发
• 辅助增强
• 设计
• 产品
• 音频视频
• 书签阅读
• 翻译
• 科学上网
• 远程协助
• Tampermonkey脚本
• 非Chrome插件

前端开发

• 前段开发必备插件
  • React Developer Tools - ReactJs开发者工具。
  • PageSpeed Insights (with PNaCl) - 页面优化检测。
  • WEB前端助手 - 百度出的一款前段小工具集合，很好用。
  • RegExp Tester - 正则表达式测试工具。
  • Advanced REST client - 测试HTTP请求。
  • CSS Grady - 可以快速调整浏览器窗口的尺寸，用于观察网站页面宽度。
  • Flag for Chrome - 在地址栏显示网站所在地区的国旗，还可以显示RP值和alexa排名。
  • CSS-Shack - 允许您创建图层样式（就像图像编辑软件），并将其导出为 CSS 文件，或者复制到剪贴板。
  • JSON Formatter - 格式化JSON，非常好用。
  • Postman - 前端程序员不可缺少的插件Postman。
  • Wappalyzer - 检测网站使用的架构。
  • EditThisCookie - EditThisCookie是一个cookie管理器。您可以添加，删除，编辑，搜索，锁定和屏蔽cookies。
  • AngularJS Batarang - 调试AngularJS插件。
  • Vue.js devtools - Vuejs调试插件。
  • Web Developer - 各种Web开发小功能。
  • YSlow - YSlow可以分析网页，并为改善网页性能提出修改建议，这些功能基于高性能网页的规则集。
  • Lorem Ipsum Generator - Chrome地址栏中以图标形式提示JavaScript错误。
  • Window Resizer - 此扩展可以调整浏览器窗口的大小，以适应各种屏幕分辨率。
  • [jQuery Shell](Window Resizer) - jQuery扩展让你在当前网页中运行JavaScript和jQuery命令。
  • WhatFont - 查看当前页面使用了哪些字体。
  • Pretty Beautiful Javascript - 使Javascript文件更容易阅读，添加高亮，格式化。
  • Firebug Lite - Firebug的精简版。
  • SnappySnippet - 抽离页面组件代码。
  • Validity - 快速验证你的 HTMl 文档明显错误。
  • Responsive Web Design Tester 移动端页面适配利器。
  • Chrome Sniffer Plus 查看网站使用了哪些技术。
  • Clear Cache 清除页面缓存。
  • Web Server for Chrome 快速启动小项目或Demo的神器。

后端开发

• 后台开发插件汇聚

辅助增强

• 辅助性质的插件
  • Atomic Chrome - 同步网页输入框至Atome本地编辑器中。
  • GitHub Awesome Autocomplete - Github搜索增强插件。
  • Octotree - Github文件树状结构，方便快速阅读文件。
  • Tampermonkey - Tampermonkey可以添加不同插件实现类似于Chrome插件功能，社区相当活跃。
  • 掘金 - Github文件树状结构，方便快速阅读文件。
  • Vimium - 在Chrome中使用Vim的快捷键，简直完美。
  • 二维码(QR码)生成器(QR Code Generator) - 二维码生生成工具。
  • Google文档 - 使用Google文档、表格和幻灯片来查看和编辑Microsoft Word、Excel和PowerPoint文件。
  • 图像浏览器 - 可以很好的查看独立打开的图片。
  • Coding - Coding 让开发更简单！
  • Visualping - 内容更新实时提醒，抢购东西必备。
  • 一键管理所有扩展 - 一键管理所有插件，可以一键禁用所有插件。
  • word highlight - 为您提供当前浏览网站的站内搜索功能。
  • SmoothScroll - 页面平滑滚动的，效果超赞。
  • Any.do - GTD任务管理。
  • 番茄计时器 - 应用番茄工作法，使你提高专注及效率。
  • 500px Image Downloader - 500px图片右键下载。
  • 莆田系医院网站提醒 - 莆田系医院网站提醒，对于莆田系无良网站，将显示红色警告提示，并给出它的医院名字和所在城市。。
  • 迅雷、QQ旋风-链接自动转换 - 自动转换迅雷、QQ旋风、快车专用链的工具。
  • IP Address - 查询每个IP 地址、域名和提供程序的详细的信息。
  • **天气预报(APP) - **天气预报，首款可换肤动态天气插件，实时预报全国实况天气。
  • Adblock Plus - 广告拦截插件。
  • crxMouse Chrome Gestures - 一个鼠标手势插件，非常好用。
  • LastPass - 密码记录表单。
  • Fatkun图片批量下载 - 可以批量下载图片。
  • Imagus - 鼠标移动图片上会放大原图，看微博浏览图片很方便 。
  • Stylish - 可以根据自己喜好自定义修改页面css样式。
  • 百度识图 - 百度识图插件版。
  • 支付宝安全插件 - 支付宝安全插件，网购的必须安装。
  • ChromeReloadPlus - 网页定时自动刷新。
  • 哔哩哔哩助手 - 哔哩哔哩弹幕网辅助扩展，可以替换HTML5播放器、绕过区域限制、推送通知并进行一些快捷操作。
  • 百度贴吧助手 - 百度贴吧自动签到，自定义表情，阅读魔法书，翻转帖子中图片，设置朋友昵称，自定义背景图，一键换号，大召唤系统，吧务工具扫描广告贴，等等。
  • Session Manager - 打开了很多网页并且还没消化完网页的信息就要关机时，又不想收藏，可以加个会话，以后想看可以继续看。
  • Papier - 一个记事本，很简约。

    设计

• 设计师插件汇聚
  • Text Mode - 黑白显示页面，图片将替换成色块方便查看页面布局是否合理。
  • Blipshot — one click screenshots - 生成网页截图。
  • Color Picker and Converter - 一个色盘插件。
  • ColorPicker - 一个网页拾色。
  • Pixlr Editor - 离线版PhotoShop可以处理简单的图片。
  • IcoMoon - 在线小icon可以直接选择引用。
  • ColorZilla - 网页取色器。
  • MeasureIt! - 测量一个网站中的任何元素的尺寸。
  • The Microstock Photo Power Search Tool! - 一个强力的图片搜索工具。
  • Palette Creator - 您只需右键点击任何图片。此插件可以创建一个16、24或32调色板。

产品

• 产品经理用的一些插件
  • Axure RP Extension for Chrome - Axure RP Chrome浏览插件。
  • Gliffy Diagrams - 轻松地创建具有专业外观的图表和流程图。
  • Moqups - 创建清晰的实物模型，线框图和交互原型。

音频视频

• 音频视频相关的插件整理
  • 声海盗 - 可以下载页面上的音频文件。
  • 维棠视频下载助手 - 很出名的维棠视频下载助手。

书签阅读

• 书签同步管理相关插件
  • Pocket - 离线阅读。

翻译

• 翻译相关插件
  • 划词翻译 - 选中单词即可翻译。
  • 百度翻译 - 百度翻译。

科学上网

• 科学上网插件整理
  • Proxy Switchy - 自动代理切换，主要是翻墙用。
  • 红杏 - 红杏翻墙。
  • 新壁虎漫步 - 新壁虎漫步翻墙。

远程协助

• 远程协助相关插件
  • TeamViewer - TeamViewer的远程协助网页版，用起来并不会感觉卡。

非Chrome插件

• 以下列表为优秀的在线功能性网站
  • 马克飞象 - 在线的Markdown编辑器。
  • 百度脑图 - 百度在线脑图制作。
  • 在线API文档 - 很全面的在线API文档。
  • 百度翻译 - 百度在线翻译。
  • 有道翻译 - 有道在线翻译。
  • JSBin - 一个在线编辑器，写demo不错。

Tampermonkey脚本

• 以下三个站点为脚本集合站，拥有大量的脚本，也是官方推荐的站点
  • OpenUserJS - OpenUserJS 继 GreasyFork 之后开始创办。它由 Sizzle McTwizzle 创建,同样地,在其储存库中也拥有大量的脚本资源。
  • GreasyFork - 储存库中有大量的脚本资源。
  • Userscripts.org - 你可以在这个网址找到历 史资源。
• 以下为优秀的脚本收集
  • 知乎免登录 - 知乎免登录查看回答全文并显示更多回答。
  • 购物党比价工具 - 京东.淘宝.天猫.易迅.亚马逊**.一号店.苏宁易购.当当网.国美在线.新蛋网**.拍拍网自动比价。
  • 去广告/去除百度推广以及无用功能 - 去掉百度推广以及辣鸡推广。
  • BiliBili HTML5 - BiliBili调用官方HTML5播放器播放。
  • 百度贴吧：不登录即可看贴 - 百度贴吧看贴（包括楼中楼）无须登录。
  • Download YouTube Videos as MP4 - 下载YouTube视频。
  • 网页限制解除 - 通杀大部分网站，可以解除禁止复制、剪切、选择文本、右键菜单的限制。
  • 解决百度云大文件下载限制 - 一行代码，解决百度云大文件下载限制。
  • 跳过网站等待、验证码及登录 - 移除各类网站验证码、登录、倒计时及更多!
  • 网盘自动填写密码【增强版】 - 网盘自动填写提取密码【增强版】+网盘超链接与提取码融合。
  • 百度云插件+APIKey - 在百度云网盘的页面添加一个搜索框，调用搜索API搜索所有公开分享文件。
  • 去百度搜索置顶推广 (ECMA6) - 去除插入在百度搜索结果头部、尾部的推广链接。
  • 老司机传说 - 支持琉璃神社、灵梦御所等，全自动，自己研究去吧。
  • Youku-html5-Player - 优酷调用H5播放器，可跳过广告直接播放，但只能以标清模式来观看。
  • YouTube + - 总之是用YouTube的神器，必装。
  • 百度音乐助手 - 百度音乐下载助手,突破百度音乐会员限制,带您自由畅享高品质音乐。
  • 网易云音乐高音质支持 - 去除网页版网易云音乐仅可播放低音质（96Kbps）的限制，强制播放高音质版本。
  • 虾米音乐助手 - 虾米音乐助手带您下载虾米音乐。
  • Discuz-download - Discuz类型论坛附件下载权限绕过。
  • 百度盘直接下载 - 不用安装百度管家也可以下载大文件。
  • 右键在新标签中打开图片时显示最优化图像质量 - 支持：谷歌(G+ blogspot picasa)、Tumblr、推特、Steam、新浪微博、腾讯微博、知乎、豆瓣、百度贴吧。
  • youkuvod - 第三方服务解析视频,ckplayer播放视频,去掉优酷广告。
  • 网易云音乐下载 - 网易云音乐下载地址，在歌曲页面上所属专辑下面会出现歌词和歌曲的下载链接。
  • Super_preloaderPlus_one - 预读+翻页，全加速你的浏览体验（看小说，看新闻）。
  • 360,百度网盘,微盘链接 - 360,百度网盘,微盘链接自动添加访问密码。
  • 斗鱼TV开启CDN加速 - 斗鱼TV开启CDN加速，提升画质，减少卡顿。
  • 查看发帖 - 查看百度贴吧某用户在某贴吧或者全部贴吧的发言。
  • BaiduMonkeyW - 改善百度的搜索结果界面，提高阅读效率。
  • 护眼脚本 - 修改网页背景色，让网页背景色偏白的部分变成乡土黄、豆沙绿或者浅色灰，更加护眼。默认护眼色是乡土黄。
  • 网盘提取工具 - 尽可能在支持的网盘（新浪微盘、百度网盘、360云盘等）自动输入提取码，省去下载的烦恼。
  • 115 Online Player - 115在线视频播放。
  • MoreMovieRatings - 豆瓣和IMDb互相显示评分。
  • Discuz隐藏贴自动回复+刷新 - Discuz隐藏贴自动回复+刷新。
  • vipVideos_skipAd - 配合ABP去视频广告，开启GPU加速。
  • baidu-music-download - 快速免费下载百度音乐。
  • True URL downloads - 迅雷、快车、QQ旋风等专有链解密。
  • Tieba Preload - 贴吧预加载，自动加载下一页内容，同时附带消灭贴吧自带 Lazy Load 功能。
  • 豆瓣电影下载辅助 - 在豆瓣电影右侧给你提供下载地址。
  • 百度音乐盒去广告 - 突破会员限制，去除百度音乐盒广告。
  • 百度贴吧图片缩放增强脚本 - 增强百度贴吧图片缩放，看大图无需开新标签页。
  • Video Full Screen In Tab - 让所有视频网页全屏。
  • YouTube Download - 下载YouTube视频，比上面那个好用些。
  • Video.Clean.Player - 去除国内常见视频网站的播放前视频广告。
  • 知乎真实链接地址重定向 - 让知乎网页中的站外链接直接跳转至目标网址，而不经过一个二次跳转页面。
  • 福利吧网盘自动补全 - 自动补全页面中的网盘地址（支持百度网盘和115礼包）。
  • 百度贴吧科学看图君 - 去除百度贴吧的连续看图模式，改为点击新标签打开无水印原图，同时支持帖子预览中“查看大图”按钮。。
  • Github Rawgit Button - 给Github添加“Rawgit”按钮。
  • Github Comment Enhancer - Github评论插件。
  • GitHub file list beautifier - 给Github文件添加不同颜色显示，同事添加文件类型图标。
  • Github Image Viewer - 预览Github图片。
  • GitHub TOC - 给Gihub的REAMD文件添加导航菜单。
  • GitHub Sort Content - Github排序脚本。
  • GitHub Diff Links - 添加当前文件版本前后按钮方便对比代码

---

其他综合

• 私人珍藏的CHROME插件，吐血推荐
• 前端程序员必知的30个Chrome扩展
• 我的 Chrome 插件集

Linux 软件收集

应用

音频

• Airtime - Airtime 是一款用于调度和远程站点管理的开放广播软件
• Ardour - 在 Linux 上录音，编辑，和混音
• Audacious - 开源音频播放器，按你想要的方式播放你的音乐，不占用你其它任务的电脑资源。
• Audacity - 免费，开源，跨平台的声音录制、编辑软件。
• Audio Recorder - 简单的声音录制软件，就在 ubuntu ppa。
• Clementine - 播放无数的有损和无损音频格式。
• Cmus - cmus 是一款类 Unix 系统下小巧，快速且强大的终端音乐播放器。
• Google Play Music - 非官方但很漂亮的跨平台 Google Play Music 桌面客户端。
• Harmony - 有着整洁界面且兼容云的音乐播放器。
• Hydrogen - GNU/Linux 上的高级电子鼓。
• K3b - K3b - Linux 上的 CD/DVD 创建工具 - 为 KDE 特别优化。
• Kid3Qt - 编辑多媒体文件的标签，如一个专辑所有 mp3 文件的艺术家，专辑，年代，流派。
• KxStudio - KXStudio 是专业声音创作应用和插件的集合。
• Let's make music - 在你的 PC 上制作音乐，创造旋律和节拍，合成，混音，编曲小样以及更多内容。
• Lollypop - Lollypop 是一款新的 GNOME 音乐播放应用。
• Lyricfier - 一个 Spotify Lyrics 的替代选择。
• Mixxx - 免费的 DJ 软件，给你一切现场混音所需要的，名副其实的 Traktor 替代品。
• Museek - 一款简单，干净，跨平台的音乐播放器。
• Netease Music - 网易云音乐播放器
• Oceanaudio - ocenaudio 是一款跨平台，易用，快速且功能强大的音频编辑器。对需要编辑和分析音频文件的人来说是个理想的软件。
• OSD Lyrics - 与你最爱的媒体播放器显示歌词。
• Quod Libet - 一款编写时就考虑了很多库的 GTK+ 音乐播放器。Quod Libet 支持基于搜索的动态播放列表，正则，标签，回放增益，播客以及互联网广播。
• Rhythmbox - 来自 GNOME 的音乐播放器。
• Sayonara Player - Sayonara 是一款小巧干净，快速的音频播放器，使用 C++ 编写，基于 Qt 框架。
• Soundnode - 一款开源的 SoundCloud 桌面应用。
• SoundJuicer - CD 抓取工具，for GNOME
• Spotio - 受 Rdio 启发的 Spotify 桌面应用亮色主题。
• Tomahawk - 一种新的音乐播放器，集合你所有的流媒体，下载，音乐云存储，播放列表，电台等。

聊天客户端

• Chatty - Chatty 是一款 Twitch 聊天客户端，它是为那些想尝试不同于 web 聊天的新事物，又不想像 IRC 客户端那样复杂或错过 Twitch 特色功能的用户准备的。
• Cutegram - 提供比官方 Telegram 应用更多的特性。
• Discord - 为玩家准备的多合一语音文本聊天工具，免费，安全，同时支持桌面和手机。
• Franz - Franz 是一个免费的消息应用，结合了许多聊天及消息服务到单独的一个客户端中。
• GhettoSkype - Skype 的开源 web 封装。
• Gitter - Gitter — 开发者交流的地方。Gitter 的设计目标是让社区消息，协作和发现尽可能地简单。
• HexChat - HexChat 是一款基于 XChat 的 IRC 客户端，但和 XChat 不一样的是它对 Windows 和 Unix-like 系统都是完全自由的。
• Jitsi - Jitsi 是一款免费，开源的多平台语音，视频会议以及即时通讯应用，在 Windows, Linux, Mac OS X 和 Android 上可用。
• Messenger for Desktop - Facebook messenger 应用。
• Pidgin - 一款通用聊天客户端。
• qTox - 一款简单的分布式，安全的通讯软件，支持音频和视频聊天。
• Rambox - 免费，开源且跨平台的消息及邮件应用，整合常见的 web 应用为一体。
• ScudCloud - 一款 Linux 下的 Slack 客户端。
• Slack - 现代团队的即时通讯，归档及搜索沟通工具。
• Skype - Skype 让世界保持沟通，免费的。
• Telegram - 一款专注于速度和安全的消息应用，它非常快，简单而且免费。
• Viber - Viber for Linux 让你在任何设备，网络和国家给其他 Viber 用户免费发送消息和通话。
• Weechat - WeeChat 是一款快速，轻量级，可扩展的聊天客户端。

数据备份与恢复

• Borg Backup - 一款不错的的备份工具。
• Deja Dup - 一款内置加密的简单备份工具。
• Duplicity - Duplicity 通过生成加密的 tar 格式卷备份目录，并且可以上传备份到远端或本地文件服务器。
• Photorec - PhotoRec 一款数据恢复应用，为恢复硬盘，CD-ROM 上包括视频，文档以及归档等文件而设计，以及数码相机存储中丢失的相片（Photorec 的由来）。
• Qt4-fsarchiver - qt4-fsarchiver 是 fsarchiver 的图形化界面，能够保存/恢复分区，文件夹和 MBR/GPT 分区。这个程序是基于 Debian 的系统，Suse 以及 Fedora 适用的。
• rclone - Rclone 是一款命令行工具，用于同步文件和目录到不同的云存储方案。它还允许备份加密。
• System Rescue CD - SystemRescueCd 是一款 Linux 系统急救盘，提供可启动的 CD-ROM 或 U 盘，用于管理系统在崩溃后修复系统和数据。
• Test Disk - TestDisk 是一款强大的免费数据恢复软件！它主要设计用于帮助回去丢失的分区和/或修复由软件错误导致的硬盘无法启动引导。
• Timeshift - TimeShift 是一款系统还原工具，它用 rsync 和硬链接创建系统的增量快照。快照可以在一段时间后用于恢复，撤销快照生成以来所做的所有更改。快照可以手动生成或用定时任务自动生成。

桌面个性化

• Adapta Theme - 一款自适应的 Gtk+ 主题，遵循 Material 设计指南。
• Arc Icon Theme - 一款可以和 Moka 图标主题一同使用的现代图标主题。
• Arc Theme - 带有透明元素的扁平化主题
• Compiz Config settings manager - OpenCompositing 项目带来的提高 X Window 系统可用性和生产力的 3D 桌面视觉特效。
• Conky - Conky 是 X 下一款免费，轻量的系统监视器，可以在你桌面显示任何类型的信息。
• Flatabulous Arc Theme - 我最爱的 ubuntu 主题。
• Flatabulous - 一款扁平化主题，适用于 Ubuntu 以及其它基于 Gnome 的 Linux 系统。
• Gnome Extensions - Gnome 桌面环境扩展插件。
• Gnome Look - 大量社区创建的图标，shell 主题，字体，以及其他更多的可用来个性化你的 Gnome 桌面环境的资源，都在这一个站点。 Freeware
• Hardcode Tray - 这个脚本通过在 Linux 中自动探测你默认主题，正确的图标尺寸，硬编码内嵌图标应用，以及正确的状态图标来修正硬编码的托盘图标。
• Irradiance Theme - 一款受 OSX Yosemite 启发的 Unity 主题，基于 Radiance。
• La Capitaine Icon Theme - 一款受 macOS 和 Material 设计启发的图标主题，目标是适配大部分桌面环境。
• Numix Icon Theme - Ubuntu 最好的图标主题之一。
• Numix Theme - 一款很流行的主题。
• Paper Icon Theme - Paper 是一款现代 freedesktop 图标主题，它的图表设计注重强烈的色彩和简单的几何形状。
• Papirus Icon Theme - Linux 系统 SVG 图标主题，基于 Paper 主题并有一些额外的特性（如硬编码托盘支持，kde 颜色方案支持，libreoffice 图标主题，filezilla 主题，smplayer 主题...）以及其它的修改。这个主题适用于 GTK 以及 KDE。
• Unity Tweak Tool - Ubuntu unity 个性化必备应用。
• Yosembiance theme - 一款受 OSX Yosemite 启发的 Ambiance 改款主题。

开发

• Android studio - Android 的官方 IDE：Android Studio 提供在各种类型的安卓设备上构建应用最快的工具。
• Aptana - Aptana Studio 利用了 Eclipse 的灵活性并且专注于让它成为强大的 web 开发引擎。
• Arduino IDE - 开源的 Arduino 软件（IDE）让编写代码和上传代码到开发板变得简单。
• BlueJ - 一款为新手设计的免费 Java 开发环境，世界范围内数百万人使用。
• Clion - 一款强大的跨平台 C 以及 C++ IDE。
• Code::Blocks - Code::Blocks 是一款为满足大部分用户需求构建的免费的 C，C++ 以及 Fortran IDE。它可扩展并且可配置性强。
• Codelite - 一款免费，开源，跨平台的 C，C++，PHP，以及 Node.js IDE。
• DBeaver - 一款通用数据库客户端，支持多个平台及多种数据库。
• Eclipse - Eclipse 以 Java 集成开发环境而闻名，但它的 C/C++ IDE 和 PHP IDE 同样出色。
• Fish - 一款智能且用户友好的命令行 shell。
• Fisherman - 一款 fish shell 插件管理器。
• Fossil - 自包含，分布式软件配置管理系统，带有集成 bug 追踪，wiki，技术说明和 web 界面。
• Fritzing - Fritzing 是一个开源硬件项目，它让电子部件变成人人都能接触到的创造性材料。
• Geany - Geany 是一款基于 GTK+ 的文本编辑器，带有基本的集成开发环境特性。它的开发是为了提供一个小型并且快速的 IDE，对其它包只有很少的的依赖。
• Genymotion - Genymotion 是一款可以用来替代默认安卓模拟器的第三方模拟器。
• Giggle - Giggle 一款 git 内容追踪的图形化前端。
• Git - Git 是一款免费和开源的分布式版本管理系统，被设计用来快速和高效地处理从小项目到大项目的一切内容。
• GitCola - Git Cola 是一款整洁且强大的图形化 Git 客户端。用 Python 写就并签署于 GPL 协议。
• Gitg - gitg is the GNOME GUI client to view git repositories.
• GitKraken - 强大酷炫的 Git 图形化客户端，支持 Windows，Mac 以及 Linux。
• Insomnia - 一款简单，漂亮且免费的 REST API 客户端。
• IntelliJ IDEA - 强大的 Java IDE。
• Ipython - 强大的 Python shell。
• Jupyter Notebook - 开源，交互式数据科学和科学计算，支持超过 40 种编程语言。
• KDevelop - 免费，开源 IDE，全功能，支持插件扩展的 C/C++ 以及其它编程语言 IDE。
• Komodo Edit - 免费，开源的多语言开发环境。
• MariaDB - 最流行的数据库服务器之一。由原 MySQL 开发者打造。
• MonoDevelop - 跨平台的 C#，F# 以及更多语言的 IDE。
• Nemiver - Nemiver 项目编写集成到 GNOME 桌面环境的独立图形调试器。
• Netbeans - NetBeans IDE 让你快速而且容易地开发 Java 桌面，移动以及 web 应用，还有基于 HTML，JavaScript 以及 CSS 的 HTML5 应用。
• NodeJS - Node.js® 是一个基于 Chrome V8 JavaScript 引擎的 JavaScript 运行时环境。
• Oh-my-fish - 提供各种插件和主题以扩展你的 fish shell 功能。
• Oh-my-zsh - 一个由社区驱动，优雅的 zsh 配置管理框架。
• Pick - 简单的拾色器。
• Postgresql - PostgreSQL 是一款强大，开源的对象-关系型数据库系统。
• Postman - Postman，帮助我们快速测试 API。
• PyCharm - 强大的 Python IDE。
• QT Creator - 全功能跨平台集成开发环境，轻松创建互联设备，用户界面以及应用程序。
• Rabbit VCS - RabbitVCS 是一个图形工具的集合，提供一个与你使用的版本控制系统简单而直接的访问方式。
• Sloeber IDE - Sloeber IDE。Eclipse 的 Arduino IDE。我很喜欢它。
• SmartGit - SmartGit 是一款 Git 客户端，支持 Github 的 Pull Requests 和评论以及 SVN。
• Sqlite Browser - 可视化创建，管理，以及查看 sqlite 数据库文件。
• StarUML - 一款精致的软件塑造者。
• Swift - Swift 是一个通用编程语言，基于更现代的安全，性能，和软件设计模式为目标设计。
• Ubuntu-SDK - Ubuntu 官方 SDK。
• Zeal - Zeal 是一款面向软件开发者的离线文档阅读器。
• Zsh - 一款强大的命令行 shell。
• Wireshark - Wireshark 是世界领先的网络协议分析器。它让你可以在微观层级观察你的网络上发生了什么。它是许多工业和教育行业事实上的（经常也是法律上的）标准。

电子书工具

• Buka - 电子书管理。
• Calibre - 难以置信的丑但很强大的电子书管理和转换软件。
• Evince - Evince 是一款支持多种格式的文档查看器。Evince 的目标是用一个简单的应用取代已经存在于 GNOME 桌面的多种文档查看器。
• FBReader - 最流行的电子阅读应用之一。
• Foxit - Foxit Reader 8.0——获得殊荣的 PDF 阅读器。
• Lucidor - Lucidor 是一个阅读和处理电子书的电脑软件。Lucidor 支持 EPUB 格式的电子书和 OPDS 格式的目录。
• MasterPDF editor - Master PDF Editor 一款方便而智能的 Linux PDF 编辑器。
• MuPDF - 一款轻量级的 PDF 和 XPS 查看器。
• Okular - Okular 由 KDE 原始开发的通用文档查看器。Okular 可以在多个平台上工作，包括但不限于 Linux，Windows，Mac OS X，*BSD 等等。
• qpdf - qpdfview 是一款标签页式文档查看器。
• Sigil - Sigil 是一款多平台 EPUB 电子书编辑器。

编辑器

• Atom - 21 世纪的可 hack 文本编辑器。
• Bluefish - Bluefish 是一款面向程序员和 web 开发者的强大编辑器，带有很多编写网站，脚本和代码的选项。
• Brackets - 懂 web 设计的现代文本编辑器。
• Emacs - 可扩展，可个性化，免费/自由的文本编辑器——还有更多。
• Geany - Geany 是一款使用了 GTK+ 工具集的文本编辑器，带有基本的集成开发环境功能。它的开发是为了成为一个小型又快速的 IDE，对其它包仅有不多的依赖。
• Gedit - gedit 是 GNOME 文本编辑器。尽管以简单易用为目标，gedit 仍然是个强大的多功能编辑器。
• Kakoune - 受 Vim 启发。更少的击键次数带来更快的速度。多重选中。直角设计。它的命令与 vi 的相似，并且适用 Vi 的“快捷键作为文本编辑语言”模型。专注于交互，大部分命令提供直接和增量的结果，相对 Vim 还是很有竞争力的（击键次数上）。 (Github)
• Kate - Kate 是一个多文档编辑器，从 KDE 2.2 开始就是 KDE 的一部分了。
• Lighttable - 下一代代码编辑器！支持实时编码。
• Spacemacs - 社区驱动的 Emacs 版本。
• Sublime - 有史以来最好的编辑器之一。
• Textadept - 程序员的极简编辑器。支持 Lua 编程语言扩展。
• Vim -Vim 是一个高级文本编辑器，寻求以更完整的功能集提供事实上的 Unix 编辑器“Vi”的强大功能。无论你已经在使用 vi 或其它编辑器，它都十分有用。
• VSCode - Visual Studio Code 是一款轻量但强大的代码编辑器，提供 Windows，OS X 以及 Linux 版本。它内置了 JavaScript，TypeScript 以及 Node.js 支持，并且对其它语言（C++，C#，Python，PHP）还有丰富的插件系统和运行环境。

教育

• BibleTime - BibleTime 是一款基于 Sword 库和 Qt 工具集的圣经学习应用。
• Celestia - 免费的空间模拟器，让你在三维空间中探索我们的宇宙。
• Chemtool - Chemtool 是一款在 Linux 上绘制化学结构的小程序。
• Epoptes - 一款开源的计算机实验室管理和监视工具。
• GAP - 计算离散代数领域内的一个优秀系统,主要专注于计算群论的计算。
• Gcompris - GCompris 是一款高质量教育软件，由无数适合 2 到 10 岁儿童的活动组成。
• Geogebra - 图形计算器，支持函数，几何，代数，微积分，统计以及 3D 数学。
• GNU Typist - 基于 ncurses 的免费打字教学软件
• GNUKhata - 开源会计软件。
• Google Earth - Google Earth 是一款虚拟地球，地图以及地理信息程序。
• GPeriodic - GPeriodic 是一个 Linux 上的元素周期表应用。
• ITalc - iTALC 是一款为老师准备的实用并且强大的教学工具。它让你有多种方式查看和控制你网络中的其它计算机。
• KDE Edu Suite - 基于 KDE 技术的免费教育软件。
• Ktouch - KTouch 是一款学习和练习触摸输入的程序。
• MAPLE - Maple 是一款数学软件，它结合了世界上最强大的数学引擎以及一个让它十分易于分析，探索，可视化以及解决数学问题的界面。
• MATLAB - MATLAB 平台专为剞劂工程和科学问题优化。MATLAB 让你的想法不仅仅停留在桌面。你可以在巨大的数据集上进行你的分析并按比例增加你的集群和云。
• Maxima - Maxima 是一个处理符号和数值表达式的系统，包括微分，积分，泰勒级数，拉普拉斯变换，常微分方程，线性方程组....
• Moodle - 在线学习课程管理系统。
• OpenEuclid - OpenEuclide 是一款 2D 几何软件：数据由描述形式化的几何约束动态定义。
• OpenSIS - 学校管理软件。
• PARI/GP - 一种针对数论中的快速计算(大数分解，代数数论，椭圆曲线...) 而设计的广泛应用的计算机代数系统。
• SageMath - 一个覆盖许多数学功能的应用软件，包括代数、组合数学、计算数学和微积分。
• Scipy - SciPy 是一个基于 Python 的开源软件生态系统，面向数学，科学，以及工程学。
• Scratch - 有了 Scratch，你可以编程你自己的互动故事，游戏，以及动画——并且在在线社区和其他人分享你的创造。
• Stellarium - Stellarium 是一个为你电脑准备的免费开源天文馆。
• Tux4Kids - Tux4Kids 为孩子们开发高质量软件，目标是将乐趣和学习结合到一起。
• UGENE - UGENE 是一款免费开源，跨平台，基于图形界面的生物信息学软件。

电子邮件

• Evolution - Evolution 是一款个人信息管理应用，集成了邮件，日历以及地址簿功能。
• Geary - Geary 是一款为 GNOME 3 构建的电子邮件应用。它让你可以在一个简单，现代的界面上阅读和发送邮件。
• Mailnag - Mailnag 是一个向 POP3 和 IMAP 服务器检查新邮件的守护程序。
• N1 - 在现代 web 上构建的可扩展桌面邮件应用。
• Sylpheed - 轻量化，用户友好的电子邮件客户端。
• Thunderbird - Thunderbird 是一款免费的电子油价客户端，设置以及个性化简单方便，功能强大。
• Wmail - Gmail & Google Inbox 的非官方 Linux 桌面客户端。

文件管理器

• 7Zip - 解压任何压缩文件
• AngrySearch - Linux 文件搜索，结果输入即得。
• Double Commander - Double Commander 是一款跨平台的开源双栏文件管理器。它受 Total Commander 启发并有自己的新想法。
• Dolphin - Dolphin 是 KDE 桌面环境的默认文件管理器，易用且功能强大。
• Midnight Commander - 一个功能丰富的全屏文件管理器，你可以复制，移动和删除文件以及整个文件夹树。
• Nautilus - Nautilus（Files）鹦鹉螺是为适配 Gnome 桌面设计和行为所设计的文件管理器，给用户一个简单的方式导航和管理文件。
• Nemo - Nemo 是一款 Cinnamon 桌面环境下的文件管理器。
• QDirStat - 基于 Qt 的文件夹统计——不用 KDE 的 KDirStat，来自原 KDirStat 开发者的作品。
• Ranger - Ranger 是一款使用 VI 快捷键的终端文件管理器。
• Synapse - Linux 上最好的应用启动器。
• Thunar - Thunar 被设计成为 Xfce 4.6 的默认文件管理器，为快速和易用设计。

游戏

• 0 A.D - 类帝国时代的开源即时战略游戏。
• Civilization5 - 席德梅尔的文明®被认为是有史以来最伟大的策略经营类游戏之一。
• Cockatrice - Cockatrice 是一个开源的多平台网络桌面卡牌游戏支持程序。
• Desura - 注：Desura 暂时不可用，但它可能在近期重新发布。Desura 是一个社区驱动的游戏玩家数字分发服务，将来自开发者的最好的游戏，模组，以及可下载内容放在玩家的指尖，随时可以购买和游玩。
• GBrainy - Gbrainy 是一个脑筋急转弯游戏，获得乐趣并且锻炼你的大脑。
• Minecraft - Minecraft 是一个关于放置方块和冒险的游戏。探索随机生成的世界，建造惊奇的事物，从最简单的家到最伟大的城堡。
• Minetest - 开源的 Minecraft 实现，由 C++ 写就（占用更少的资源），还包含模组扩展 API。
• PlayOnLinux - 在 Linux 玩 Windows 游戏。
• OhMyGiraffe - 令人愉快的生存游戏。一款关于吃水果和被狮子吃的长颈鹿的游戏。
• Simutrans - Simutrans 是一个免费而且开源的运输模拟器。
• Steam - 超赞的游戏平台，打开众多游戏的大门。
• SuperTuxCar - SuperTuxKart 是一款 3D 开源的赛车竞技游戏，有不同的人物，赛道以及模式。
• The Battle for Wesnoth - 免费，回合制策略游戏，幻想世界主题，有单人以及在线多人对战模式。
• TripleA - 世界著名的开源策略游戏。
• Warzone2100 - 开源即时策略/即时战术游戏。
• Wine - Wine（“Wine Is Not an Emulator”的首字母缩写）是一个兼容层，可以在若干 POSIX 兼容的系统上运行 Windows 程序，比如 Linux，Mac OS X，以及 BSD
• Xonotic - 受 Unreal Tournament 以及 Quake 启发的竞技场射击游戏。

图形

• Aftershot - 一个强大的 Adobe Photoshop 替代品！
• Agave - Agave 是 GNOME 桌面下一个很简单的程序，让你可以从一个颜色开始生成各种不同的配色方案
• Blender - 面向艺术家和小团队的免费开源的完整 3D 创作流水线。
• Cinepaint - 开源绘画软件
• Darktable - darktable 是一个开源的摄影处理软件，支持 RAW 文件处理
• Digikam - digiKam 是一个高级的 Linux 数字相片管理应用
• Feh - 轻量且快速的图片查看器。
• Fotoxx - Fotoxx 是一个免费开源的图像编辑和收藏管理程序。
• GIMP - GIMP 是一个自由分发的程序，可以进行照片修版，图像合成，图像编辑等操作
• gThumb - gThumb 是一款图片查看和浏览器（它还包含一个导入工具，用于从相机导入照片）。
• gwenview - KDE 桌面简单但强大的图片查看器和管理工具。
• Heron Animation - 免费的定格动画制作程序。
• Hugin - 基于 Panorama Tools 的一款易用的跨平台全景图像工具链。
• Inkscape - 不管你是插画家，设计师，web 设计师还是仅仅是需要创建一些矢量图像，它都是一款强大，免费的设计工具
• Karbon - 一款开源的矢量绘图程序。
• Kdenlive - Kdenlive 是一款非线性视频编辑器，比入门级的（线性）编辑器强大得多。
• Krita - 面向概念艺术家，数字画家以及插画艺术家的开源软件。
• Lightworks - 专业的非线性视频编辑程序，有免费版本可用
• Luminance HDR - Luminance HDR 是一款开源的图形化用户界面应用，它的目标是提供一整套的 HDR 图像工作流程。
• Mypaint - Mypaint 是一款配合画板使用的绘画程序。
• Ojo - 一款快速且漂亮的图像查看器。
• Open DVD Producer - 现代，开源，跨平台的 DVD 镜像生产软件。
• OpenShot - OpenShot 是一款免费，易用，功能丰富的 Linxu 视频编辑器。
• Photonic - Phototonic 是一款图片查看和组织工具。
• Pinta - Pinta 是一款免费，开源的绘画及图片编辑程序。
• Pitivi - 一款带有漂亮直观的用户界面的免费视频编辑器，有干净的代码库和出色的社区。
• Radiance - Radiance - 一款经过验证的光照模拟工具
• Ramme - 非官方 Instagram 桌面应用。
• RawTherapee - 一款漂亮的但不那么著名的照片编辑应用。
• Shotwell - Shotwell 是 GNOME 3 的图片管理器。
• StopMotion - Linux Stopmotion 是一款免费，开源的定格动画创作应用。它可以帮你捕捉和编辑你动画的帧，并导出为一个单独的文件。
• Synfig Studio - 开源 2D 动画软件。
• Vidcutter - 跨平台 Qt5 应用，用于快速简单的视频剪辑分段和合并编辑。
• Xara Extreme - Xara Xtreme for Linux 是一款强大，通用，适用于 Unix 平台（包括 Linux， FreeBSD）的图形处理程序。

互联网

• Anatine - 带有众多个性化的 twitter 桌面客户端。
• Brave - Brave 是 macOS，Windows，Linux 平台上一款快速，优秀的桌面浏览器。
• Chrome - 一款流行的浏览器，有着无数插件和应用。
• Chromium - Chromium 是一个开源浏览器项目，专注于为所有用户带来更安全、快速和稳定的 web 体验。
• Corebird - corebird 是一款原生 gtk+ twitter 桌面客户端。
• FeedReader - 一款现代的桌面应用，被设计用于补充已有的基于 web 的 RSS 账户，将所有的 web 服务优势集中到一个现代桌面应用中。
• Firefox - 一款流行的浏览器，有着无数插件和应用。
• Kaku - Ubuntu 开源 youtube 音乐播放器。
• Midori - 一款轻量级的免费浏览器，在低端机器上可以完美运行。 .
• Min - 智能，快速的 web 浏览器。
• Opera - Opera 浏览器是你畅游网络所需的一切。
• Tor - Tor 是免费软件和一个开放网络，帮助你对抗流量分析（一种网络检测的方式，威胁个人自由与隐私）。
• GnomeTwitch - 在你的 GNU/Linux 桌面上用这款非 Adobe-flash Twitch 客户端享受 Twitch。
• Vivaldi - 一款新兴的浏览器，有着许多的个性化配置。
• Yandex - 快速方便的浏览器。
• youtube-dl - YouTube 视频下载神器，是一个 Python 编写的命令行视频下载器，同时支持其它一些视频网站或平台。注意：国内用户若要下载 YouTube 视频，需要给它添加 --proxy 参数，指定代理下载。 .

办公

• Gummi gtk2|gtk3 - 带有模板，拼写检查以及向导的简单 latex 编辑器。
• Caligra Office - 提供满足办公，图形以及管理需要的综合应用套件。
• GnuCash - GnuCash 是一款自由的会计程序，实现了复式记账系统。它最初的目标是开发出与 Intuit, Inc. 的 Quicken 类似的功能，但它还有针对小企业会计的功能。
• KMyMoney - KMyMoney 是 KDE 的一款个人金融管理器。它的操作类似 Microsoft Money 以及 Quicken。
• LaTeXila - LaTeXila 是一款 GNOME 桌面下的 LaTeX 编辑器。
• LibreOffice - Linux 上的最佳办公套件。
• LyX - 成熟的 LaTeX 渲染文档编辑器。
• OnlyOffice - 最佳的 Linux 办公套件之一。
• TeXmacs - 一款所见即所得的科学文本编辑器，并可用作一系列计算机代数系统的前端。
• TexLive - TeX Live 是个轻松获取和运行 TeX 文档生产系统的好方式。
• Texmaker - 免费跨平台的 LaTeX 编辑器。
• WPS office - Linux 上的最佳办公套件之一。

生产力

• Alarm Clock - Alarm Clock 是一款全功能的 GNOME 或其它面板的闹钟。
• Ambient Noise - 在 Linux 上安装环境噪声提高专注。
• Autokey - 一款 Linux 桌面自动化工具，让你可以管理你的脚本和短语集合，并给它们分配缩写或者快捷键。
• Basket Note Pads - 这个多用途的笔记应用帮助你记下所有类型的笔记。
• Brightness - Ubuntu 下的一个亮度指示器。
• Cairo-Dock - Cairo-Dock 是一个可自定义 dock，插件，面板等的桌面界面。
• California - Calendar 应用的完整替代方案，可使用自然语言创建事件。
• Cerebro - 开源生产力提升工具/MacOS Spotlight 替代工具。
• CopyQ -CopyQ 是一款高级剪贴板管理器，带有编辑和脚本功能。
• Docky -Docky 是一款成熟的 dock 应用，让打开常用应用和管理窗口变得更加简单和快速。
• f.lux - 根据光线自动调节你的电脑屏屏幕显示。
• Gnome-dictionary - GNOME 下的一款强大的字典。
• Go For It - Go For It! 是一款简单又时尚的生产力工具，主打待办清单，结合定时器让你专注于当前的任务。
• Gpick - Gpick 让你可以从桌面任何地方取色，并且它还提供一些其它的高级特性！
• My Todo - Mytodo 是一款开源的待办事项程序，让你能够掌控一切。
• My Weather Indicator - Ubuntu 下的天气指示器和插件。
• NixNote - EverNote 开源客户端。
• Notepadqq - Notepadqq 是 Linux 下一款类 Notepad++ 的编辑器。
• Notes - 一款干净又简单的 Linux 笔记应用。
• Papyrus - Papyrus 是一款不一样的笔记管理器，它专注于安全和更佳的用户界面。Papyrus 尝试给用户提供一个易用和智能的用户界面。
• Plank - Plank 注定要成为这个星球上最简洁的应用 dock。
• Pomodone App - PomoDoneApp 使用番茄钟技术®，是在你当前任务管理服务上追踪你的工作流最简单的方法。
• Recent Noti - 一款显示最近通知消息的指示器。
• Redshift - Redshift 根据你的周边调整你屏幕的色温。当你夜晚在屏幕前工作时，它也许能帮助你减少对眼睛的伤害。
• Shots - HTML/CSS/JS 截屏工具。
• Shutter - Shutter 基于 Linux 的系统上（比如 Ubuntu）的一款功能丰富的截屏软件。
• Simplenote - 跨平台笔记软件。Evernote 的竞争者。
• SpeedCrunch - 一个漂亮，开源，高精度的科学计算器。
• Springseed - 面向日常用户简单又漂亮的一款笔记软件。
• Stickynote - Linux 桌面的便利贴。
• TaskWarrior - Taskwarrior 是一款免费，开源的的软件，它可以从命令行管理你的待办事项列表。
• Todo.txt - todo.txt-专注的编辑器，用最少的组合键和点击帮助你管理你的任务。
• Todoist - Todoist 的非官方客户端。Todoist 是带有移动客户端的跨平台待办事项管理器，有着优秀的用户界面以及一些可选的高级特性。
• Tomboy - Tomboy 是一款简单易用的桌面笔记应用。
• Undistract me - 在长时间执行的终端命令结束的时候提醒你。
• Whatever - 非官方 Evernote Linux 桌面客户端。
• WizNote - 一个跨平台云笔记客户端。
• Xmind - 脑图工具。
• Zim - 一款图形化的文本编辑器，用来维护一系列的维基页面，对笔记和文档而言也很棒。资料以纯文本的形式保存，更便于版本管理。

安全

• ClamAV - Clam 防病毒
• Fail2ban - Fail2ban 扫描日志文件（例如 /var/log/apache/error_log）并将有恶意气息的 IP 封禁——过多的错误密码尝试，寻找可利用漏洞等行为。
• GnuPG - Gnu 隐私守卫
• GuFW - Linux 世界中最简单的防火墙之一。
• OpenSSH - OpenSSH 安全 Shell 服务器以及客户端。
• Seahorse - GnuPG 的 Gnome 前端。
• Tcpdump - TCP 调试/抓包工具。

代理

• Privoxy - Privoxy 是一款无缓存 web 代理，有高级过滤功能，用以加强隐私，修改 web 页面数据以及 HTTP 头部，访问控制，还有去广告和烦人的网络垃圾的功能。
• ProxyChains - 强制指定的应用发起的任何 TCP 连接通过像 TOR 或其它 SOCKS4，SOCKS5 或 HTTP(S) 代理进行。
• Shadowsocks - 一个 socks5 代理工具，保护你的互联网流量。

文件共享

• aria2 - aria2 是一个轻量级的多协议以及多来源命令行下载工具。
• CrossFTP - CrossFTP 让 FTP 相关的任务管理变得无比简单。
• D-lan - 一个免费的局域网文件分享软件。
• Deluge - Deluge 是一款轻量级，免费的跨平台 BT 客户端。
• Dropbox - Dropbox 是一个免费的云存储服务，让你可以将照片，文档和视频带到任何地方并轻松分享。
• Filezilla - 免费的 FTP 解决方案
• Flareget - 全功能，多线程下载管理器以及加速器。
• Mega - 在你的电脑和 MEGA 云存储间轻松自动同步。
• Meiga - 一个让你可以通过 web 共享你选定的本地文件夹的工具。
• ownCloud - ownCloud 的目标是不论在哪都能让你访问到你的文件。
• PushBullet - Pushbullet 将你的设备连接，让它们感觉像是一体的。
• qBittorent - qBittorrent 计划的目标是提提供一个 µTorrent 的自由软件替代方案。
• Quazaa - 一款跨平台的多重网络点对点（P2P）文件分享客户端。
• SpiderOak - 关注隐私的团队及商业实时协作。
• Syncthing - Syncthing 用开放，值得信赖，去中心化的方案取代专有的同步和云服务。
• Teamviewer - PC 远程控制/远程访问软件，对个人使用免费。
• Transmission - 简单，轻量级，多平台的 torrent 客户端。
• uGet - Linux 下最好的下载管理器。
• uTorrent - 优雅，高效的 torrent 下载。
• Vuze - Bittorrent 点对点下载客户端，满足你的所有 torrent 下载需要。

终端

• GnomeTerminal - Linux 世界广泛预装的终端模拟器。
• Guake - Guake 是 Gnome 下的一款顶部下拉式的终端。
• Hyper - 基于 web 技术打造的终端。
• Konsole - KDE 桌面环境的最佳终端。
• RXVT-Unicode - rxvt-unicode 是著名的终端模拟器的一个分支。
• RXVT - 一款 X11 终端模拟器，流行的‘xterm’替代品。
• Sakura - 简单但是强大，基于 libvte 的终端模拟器，支持 utf-8 并且通过 gtk+ 和 pango 库提供输入法。
• Terminator - 很明显 Linux 上最强大的终端模拟器是功能丰富的 Terminator（终结者）。
• Terminix - 使用 GTK+3 的 Linux 平铺终端模拟器。
• Termit - 基于 vte 库的简单终端模拟器，可通过 Lua 扩展。
• Termite - 以键盘为中心，基于 VTE 的终端，旨在在一个支持平铺和/或标签的窗口管理器中使用。
• Xterm - Xterm 是一个 X 窗口系统的终端模拟器。它给不直接使用窗口系统的程序提供了 DEC VT102 和 Tektronix 4014 兼容终端。
• Yakuake - 一款基于 KDE Konsole 技术的 Quake 风格的终端模拟器。

实用工具

• Actionaz - Ubuntu/Linux 下的任务自动化工具。
• Albert - Linux 桌面超赞的应用启动器。
• Bleach bit - BleachBit 快速释放磁盘空间并不知疲倦地守卫你的隐私。释放缓存，删除 cookie，清除互联网浏览历史，清理临时文件，删除日志，以及更多功能...
• Brasero - CD/DVD 烧录软件。
• Caffeine - 防止 ubuntu 自动睡眠。
• Clonezilla - Clonezilla 是一款分区以及磁盘镜像/克隆程序，类似 True Image® 或 Norton Ghost®。
• Convertall - 全能单位换算。
• CPU-G - 轻松监控你的 Ubuntu 笔记本的电池寿命。
• EasyStroke - Easystroke 是一个 X11 手势识别应用。
• Enpass - Enpass 安全地管理你的密码和重要信息，让你的生活更轻松。
• GD map - 可视化磁盘使用量的工具。
• Ghost Writer - 一款专注的 Windows 及 Linux Markdown 编辑器。
• Gloobus-Preview - 它能给你提供文件的快速预览，类似 Sushi。
• GnomePie - Linux 桌面的一个圆形启动器。
• Gnome Pomodoro - 全功能 GNOME 番茄钟。
• Gnormalize - 音频转换工具。
• GParted - Ubuntu/Linux 磁盘分区工具。
• GRadio - Ubuntu linux 无线电广播软件。
• Handbrake - 视频转换工具。
• ImageMagik - ImageMagick 是一套图片修改和处理的命令行工具。
• Indicator-SysMonitor - 一款可显示 cpu 温度，内存，网速，cpu 使用率，公网 IP 地址以及联网状态的应用指示器。
• KeePassX - 跨平台密码管理器。KeePass 的移植成果。
• KeePass - 专注于 Windows 的密码管理器，通过 Mono 提供一些跨平台支持。
• KVM - KVM （表示 Kernel-based Virtual Machine，基于内核的虚拟机）是一个支持虚拟化扩展（Intel VT 或 AMD-V）Linux 的完全虚拟化方案。
• LastPass - 跨平台密码管理器。
• Peazip - 解压任何文件的工具。
• Peek - 一款让你能够从你的屏幕录制简短的动画 GIF 图片的小工具。
• PlexyDesk - Plexydesk 支持 Linux 多插件工作空间/桌面。
• Powertop - 能源消耗诊断工具。
• Psensor - Linux 图形化硬件温度监视器。
• Pulse Audio - 通过个性化的配置改善 Linux 的音频。
• Remarkable - Ubuntu/Linux 上最佳的 Markdown 编辑器。
• Remmina - 一款功能丰富的远程桌面应用，支持 Linux 以及其它 Unix。
• Stacer - Ubuntu 系统优化器。
• Sushi - Sushi 是 GNOME 桌面文件管理器鹦鹉螺（Nautilus）的快速预览工具。
• SympleScreenRecorder - SimpleScreenRecorder 是一款功能丰富的录屏软件，支持 X11 和 openGL。它拥有基于 Qt 的图形化用户界面。
• Synaptic - Synaptic 是一款图形化的 apt 包管理程序。
• Systemload - 在状态栏显示系统负载。
• TightVNC - 免费，轻量，快速且可靠的远程控制/远程桌面软件。
• Trimage - 跨平台无损 PNG 及 JPG 文件调整工具。
• TLP - 优化 Linux 下的电池表现。
• UbuntuCleaner - 使用 Ubuntu Cleaner 轻松清理你的 ubuntu 系统。
• ULauncher - Linux 应用启动器。
• Variety - Variety 是一款开源的 Linux 壁纸更换软件，拥有众多功能，轻巧又易用。
• Virtualbox - VirtualBox 是一款通用的 x86 硬件虚拟机软件，面向服务器，桌面以及嵌入式。
• WallpaperChange - 自动更换你的壁纸。
• Workrave - 一款帮助恢复以及防止重复性劳损的程序（RSI）。
• Xtreme Download Manager - 一款有着新鲜用户界面的下载管理器。

视频

• Bomi Player - 一款强大易用的多媒体播放器。
• Cheese - Cheese 用你的摄像头拍照和录像，还能加上神奇的特效，让你能够和别人分享快乐。
• Kodi - 一款获得殊荣的免费开源（GPL）软件，支持视频，音乐，图片，游戏以及更多内容的媒体中心。
• Miro - 免费，开放的视频，音乐以及互联网电视应用；它从成千上万的资源中带来视频频道，并且还有比其它平台更丰富的免费高清资源。
• MPlayer - MPlayer 是一款支持多种系统和各种视频的视频播放器。
• MPV - 一款免费，开源，跨平台的媒体播放器。
• SMPlayer - 内置解码器的免费媒体播放器。可播放所有的音频和视频格式。
• SVP - SVP 让你可以使用帧插值在你的桌面电脑上观看任何视频，就像高端电视和投影仪支持的那样。
• VLC - VLC 是一个免费且开源的跨平台媒体播放器以及框架，可以播放大多数格式的多媒体文件以及 DVS，音频 CD，VCD，以及各种流媒体协议。

其它

• GrubCustomizer - Grub Customizer 是一个让你可以配置 GRUB2/BURG 设置和启动项的图形化界面。
• Infinality bundle & fonts - 注：Infinality 目前开发者不再维护，如果在滚动发行版上，可能不可用。Infinality bundle & fonts 是一个开源项目，致力于让 Linux 管理员和个人用户有个轻松的方式改善字体渲染质量。
• Mycroft - 给所有人的 A.I.

命令行工具

• Bastet - 在命令行玩俄罗斯方块。
• Buku - 命令行书签管理器。
• Daily Reddit Wallpaper - 开机时将壁纸更换为 /r/wallpapers 或其它子版块的今日最高票壁纸。
• Fishfry - 将 fish 的历史记录替换成为渗透测试人员量身定制的高效版本以及方便新手学习。
• Googler - 从命令行 Google 一切。
• htop - 带有改进的特性和用户体验的 top。
• mps-youtube - 基于终端的程序，用于搜索，流媒体以及下载音乐。这个实现使用 Youtue 作为内容源，能够播放和下载视频和音频。
• Mutt - 终端邮件客户端，vim 快捷键，强大灵活可定制。
• Neofetch - 快速，高度定制化的系统信息获取脚本，支持 Linux，MacOS，iOS，BSD，Solaris，Android，Haiku，GNU Hurd，MINIX，AIX 以及 Windows。
• Newsbeuter - 带有 vim 快捷键的快速，可定制 RSS 订阅阅读器。
• Pacman4console - 在控制台玩吃豆人。
• TheFuck - 杰出的应用，它能纠正你的输入的错误命令。
• Tmux - 它让你在一个终端中在多个程序间方便地切换，分离他们（保持在后台运行）并另一个终端中重新连接上去。以及还有好多事情可以做。
• wicd-curses - 命令行 WiFi 连接管理器。
• 十佳命令行工具

桌面环境

• Budgie - Budgie 是一个面向现代用户**设计的桌面环境，专注于简洁与优雅。
• Cinammon - Cinnamon 努力提供一种传统的用户体验。Cinnamon 是一个 GNOME 3 的 fork。
• GNOME Flashback - GNOME Flashback 是 GNOME 3 的一个 shell，最初叫 GNOME fallback 模式。桌面的布局和底层技术都与 GNOME 2 相似。
• Gnome - GNOME 桌面环境是一个有吸引力且直观的的桌面，同时有现代（GNOME）和经典（GNOME Classic）会话模式。
• KDE Plasma - KDE Plasma 桌面环境是一个熟悉的工作环境。Plasma Desktop 提供现代桌面环境体验所需的所有工具，所以你可以从开始就充满生产力。
• LXDE - Lightweight X11 Desktop Environment （轻量化 X11 桌面环境）是一个快速且节能的桌面环境。
• LXQt - LXQt 是 LXDE 的 Qt 移植和即将到来的版本，轻量化的桌面环境。
• Mate - Mate 用传统隐喻给 Linux 用户提供一个直观又有吸引力的桌面。MATE 是 GNOME 2 的一个 fork。
• Pantheon - Pantheon 是最初为发行版 elementary OS 创建的桌面环境，同时也是它的默认桌面环境。
• Unity - Unity 是 GNOME 的一个 shell，由 Canonical 为 Ubuntu 设计。
• Xfce - Xfce 体现了模块化和可重用的传统 UNIX 哲学。

显示管理

控制台

• CDM - 超简化，又功能丰富，用 bash 写就的登陆管理器。
• Console TDM - 纯 bash 写就的 xinit 扩展。
• nodm - 简约的自动登陆显示管理器。

图形界面

• Entrance - 基于 EFL 的显示管理器，高度实验性质。
• GDM - GNOME 显示管理器。
• KDM - KDE4 显示管理器（不再继续开发）。
• LightDM - 跨桌面显示管理器，可以使用任何工具集写就的各种前端。
• LXDM - LXDE 显示管理器，可以独立于 LXDE 桌面环境使用。
• MDM - MDM 显示管理器，在 Linux Mint 中使用， GDM 2 的一个 fork。
• SDDM - 基于 QML 的显示管理器，KDE 4 的 kdm 的继任者；Plasma 5 以及 LXQt 推荐。
• SLiM - 轻量且优雅的图形化登录解决方案（不再继续开发）。
• XDM - 带有 XDMCP，主机选择支持的 X 显示管理器。

窗口管理

合成器

• Compton - Compton 是一款独立的合成管理器，适合同没有原生提供合成功能的窗口管理器一同使用。 []
• Xcompmgr - Xcompmgr 是一个简单的合成管理器，能够渲染下拉阴影，使用 transset 工具的话，还可以实现简单的窗口透明。

叠加式窗口管理器

• 2bwm - 快速的浮动窗口管理，有两个特殊边界，基于 XCB 库，由 mcwm 衍生。
• Blackbox - 快速，轻量化的 X 窗口系统窗口管理器，没有那些烦人的库依赖。
• Fluxbox - 基于 Blackbox 0.61.1 代码的 X 窗口管理器。
• Openbox - 高度可配置，带有可扩展标准支持的下一代窗口管理器。

平铺式窗口管理器

• Bspwm - bspwm 是一个平铺式窗口管理器，将窗口以二叉树的叶结点的方式展现。
• Herbstluftwm - 使用 Xlib 和 Glib 的手工平铺式窗口管理器。

动态窗口管理器

• awesome - 高度可配置，下一代 X 框架窗口管理器。
• dwm - X 动态窗口管理器。它以平铺，单片镜以及浮动布局的方式管理窗口。
• i3 - 完全重写的平铺式窗口管理器。
• spectrwm - X11 小型动态窗口管理器，很大程度上受了 xmonad 和 dwm 的启发。
• xmonad - 动态平铺式 X11 窗口管理器，用 Haskell 写就和配置。

设置

• 什么是 Linux
• Linux 基础术语
• 选择最适合你的发行版

Arch Linux

• 新手指南
• 安装指南
• 通用推荐
• 应用列表

CentOS

• 官方网站
• 关于
• 下载
• 指南
• 提示和技巧
• 常见问题

openSUSE

• 什么是 openSUSE
• 尝试 openSUSE 的理由
• 新手常见问题解答
• 如何安装 openSUSE
• 评测

Ubuntu

• 什么是 Ubuntu
• 如何安装 Ubuntu
• 如何安装 Ubuntu 和 Windows 双系统启动
• 安装 ubuntu 后要做什么

其它发行版

待添加

论坛

Arch Linux Forums

• Arch Linux 论坛
• Arch Linux ARM 论坛

CentOS Forums

• CentOS 论坛

Ubuntu Forums

• Ubuntu 论坛
• Ask Ubuntu

openSUSE Forums

• openSUSE 论坛

IRC 频道

• #ubuntu

Linux 新闻，应用，以及更多...

• OMG!Ubuntu
• ITSFOSS
• Linux 官方
• Webupd8
• Noobslab
• Make use of
• TecMint
• AllTop
• Unixmen
• DistroWatch
• Phoronix
• Dedoimedo
• How-To Geek
• Liliputing
• FAMILUG
• Ubuntu Geek

Reddit

• Arch Linux
• CentOS
• Linux
• Open Source
• Ubuntu
• Unix Porn
• Linux Kernel
• Linux Gaming

学习 Linux

• 学习 Linux 命令
• GNU/Linux 命令行工具总结
• 学习 Linux
• Linux 课程
• Linus 口袋指南
• Linux Bash 命令行 - Tek Linux

Linux Hacking/开发

• 内核新手
• Linux Insides
• Linux 内核
• Linux 内核归档（官方站点）
• Linux Kernel Internals (PDF)
• Linux 内核邮件列表归档
• Linux 内核模块编程指南（PDF）

标有 的是开源软件并且链接到源代码。标有 的意为免费（就如免费的啤酒）。

angularjs学习资料

1. 源码学习 :
http://www.cnblogs.com/xuwenmin888/p/3739096.html
Angularjs源码学习
http://www.ifeenan.com/?c=AngularJS
Angularjs源码学习

---

2. 资料网址 :
http://yeomanjs.org/
http://wkylin.github.io/assets/GruntJsPpt/gruntJs.html
http://angularjs.org

http://angular-ui.github.io/bootstrap/
angular对bootstrap的封装
http://cnodejs.org/topic/51404e0f069911196d2e3923
angularjs + nodejs
http://www.cnblogs.com/lvdabao/tag/AngularJs/
吕大豹 Angularjs
http://angularjs.cn/
angularjs中文社区
2013年AngularJS资料大全
http://www.iteye.com/news/28651-AngularJS-Google-resource
有jQuery背景的开发者如何建立起AngularJS的思维模式？
http://www.infoq.com/cn/news/2013/11/how-to-think-angularjs
http://stackoverflow.com/questions/14994391/how-do-i-think-in-angularjs-if-i-have-a-jquery-background
使用AngularJS构建大型Web应用
http://www.infoq.com/cn/news/2013/02/angular-web-app
AngularJS 最佳实践
http://www.lovelucy.info/angularjs-best-practices.html
Angular的一些扩展指令
https://gist.github.com/btm1
扩展了set-attr, set-if(替代ng-if但不做watch), set-repeat(单向数据绑定替代ng-repeat但不做watch以提高性能)
Angular长列表性能调优
http://tech.small-improvements.com/2013/09/10/angularjs-performance-with-large-lists/
调优:Optimizing AngularJS: 1200ms to 35ms
http://blog.scalyr.com/2013/10/31/angularjs-1200ms-to-35ms/
单向绑定指令
https://github.com/Pasvaz/bindonce
Angular数据绑定原理
http://stackoverflow.com/questions/9682092/databinding-in-angularjs
https://github.com/angular-ui/
一些扩展Angular UI组件
http://voidcanvas.com/emberjs-vs-angularjs-performance-testing/
Ember和AngularJS的性能测试
http://www.cnblogs.com/powertoolsteam/p/angularjs-introdection.html
带你走近AngularJS - 基本功能介绍
http://www.zhihu.com/question/21151483
AngularJS 有没有缺点？MVVM 框架中有比它更好的吗
http://angular.duapp.com/docs/guide
Angularjs开发指南
http://www.cnblogs.com/amosli/p/3710648.html
Angularjs学习
http://www.rainweb.cn/article/angularjs-jquery.html
不要带着jQuery的思维去学习AngularJS
http://wangjiatao.diandian.com/?tag=angularjs
angularjs 学习笔记
http://www.angularjs.cn/T008
angularjs 开发指南
https://github.com/jmcunningham/AngularJS-Learning
ajgularjs 英文资料
http://angular-ui.github.io/bootstrap/
angular bootstrap
https://github.com/opitzconsulting/jquery-mobile-angular-adapter
angular jq mobile
http://mgcrea.github.io/angular-strap/
angular ui
http://www.tuicool.com/articles/7ZZVr2
整合jQuery Mobile+AngularJS经验谈
http://zhuanlan.zhihu.com/thefrontendperiodicals/19805365
构建自己的AngularJS，第一部分：Scope和Digest
http://blog.jobbole.com/46589/
有jQuery背景，该如何用AngularJS编程**
http://angularjs.cn/T006
http://www.hacke2.cn/oschina-angularjs/
开源**的 AngularJS 优秀文章汇总
http://zouyesheng.com/angular.html
http://www.sunzhongwei.com/angularjs.html
http://www.lovelucy.info/angularjs-best-practices.html
http://www.ituring.com.cn/minibook/303
https://github.com/teamcat/AngularLearing
坚壳&小数提供

python资源集合与开源硬件

python

python资源集合，持续更新。。。 python 中文学习大本营 。

目录

• 网页框架
  • Django
  • Flask
  • Tornado
  • 其他网页框架
• 用户图形接口相关
• 网络相关
• 数据库相关
• 游戏相关
• 开源框架
• 大数据与人工智能相关
• 网络爬虫
• 测试与代码分析审核
• 破解脚本
• 图表及图像相关
• 运维相关
• 树莓派
• 第三方平台
• IDE
• 其他库
• 博客与播客及书籍文档
• 他人总结

具体内容 =============================

网页框架

Django

• Django - Django。
• Channels - Channels旨在增强Django的异步能力，同时让Django不仅仅局限于Request-Response模型，能够支持WebSocket、HTTP2推送和背景任务。2015年出现的十大流行Python库 。
• Django-Baker - Django Baker可以帮助开发者快速启动项目。只要提供app名称，Django Baker就可以根据models.py文件中的models，自动生成视图、表单、URL、admin页面以及模板。2015年出现的十大流行Python库 。
• Django-Q - Django Q是一个原生Django分布式任务队列处理应用，通过Python的mutliprocessing模块功能实现。2015年出现的十大流行Python库 。
• django-webpack-loader - Django webpack loader对webpack-bundle-tracker的输出结果进行处理，让你可以在自己的Django应用中使用生成的bundles。2015年出现的十大流行Python库 。
• django-hackathon-starter - django-hackathon-starter这是一个Django Web应用模板程序，可以帮助你快速生成应用。必定能够为你节省大量的开发时间，同时这个库也能用作开发者的学习指南。2015年出现的十大流行Python库 。
• django-seed - Django-seed通过faker库，为Django模型生成测试数据。该库支持Python和Django的最新版本。2015年出现的十大流行Python库 。
• django-tenants - django-tenants让django驱动的网站支持多个tenants，这个功能时通过PostgreSQL schemas实现的。这是每个SASS（软件即服务）网站的核心功能。2015年出现的十大流行Python库 。
• Python+Django构建的Blog - 基于Python+Django构建的Blog http://xushvai.github.io/io/
• LibraryManagement - LibraryManagement图书管理系统(Django1.9.1+Bootstrap3)。
• CommunityManagement - 用Django基于组合模式开发的一个小型的社团管理系统。
• django-shop - Django做的开源电子商务网站(商城)
• weixin_market - 基于mezzanine与django的web服务器——微信商城。
• deisp - 开源PaaS系统Deis是一个 Django/Celery API 服务器、Python CLI 和一组 Chef cookbooks 合并起来提供一个类似 Heroku 的应用平台，用于公有云和私有云。
• OSQA - 一款免费且开源的问答系统，采用Python的Django开发框架，基于**优秀的问答系统CNProg，非常类似国外著名的技术问答网站http://stackoverflow.com。[官网](http://www.dzonesoftware.com/products/open-source-question-answer-software)
• ASKBOT-devel - 一款免费且开源的问答系统，采用Python的Django开发
• taiga-back - Taiga功能非常强大的项目管理平台，用于初创企业和敏捷开发团队，采用Django 框架开发，前端基于 AngularJS 实现。

Flask

• flask - flask， 官方教程中文翻译1 ，官方教程中文翻译2,Flask使用小结,Flask开发团队Pocoo的内部编码风格指南| 编程派 | Coding Python.html。
• Blog_mini - 基于Flask开发的开源博客系统，具有简洁的界面和强大的后台管理。

Tornado

• tornado - tornado是非阻塞式 Web 服务器框架，而且速度相当快。官网，Introduction to Tornado 中文翻译 , 中文教程。

其他网页框架

• Bottle - Bottle是一个小型的轻量网络开发框架，同时速度也很快。
• Wooey - Wooey 是一个简单的Python脚本的Web UI 界面。它能够提供日常数据分析，文件处理等功能。2015年出现的十大流行Python库 。
• Odoo - 前OpenERP，开源的ERP和电子商务系统、CRM，功能强大。官网

用户图形接口相关

• pyglet - Pyglet是一个纯Python语言编写的跨平台框架，用于开发多媒体和窗口特效应用。
• kivy - Kivy 是一个开源工具包能够让使用相同源代码创建的程序能跨平台运行。它主要关注创新型用户界面开发，如：多点触摸应用程序。Kivy 还提供一个多点触摸鼠标模拟器。基于 Cython(C extensions for Python) 构建，当前支持的平台包括：Linux、Windows、Mac OS X和Android。
• Py2exe - 把Python脚本转换为windows平台上面可以运行的可执行程序（*.exe）的工具,通过修改源码可以支持python3.0的代码。
• pyinstaller - 把Python脚本转换为能直接运行的可执行文件，支持python2.7、python3.3-3.5，支持Windows (32-bit and 64-bit)、Linux (32-bit and 64-bit)、Mac OS X (32-bit and 64-bit)平台。
• cx_Freeze - 把Python脚本转换为能直接运行的可执行文件，支持python3.x,特别简单。
• Tkinter - Tkinter的是Tk的GUI工具包，与Python附带的Python接口。
• wxPython - wxPython一个开源的Python接口的wxWindows。
• PyQt - PyQt是一个创建GUI应用程序的工具包。它是Python编程语言和Qt库的成功融合。Qt库是目前最强大的库之一。
• Eric - Eric一个支持python、Ruby的强大IDE，与PyQt配合功能非常强大。

网络相关

• aiohttp - aiohttp是一个为 asyncio 提供了简洁易用的 HTTP 客户端和服务器的库。
• Requests - Requests是python的一个HTTP客户端库，跟urllib，urllib2类似。
• youtube-dl - 一个可从YouTube等网站下载视频的开源神器,采用Python开发，支持多个OS平台，支持众多视频网站国内优酷、土豆、新浪和搜狐，国外YouTube等赫然在列。

数据库相关

• SQLAlchemy - SQLAlchemy一个知名企业级的持久化模式的，专为高效率和高性能的数据库访问设计的，改编成一个简单的Python域语言的完整套件。它采用了数据映射模式（像Java中的Hibernate）而不是Active Record模式（像Ruby on Rails的ORM）。
• SQLObject - SQLObject是一个介于SQL数据库和Python之间映射对象的Python ORM, 类似于Ruby on Rails的ActiveRecord模式。
• Peewee - Peewee是一个小型但是十分强大的库，支持通过ORM的方式访问数据库，原生支持SQLite、MySQL和PostgreSQL等数据库。
• pony - pony官网 Pony是一个非常酷和新的 Python ORM ,它能够让你使用Python generators来查询一个数据库。这些generators然后会转成高效的SQL。
• asyncmongo - AsyncMongo是基于Tornado iploop的mongo数据库的异步库。
• influxdb-python - InfluxDB -python 是一个时间序列数据库，用它来储存不同时间的测量值。通过 RESTFul API，它变得极其易用而且高效，另外，由于其内建了聚类功能，因此对数据的检索和分组也变得十分轻松。
• elasticsearch-dsl-py - elasticsearch-dsl-py提供基于JSON的完整的Query DSL查询表达式(DSL即领域专用语言)。
• MongoHub-Mac - MongoHub-Mac：mongo 图形化管理工具。
• mongotron - mongotron：mongo 图形化管理工具,基于Electron与AngularJS写成。
• asyncmongo - AsyncMongo是基于Tornado iploop的mongo数据库的异步库。

游戏相关

• 游戏服务器端架构升级之路 - 游戏服务器端架构升级之路，参考flask设计的tcp server：haven 、 参考flask设计的tcp server：maple。

开源框架

• 高效的Python数据分析框架Ibis - 高效的Python数据分析框架Ibis ibis-project , 通过IPN了解Ibis.
• RabbitMQ - 一个工业级的消息队列服务器，RabbitMQ+Python入门经典-兔子和兔子窝
• ZeroMQ - 是一个简单好用的传输层socket library，使得 Socket 编程更加简单、简洁和性能更高。

大数据与人工智能相关

• pandas - 为 Python 编程语言提供高性能，易用数据结构和数据分析工具。在数据改动和数据预处理方面，Python 早已名声显赫，但是在数据分析与建模方面，Python 是个短板。Pands 软件就填补了这个空白，能让你用 Python 方便地进行你所有数据的处理，而不用转而选择更主流的专业语言，例如 R 语言。12 个使效率倍增的 Pandas 技巧 上、 下 。
• pulp - PuLP 是一个用 Python 编写的线性编程模型。它能产生线性文件，能调用高度优化的求解器，GLPK，COIN CLP/CBC，CPLEX，和GUROBI，来求解这些线性问题。
• Matplotlib - Matplotlib是基于 Python 的 2D（数据）绘图库，它产生（输出）出版级质量的图表，用于各种打印纸质的原件格式和跨平台的交互式环境。matplotlib 既可以用在 python 脚本, python 和 ipython 的 shell 界面 (ala MATLAB® 或 Mathematica®)，web 应用服务器，和6类 GUI 工具箱。matplotlib 尝试使容易事情变得更容易，使困难事情变为可能。你只需要少量几行代码，就可以生成图表，直方图，能量光谱（power spectra），柱状图，errorcharts，散点图（scatterplots）等。
• Scikit-Learn - Scikit-Learn是一个简单有效地数据挖掘和数据分析工具（库）。关于最值得一提的是，它人人可用，重复用于多种语境。它基于 NumPy，SciPy 和 mathplotlib 等构建。
• Spark -Spark 由一个驱动程序构成，它运行用户的 main 函数并在聚类上执行多个并行操作。Spark 最吸引人的地方在于它提供的弹性分布数据集（RDD），那是一个按照聚类的节点进行分区的元素的集合，它可以在并行计算中使用。RDDs 可以从一个 Hadoop 文件系统中的文件（或者其他的 Hadoop支持的文件系统的文件）来创建，或者是驱动程序中其他的已经存在的标量数据集合，把它进行变换。用户也许想要 Spark 在内存中永久保存 RDD，来通过并行操作有效地对 RDD 进行复用。最终，RDDs 无法从节点中自动复原。Spark 中第二个吸引人的地方在并行操作中变量的共享。
• SciPy - SciPy是一个开源的Python算法库和数学工具包，SciPy包含的模块有最优化、线性代数、积分、插值、特殊函数、快速傅里叶变换、信号 处理和图像处理、常微分方程求解和其他科学与工程中常用的计算。其功能与软件MATLAB、Scilab和GNU Octave类似。Numpy和Scipy常常结合着使用，Python大多数机器学习库都依赖于这两个模块。
• NumPy - NumPy几乎是一个无法回避的科学计算工具包，最常用的也许是它的N维数组对象，其他还包括一些成熟的函数库，用于整合C/C++和 Fortran代码的工具包，线性代数、傅里叶变换和随机数生成函数等。NumPy提供了两种基本的对象：ndarray（N-dimensional array object）和 ufunc（universal function object）。ndarray是存储单一数据类型的多维数组，而ufunc则是能够对数组进行处理的函数。
• ipython - iPython 是一个Python 的交互式Shell，比默认的Python Shell 好用得多，功能也更强大。 她支持语法高亮、自动完成、代码调试、对象自省，支持 Bash Shell命令，内置了许多很有用的功能和函式等，非常容易使用。默认开启了matploblib的绘图交互，用起来很方便。jupyter-notebook - jupyter官网。
• PyML - PyML是一个Python机器学习工具包，为各分类和回归方法提供灵活的架构。它主要提供特征选择、模型选择、组合分类器、分类评估等功能。
• gensim - gensim是一种NLP（自然语言处理），它提供了一些常用算法，例如 tf-idf、word2vec、doc2vec、LSA 等的快速、可拓展（内存无关）实现，同时还提供了简单易用的接口和完善的文档。
• Blaze - Blaze 是下一代的 NumPy。用于处理分布式的各种不同数据源的计算。
• Dask - Dask是一款基于外存的Python 调度工具。它通过将数据集分块处理并根据所拥有的核数分配计算量，这有助于进行大数据并行计算。它主要针对单机的并行计算进程。
• GWPY - GWPY一个可以分析引力波数据的Python包。
• nupic - 使用的机器学习算法叫做脑皮质学习算法。
• AlphaGo - 围棋和深层神经网络树搜索。

网络爬虫

• scrapy - 最出名的网络爬虫，一个快速,高层次的屏幕抓取和web抓取框架，用于抓取web站点并从页面中提取结构化的数据。Scrapy用途广泛，可以用于数据挖掘、监测和自动化测试。官方主页,Scrapy 轻松定制网络爬虫 - 教程，Scrapy 中文指南 。
• BeautifulSoup - Beautifu Soup不完全是一套爬虫工具，需要配合urllib使用，而是一套HTML/XML数据分析，清洗和获取工具。
• python-goose - Python-Goose用Python重写，依赖了Beautiful Soup。给定一个文章的URL, 获取文章的标题和内容很方便。
• pyspider - PySpider：一个国人编写的强大的网络爬虫系统并带有强大的WebUI。采用Python语言编写，分布式架构，支持多种数据库后端，强大的WebUI支持脚本编辑器，任务监视器，项目管理器以及结果查看器。demo地址,网络爬虫剖析，以Pyspider为例 ， Scrapy 示例 —— Web 爬虫框架 。

测试与代码分析审核

• splinter - Python自动化测试工具Splinter，不仅可以当web自动化测试工具 同时也可以当抓取交互式网站的爬虫程序来用的，不用去分析ajax请求数据了，可以模拟登录，用Python开发自动化测试脚本-splinter。
• swarm - 是一个简单的使用 gevent 开发的支持自定义协议的长连接压测框架。
• PySonar2 - PySonar2王垠开发的，针对 Python 的代码静态分析工具。
• Behave - BDD自动化测试框架。
• Nose - Nose是最流行的针对Python的测试库之一。简单实例
• locust - 一个开源负载测试工具。使用 Python 代码定义用户行为，也可以仿真百万个用户。
• ReviewBoard - Review Board:在线代码审核工具，它所提供的应用程序可以支持代码审查流程。
• Infer - Infer是Facebook最新开源的静态程序分析工具，用于在发布移动应用之前对代码进行分析，找出潜在的问题，包括 Android 、iOS等等。

破解脚本

• ibrute - 一个攻击iCloud账户的Python脚本,2014年很多明星的账号就是被这个脚本攻破的，苹果已经修改这个漏洞了。
• bruteforce_py - 暴力破解脚本，ssh bf, wordpress bf, cpanel bf, mysql bf, etc ... 可以说是暴力破解大全。
• keychain-bruteforce - 暴力破解MAC OS X 的密码管理。
• gamblerbfe - 路由器也可以暴力破解了。
• AndroidPINCrack - android的pin密码破解。
• rarPasswordCrackere - rar加密文件破解。
• Python-ZIP-Cracker - zip加密文件破解。

图表及图像相关

• vincent - Python 构建的专为运用 D3.js 进行可视化的 vega 转换工具。
• Scikit-image - 一组用于图像处理的算法的集合，使图像处理任务如模糊，增强对比度，缩放只需要一些函数调用就可以完成。
• PIL - PIL （Python Imaging Library）是 Python 中最常用的图像处理库。

运维相关

• pywebsocketserver - 程序Log实时监控 – python + websocket。
• pupy - Pupy是一个远程管理工具（Administration Tool），开源并且支持多个平台。Pupy还内置了一个Python解释器，可以从内存中加载Python包，访问远程Python对象。
• Fabric - Fabric 一个通过SSH进行应用部署以及系统任务管理的命令行工具。
• Invoke - Invoke让你通过一个Python库便捷地执行系统管理任务。如果你想使用稳定的工具（即使是不再积极开发），可以考虑Invoke的前身——Fabric。
• DeployDjango - 不到一分钟安全部署Django应用的脚本，操作教程。
• HealthChecks - HealthChecks基于 cron 的监控服务。在 cron 里配置好监控只需要几分钟时间，却能让你晚上睡得更好！2015年出现的十大流行Python库 。
• dockerizing-django - 是realpython网站一篇相关教程的代码库，讲的是如何将Django应用Docker化。2015年出现的十大流行Python库 。
• 用Python脚本实现对Linux服务器的监控 - 用Python脚本实现对Linux服务器的监控。
• plumbum控 - plumbum提供了非常易用的语法，可以轻松地以跨平台的方式执行本地或者远程命令，获取输出或者错误代码。还可以组合它们（shell 管道的方式），而且它还提供了创建命令行应用的接口。
• virtualenv - virtualenv用来建立一个虚拟的python环境，一个专属于项目的python环境。用virtualenv 来保持一个干净的环境非常有用。
• Gunicorn - Gunicorn 是一个Python WSGI UNIX的HTTP服务器。这是一个pre-fork worker的模型，Gunicorn服务器大致与各种Web框架兼容，只需非常简单的执行，轻量级的资源消耗，以及相当迅速,Nginx+Gunicorn+Django 部署小记。
• mitmproxy - mitmproxy 是用 Python 和 C 开发的一个中间人代理软件（man-in-the-middle proxy），它可以用来拦截、修改、重放和保存 HTTP/HTTPS 请求。
• Sentry - Sentry 是一个实时的事件日志和聚合平台，基于 Django 构建。Sentry 可以帮助你将 Python 程序的所有 exception 自动记录下来，然后在一个好用的 UI 上呈现和搜索。
• newrelic - newrelic性能监控的好工具，国内有；云智慧、ONE APM。
• ipapy - iOS项目自动打包脚本，并且上传到fir.im，然后发送邮件给测试人员。
• ZStack - 开源IaaS软件,已经提供了大部分IaaS的基本功能，包括：虚拟机管理，存储卷管理，存储卷快照，各种网络服务（DHCP、DNS、SNAT、EIP、PortForward以及Security Group）。ZStack使用、OpenStack、CloudStack比较
• Flocker - Flocker可轻松实现Docker容器及其数据的管理。这是一个数据卷管理器和多主机的 Docker 集群管理工具。
• Fig - Fig 主要用来跟 Docker 一起来构建基于 Docker 的复杂应用，Fig 通过一个配置文件来管理多个Docker容器，非常适合组合使用多个容器进行开发的场景。

树莓派

• 图片自动发邮箱 - 报警图片自动发邮箱功能。
• 自动更新树莓派的内网、外网IP地址到 自己的github上 - 自动更新树莓派的内网、外网IP地址到 自己的github。
• rpi-start - 树莓派初始配置指南（2代B型）。
• RaspberryWechatPi - 基于树莓派的智能家居控制平台 微信服务端。
• dotbro-server - 瀑布IM 开源点歌系统，架设树莓派点歌系统：如何共享办公室的音箱。

第三方平台

• wechat-python-sdk - wechat-python-sdk微信公众平台Python开发包 http://wechat-python-sdk.readthedocs.org/ ， 非官方微信公众平台 Python 开发包，包括官方接口和非官方接口。
• wechatpy - wechatpy 是一个微信 (WeChat) 公众平台的第三方 Python SDK, 实现了普通公众平台和企业号公众平台的解析消息、生成回复和主动调用等 API。阅读文档：http://wechatpy.readthedocs.org/zh_CN/latest/
• wechat-deleted-friends - wechat-deleted-friends查看被删的微信好友。
• wxBot - wxBot为Python包装的网页微信API。可以很容易地实现微信机器人。参考文章：《挖掘微信Web版通信的全过程》、《微信协议简单调研笔记》。
• WeixinBot - WeixinBot微信web协议分析和实现微信机器人（微信网页版 wx2.qq.com）。其他版本
• WeRoBot - WeRoBot是一个面向公众号的微信机器人框架，文档 。
• WxRobot - WxRobot：面向个人账户的微信机器人框架,文档 。
• Wechat django - Wechat django一个基于django开发的微信公众平台，整体环境搭建在新浪SAE平台上，暂时实现的功能：查询天气情况、翻译。
• gxgk-wechat-server - gxgk-wechat-server莞香广科微信公众号后端，使用 Python、Flask、Redis、MySQL、Celery ，为在校学生提供一系列信息查询与便民服务。
• weChat-python-sdk - weChat-python-sdk微信公共平台非官方SDK，主要实现主动的消息推送和获取，该项目已经过期！
• wechat-admin - 基于Flask和MySQL能够帮助快速迁移微信服务号后台到自家服务器的框架(tag: Python, wechat, weixin, admin, Flask) 。
• wechat-encrypt-python3 - 微信提供的官方python加解密代码 只能用于python2。这里重写了一个python3版本。
• Python-SDK - 微信公众号Python-SDK,本SDK支持微信公众号以及企业号的上行消息及OAuth接口。

IDE

• PyCharm - PyCharm是由JetBrains打造的一款Python IDE，Community社区版本是免费的，Professional版本$199.00/年。
• Eric - Eric是一个集成了项目管理功能的 Python和Ruby集成开发环境。
• PyDev - PyDev是Eclipse开发Python的 IDE，支持Python，Jython和IronPython的开发。
• KomodoEdit - Komodo Edit 是非常干净，专业的 Python IDE。
• PyScripter - PyScripter是一个开源的Python语言集成开发环境。
• WingIDE - WingIDE是个相当优秀的 IDE。
• IEP - IEP 是跨平台的 Python IDE，旨在提供简单高效的 Python 开发环境。包括两个重要的组件：编辑器和 Shell，并且提供插件工具集从各个方面来提高开发人员的效率。
• Emacs - Linux文本编辑器Emacs是一种强大的文本编辑器，在程序员和其他以技术工作为主的计算机用户中广受欢迎。
• sublimetext - sublimetext：Sublime Text 是一个轻量、简洁、高效、跨平台的编辑器。
• Atom - Atom 是 Github 专门为程序员推出的一个跨平台文本编辑器。具有简洁和直观的图形用户界面，并有很多有趣的特点：支持CSS，HTML，JavaScript等网页编程语言。它支持宏，自动完成分屏功能，集成了文件管理器。官网下载，比较不错的插件：爆炸效果 activate-power-mode、程序员鼓励师 atom-miku 。

其他库

• IoTNotes - 开源硬件记录。
• GitHub上Star最多的100个python repository - GitHub上Star最多的100个python repository。
• 10个Python 模块 - 你该了解的10个 Python 模块。
• dask - 【(Python)集成任务调度/阻塞算法的数据并行处理库Dask】支持大数据集的分割多核并行处理，Doc。
• Phonenumbers - Phonenumbers 小巧，实用简便，没有地理代编码，运营商，时区等metadata数据。它能识别多种格式，然后使用不同的格式/样式进行有效匹配。
• toyplot - Python交互绘图库Toyplot，文档doc。
• pythalesians - Python金融(分析工具)库PyThalesians。
• 20个机器学习开源项目 - 20 个顶尖的 Python 机器学习开源项目 Scikit-learn、Pylearn2、NuPIC……
• Seaborn - 用 Seaborn 画出好看的分布图, 使用说明 。
• Python_Coding_Rule - 【Python代码指南】，这篇文档改编自Guido最初的《Python风格指南》一文，希望对初学Python的朋友们有所借鉴。
• GGTinypng - 批量压缩png和jpg图片python脚本，已经支持子文件夹里面的图片，会按原始的相对路径存放到输出文件夹内。
• sinaweibopy - 新浪微博Python SDK。
• keras - Keras是一个高度模块化的神经网络库，用Python语言编写，可以基于TensorFlow或Theano框架运行。
• yapf - yapf是一个Python文件代码格式化工具，但与其他类似工具采取了不同的算法。它脱胎于由 Daniel Jasper 开发的 clang-format。
• tqdm - tqdm可以在长循环中添加一个进度提示信息，用户只需要封装任意的迭代器 tqdm(iterator)，是一个快速、扩展性强的进度条工具库。
• pyvim - pyvim用Python语言实现的Vim编辑器。
• snake - Snake用来取代Vim的VimScript进行Vim的插件编程，借由Python的强大，让插件编程如虎添翼。
• pyxley - 使用Flask和React.js，快速开发数据面板（dashboard。在网页上显示一个数据面板是与人分享数据科学发现的最直观方法。对R语言来说有Shiny来简化数据科学家开发网页的工作，而Pyxley就相当于Python版的Shiny。使用Pyxley不光不用写HTML、CSS，你还可以加入自己的JavaScript来进行定制。
• Tomorrow - Tomorrow为Python 2.7中的异步代码提供了神奇的装饰器语法实现。
• ibis - Ibis是Cloudera Labs推出的一个新项目，目前还是预览版。它试图解决的就是数据集规模的问题，但对用户提供的确是单机上Python的体验，而且能够与现有的Python数据生态圈（Pandas、Scikit-learn、Numpy）进行集成。未来它还计划加入与机器学习和高级分析集成的功能。
• ipython - IPython 是一个在多种编程语言之间进行交互计算的命令行 shell，最开始是用 python 开发的，提供增强的内省，富媒体，扩展的 shell 语法，tab 补全，丰富的历史等功能。
• bpython - bpython是一个不错的Python解释器的界面，很像现在的IDE（集成开发环境）。
• Ptpython - Ptpython是一个高级的python 交互式解释器(REPL)。python-prompt-toolkit 。
• DreamPie - DreamPie 是一个Python shell，为Python开发者提供自动完成的属性；功能和文档显示；并且将session历史存储为HTML文件。
• Arrow - Arrow这个库可以更好地处理Python中的日期和时间（data/time）。
• retrying - Retrying库可以帮你避免重复劳动：它实现了『重试』行为。它提供了一个通用的 decorator，而且还可以设置一系列的属性，如最大重试次数、延时、退避休眠（backoff sleeping）和错误条件（error conditions）等，以此来获得你想要的重试行为。简单轻便。
• python-phonenumbers - python-phonenumbers从Google 的『libphonenumbers』库移植而来，用来解析、格式化或者验证电话号码，而且需要写的代码非常少。最重要的是，『phonenumbers』可以判断一个电话号码是否是唯一的（遵照 E.164 格式）。它同时支持 Python 2 和 Python 3。
• monkeylearn-python - monkeylearn-python通过简单易用的 RESTFul API 提供了云端的文本挖掘功能：比如文字中的情感、最重要的关键字，可以对文本进行话题检测，还可以使用自定义的文本分类器进行其他任何处理。
• Cookiecutter - 一个命令行实用程序，从cookiecutters（项目模板）创建的项目，比如：创建从一个Python包项目模板的Python包项目。
• Sunburnt - Sunburnt全文搜索服务器Solr的Python接口。
• Celery - Celery是基于Python开发的分布式任务队列。它支持使用任务队列的方式在分布的机器／进程／线程上执行任务调度。
• Gevent - Gevent是一个基于greenlet的Python的并发框架，以微线程greenlet为核心，使用了epoll事件监听机制以及诸多其他优化而变得高效。
• Greenlet - Greenlet是一个python的并行处理的一个库。
• Eventlet - Eventlet是一个用来处理和网络相关的python库函数，而且可以通过协程来实现并发。
• Python Async IO Resources - asyncio python的异步iO操作资源， asyncio - asyncio3.4以后作为python标准库来使用了。
• Twisted - Twisted是一个用python语言写的事件驱动的网络框架，支持很多种协议，也是一个异步机制的框架。
• eviltransform.python - eviltransform.python解决国内GPS地图坐标偏移问题,它将政府加密过的GCJ-02坐标，转成世界通用的WGS-84坐标。
• pagure - Pagure是一个用Python编写的新的、功能齐全的、提供 Web 服务的 Git仓库。它类似于Github 和 Gitlab ，同时允许开源贡献者分享彼此的资源，实现代码和内容上的合作。官网
• pdf2htmlEX - 可以将PDF转换成HTML，可以在HTML文件中精确显示原生文本、生成的文件大小与解压缩后的PDF文件相当、单HTML文件输出
• Pritunl - 一款免费开源的VPN平台软件，让用户迅速搭建VPN服务；采用OpenVPN 代理方式，提供了API供高级开发者使用，同时还针对不同平台和不同VPS供应商提供了详尽的安装使用说明。
• OpenCC - 一个开源的中文简繁转换项目，致力于制作高质量的基于统计预料的简繁转换词库。还提供函数库(libopencc)、命令行简繁转换工具、人工校对工具、词典生成程序、在线转换服务及图形用户界面。
• moviepy - Moviepy是用来做Python视频编辑的模块：剪切，合并，插入标题，视频混合，视频处理，创建效果。可以读写大多数的音视频格式，支持三个主流的操作系统，支持Python2/3。

博客与播客及书籍文档

• 值得关注的10个python语言博客 - 值得关注的10个python语言博客, Planet Python 最出名的python博客其中之一; lucumr flask的创始人; love-python 有很多有用的知识和代码; Doug Hellmann 博主是PYMOTW(Python Module Of the Week)成员之一，博客里面包含了很多library的知识; Code Who Says Py 这个博客很不错,虽然它更新的不是很及时; effbot 代码和任何你能想得到的东西都在里面; pydanny 主要关于Django的博客; inventwithpython Al Sweigat，他写了很多本关于python的书; pythonlibrary 最有用的博客，他让我的python技术迅猛提; freepythontips 打不开了。
• 听技术播客 - 听技术播客：一边学Python编程一边学英语。Talk Python to Me 每期都会请一些知名的Python开发者做嘉宾; Podcastinit Podcastinit也是专注于Python语言的，每期节目也会邀请不同的嘉宾，探讨与Python有关的工具和产品，另外也时常探讨技术领域多样性和包容性等更加宽泛、更具社会性的话题; Python Test Podcast 聚焦的主题是测试，大部分都是与测试有关的。
• django-web-app-book - Django Web 开发实战,本书是一本在线的免费的Django Web编程书籍。
• Django-Design-Patterns-and-Best-Practices - Django设计模式与最佳实践。

他人总结

• awesome-python - Awesome可能是GitHub上寻找和整理开源项目最好的方式 。
• interview_python - 十分全面的Python的面试题。
• issue-198-top2015 - 蠎周刊2015年度最赞。

python学习资源整理

Python学习资源持续收集中。

1.http://simple-is-better.com/
2.http://www.itdiffer.com/
3.http://www.pythondoc.com/
4.Python正则表达式操作指南
5.http://django-china.cn/
6.http://looly.gitbooks.io/python-basic/
7.http://www.fullstackpython.com/
8.怎样学 Python？
9.你像从前一样的Python学习笔记
10.Python -- 头条
11. 玩 Python 之必装组件
12. Python俱乐部
13. python-china新风格社区
14. 伯乐在线的Python频道 多谢评论的补充
15. http://woodpecker.org.cn/diveintopython3/table-of-contents.html
16. Python Cookbook 是Python 3.x版本的

高效的JavaScript插件

图片

• baguetteBox.js - 是一个简单易用的响应式图像灯箱效果脚本。demo
• Lightgallery.js - 是一个功能齐全的JavaScript图像灯箱插件。demo
• viewerjs - 是一个图像预览插件。demo
• cropperjs - 是一个图片编辑器插件。demo
• photo-editor - 是一个本地图片编辑器插件。demo
• blazy.js - 是一个懒惰加载插件。demo

布局

• SuperEmbed.js - 是一个Javascript库，可检测出网页上的内嵌视频并使他们能够变成响应式元素。demo
• ScrollReveal - ScrollReveal插件使用户能够无比轻松地创建桌面和移动浏览器的网页滚动动画。demo
• Bricks.js - 是一款超快的用于固定宽度元素的“砖石”布局生成器。demo

轮播图

• Swipe - 准确的触摸滑块。demo
• Lory - 是一个由 Vanilla JavaScript 编写的拥有触摸功能的简约滑块。demo
• baguetteBox.js - 是一个简单、易用的响应式 Lightbox 图片库，它支持移动端上触滑动手势操作，无依赖。demo

弹出层

• Popper.js - 是一个轻量级的库用于管理工具提示和弹窗效果。demo
• SweetAlert2 - 是一个颜值很高而且可以自定义的警告弹出窗口插件，可以代替Javascript的弹出窗口。demo
• artDialog - 是一个经典、优雅的网页对话框控件。demo
• layer - 是一个web弹层组件。demo

音频视频

• Loud Links - 是一个轻量级的JavaScript库用于添加交互声音到您的站点。demo
• flv.js - B 站 HTML5 播放器内核开源。
• Loud Links - 是一个轻量级 JavaScript 库，用于向您的网站添加交互音频。。demo

编辑器

• MediumEditor - 仿Medium.com的所见即所得在线编辑器工具栏。demo
• Substance - 是一个基于Web的内容自定义编辑器。demo
• flatpickr - 是一个轻量级的代码高亮库，适用于任何编程语言。demo
• pen - 是一个Markdown编辑器工具。demo
• aceAce（Ajax.org Cloud9 Editor）。demo
• CodeMirror浏览器端的代码编辑器。demo
• esprima用于综合分析的 ECMAScript 解析器。demo
• quill一个带有 API 的跨浏览器富文本编辑器。(demo)
• ckeditor-releases 适用于每个人的 web 文本编辑器。demo
• editor 一个 markdown 编辑器，但仍在开发中。demo
• EpicEditor 一个可嵌入的 js Markdown的编辑器，拥有全屏编辑、即时预览、自动保存草稿和离线支持等功能。demo
• jsoneditor 查看、编辑和格式化 JSON 的 web 工具。demo
• vim.js  拥有持久化 ~/.vimrc 的 Vim 编辑器的 JavaScript 移植版本。demo
• Squire HTML5 富文本编辑器。demo
• TinyMCE JavaScript 富文本编辑器。demo
• trix 由 Basecamp 制作，适用于每天写作的富文本编辑器。demo
• Editor.md 由 Basecamp 制作，适用于每天写作的富文本编辑器。demo

字符串

• selecting - 一个允许你获取用户选定文本的库。
• string.js - 额外的 JavaScript 字符串方法。demo
• he - 健壮的 HTML 实体编码/解码器。
• multiline - 多行字符串。
• query-string - 解析和字符串化 URL 查询字符串。
• URI.js - URL 操作库。demo
• jsurl - 轻量的 URL 操作库。
• sprintf.js - 实现字符串格式化。
• url-pattern - 让 url 和其它字符串进行比正则表达式匹配更简单。字符串和数据可相互转化。
• Numeral.js - 格式化和操作数字的 JS 库。 demo

表单

• validator.js - 轻量级的JavaScript表单验证，字符串验证。demo
• List.js - 是一个轻量级的为列表、表格或其他任何HTMLL标签增加了搜索，排序，过滤器和灵活性等元素。demo
• Algolia Places - 是一个能让你在网页轻易实现搜索栏自动完成功能。demo
• Cleave.js - 是一个会在你输入时格式化你的<input/>标签里面的内容。demo
• validator.js - 是一个简单、轻量级，但功能强大的 Validator 组件。demo
• axios - 是一个基于浏览器和node的HTTP请求库，绿色环保只有12kb。

存储

• store.js - 本地存储localstorage的封装，提供简单的API。demo
• cookie.js - 对操作cookie的封装，提供简单的AIP 兼容IE6。demo
• store.js - 为所有浏览器封装了LocalStorage，隐秘地使用localStorage、globalStorage和用户数据。
• localForage - 改善后的离线存储。封装了IndexedDB、WebSQL和localStorage。demo
• cross-storage - 获得权限后，能跨域名本地存储。
• basket.js - 用 localStorage 加载和缓存脚本的资源加载器。demo
• bag.js - 可以缓存脚本和加载资源，增加了键值对接口和对localStorage/websql/indexedDB 的支持。
• basil.js - 智能的 JavaScript 数据持久层库。
• Cookies - 客户端 Cookie 操作库。
• DB.js - 基于 Promise 的、封装了 IndexedDB 的库。demo
• lawnchair.js - 简单的客户端 JSON 存储。demo

动画

• anime.js - 是一个灵活轻便的JavaScript动画库。demo
• three.js - 是一个JS 3D库。demo
• loaders.css - CSS 动画加载效果。demo
• Hover.css - 一款基于 CSS3 的悬停特效合集。demo
• Effeckt.css - 一个包含众多精妙的 CSS3 切换和动画效果库。demo
• Magic Animations - 一个独特的 CSS3 动画特效包。demo
• Transformicons - 一个结合 SVG、CSS 和 HTML 技术，让图标、按钮和符号具有变种（特殊）动画效果的库。demo
• SpinKit - 一款 CSS 加载动画合集，可高度自定义动画效果。demo
• d3-ease - 这是一个让动画更为平滑的 Easing 库。
• ScrollMagic - 一个用来创建魔幻滚动交互的 JavaScript 库，可以像使用进度条一样使用滚动条。demo
• ScrollReveal - 一款页面滚动显示动画，可以播放一次也可以播放无限次，能让页面更加有趣，更吸引用户眼球。。demo
• RELLAX.js - 是一款主打轻量级的纯 JavaScript 视差效果库。demo
• CountUp.js - 可以用来快速创建以一种更有趣的动画方式显示数值数据。demo
• Dynamics.js - 可以创建物理运动动画效果 JavaScript 库。demo
• Mojs - 一个拥有极简的声明式 API ，能够轻松掌控运动轨迹，为运动图形而生的工具库。demo
• React FLIP Move - 一个翻转移动的库，旨在解决当列表的顺序发生变化时，项目列表动画化的问题。demo
• tween.js - 是一个JS 平滑动画库。demo
• vivus - JavaScript库，使SVG绘制动画。demo
• Choreographer-js - 是一个用于处理复杂动画的简单库。demo
• minirefresh - 优雅的H5下拉刷新。零依赖。demo

时间

• moment中文网 是一个日期处理类库,用于解析、检验、操作、以及显示日期。demo
• date-fns - 现代JavaScript日期实用程序库。demo
• luxon - 在JS中使用日期和时间的库。demo
• timesheet.js - 是一个时间展示片段插件。demo
• date.js - 是一个格式化时间、过去时间展示、解决因时区变更插件。
• timeago.js - 格式化时间显示多久以前的插件。 demo
• rome - 可定制的日期（和时间）选择器。无依赖，可选 UI。 demo
• moment-timezone - 基于 moment.js 的时区库。demo
• date - 拥有人性化的 Date() 方法。demo
• ms.js - 小巧的毫秒转换工具。

其它

• hotkeys - 是一个强健的 Javascript 库用于捕获键盘输入和输入的组合键。demo
• clipboard.js - 现代复制到剪贴板。没有Flash，gzip压缩只有3KB 。demo
• translater.js - 这是一个利用HTML注释的页面翻译解决方案。demo
• scrollama - 为 Scrollytelling 开发的现代、轻量级的 JavaScript 库。demo
• Push.js - 是一个跨浏览器的Javascript桌面通知插件。demo
• onlinenetwork - js判断是否断网了。
• iNotify - 是一个实现浏览器的 title 闪烁、滚动、声音提示、chrome、等系统通知。demo
• tesseract.js - 是一个文字识别转换，可以运行在浏览器和服务器NodeJS上。demo
• Leaflet.js - 是一个开源的移动友好交互式地图 JavaScript 库。体积仅有 33 KB。demo
• CurrencyFormatter.js - 是一款简单纯JS格式化155种不同国家货币格式库，gzip压缩后仅7KB。demo
• Feature.js - 是一个快速、简单、轻量级的浏览器功能检测库。它没有任何的依赖，并且 gzip 压缩后仅有1kb。demo
• screenfull.js - 极小、跨平台的 JavaScript 全屏插件。demo

加载器

• requirejs - JS模块化工具
• SeaJS - JavaScript模块加载框架
• loadjs - JavaScript模块加载框架
• ESL - 浏览器端AMD标准加载器

构建工具

• webpack - 前端构建工具
• Gulp - 自动化构建工具
• Babel - 下一代JavasScript语法编译器
• PostCSS - 利用JS插件转换CSS样式的工具
• Grunt - JavaScript世界的构建工具
• rollup.js - JS模块打包器
• webpack-dashboard - webpack开发服务器的CLI仪表板
• traceur-compiler - 支持ES6的JS编译器
• brunch - 超快的HTML5构建工具
• Helium-css - 显示网站中未使用的CSS

测试

• mocha - JavaScript 测试框架
• ESLint - JavaScript代码检查工具
• JSHint - JavaScript语法和风格检查工具
• casperjs - 开源的导航脚本处理和测试工具
• Nightwatch - 用户界面自动化测试框架
• istanbul - JS代码覆盖工具
• intern - JavaScript测试系统
• benchmark.js - 强大的JavaScript基准库
• loadtest - HTTP或WebSockets URL的负载测试
• JSCover - JavaScript代码覆盖测量工具

包管理器

• yarn - 新的 Hadoop 资源管理器
• bower - web包管理器
• npm - NodeJS包安装的管理模块
• ndm - npm桌面管理器

CDN

• https://cdnjs.com
• http://cdnjs.net
• http://www.jsdelivr.com
• http://unpkg.com
• http://rawgit.com
• http://staticfile.org
• http://www.bootcdn.cn
• http://cdn.baomitu.com
• http://lib.sinaapp.com
• http://cdn.code.baidu.com
• http://jscdn.upai.com
• https://www.asp.net/ajax/cdn
• http://libs.sun0769.com
• https://css.net
• https://developers.google.com/speed/libraries/

提升工作效率的工具

• 角色扮演类游戏它是一款游戏。在游戏中你可以列入每天需要做的事情，如果按时完成就能赚取金币和经验.这还是一个可以和朋友一起玩的游戏，你们可以组队挑战共同的目标比如学习计划工作项目等等，非常强大
  

---

• Be Focused Pro（软件）这是一个运用番茄工作法的时间管理软件，通过将单个任务分成多段时间集中精力来完成，中间有休息，这会让你把工作做得更好

它可以帮你按照每天、每周或自定义时间创建任务、计划休息时间并追踪你的进度

这款软件只有Mac版，当然支持与苹果手机、ipad等等实时同步。是一款非常好用的软件

• RescueTime.com一款时间管理软件，各个系统都有。软件安装后无需你自己动手，它就会自动记录你在电脑或者手机上的时间花费，自动生成数据表格.它会将你的全部软件使用活动按照活动性质进行分类，从而得出生产力指数

---

• 在线的图片处理网站 不需要太多的技术，就可以让你在线对图片进行美化.功能非常强大，加载速度也很快。以后再也不用繁琐的打开PS处理图片，直接开启网页就可以P图

• PDF转PPT等等都可以直接通过这个页面实现

• 音频文件同样也可以实现在线的转换上传后选择需要转换的格式，一键就可以转换，再也不需要繁琐的下载软件来进行转换了。

---

• 一个非常经典的视频下载网站有些视频网站我们很难获取下载地址。而你只需要输入视频的地址，就可以直接下载到电脑中

• PPT素材导航不管是模板还是图片配色，都为你整理了大量好用的网站，并且不断更新

• 图片类网站的综合搜索引擎像PIXABAY这样的图库都可以直接用这个网站进行检索，不必再一个个收藏

---

• 将自己常用的网站添加到键盘上的每一个字母中以后按下这个字母就可以达到设置好的网站，界面简单又非常的好用

FE资源

http://microjs.com/#

该网站的资源都托管到了github，microjs.com是一个可以让你选择微型的js类库的网站，该网站里的js库都是压缩后不大于5KB的，非常实用

---

https://plainjs.com/（10.22更新）

The Vanilla JavaScript Repository，该仓库都是用原生js写的插件和组件，很实用。里面的项目也都托管到了github

综合/资源

• frontend-dev-bookmarks 一个巨大的前端开发资源清单。star:15000
  
  
• front-end-collect 分享自己长期关注的前端开发相关的优秀网站、博客、以及活跃开发者。star:860
  
  
• Front-end-Interview-questions 史上最全前端开发面试问题及答案
  
  
• f2e-hub 包含Animation，UI，dialog，Carousels，color，image，workflow等。star:100
  
  
• awesome-javascript 一系列很棒的javascript 库，资源。star:3100
  
  
• fks 前端技能汇总，包含前端知识架构，后端知识，linux，书籍推荐等。star:4000
  
  
• node123 node.js中文资料导航。star:1200
  
  
• mobile-web-favorites 移动端web开发收藏夹。star:200
  
  
• gulp-book Gulp 入门指南
• Front-end-tutorial 最全的资源教程-前端涉及的所有知识体系。（12.25更新）

样式/UI/css

• Semantic-UI 让你使用任何HTML标签 来表现UI控件。
  这是一款语义化设计的前端框架，为攻城师而制作的可复用的开源前端框架。star:17500
• primer CSS风格指南。star:3600
  
  
• glue 一个生成CSS sprites的简单的命令行工具。star:2.5K (7.19更新)
  
  
• postcss 用js插件来对css进行转换，类似Sass的预编译器，但实现了模块化，并且更加强大。star:4.5K(7.31更新)
  
  
• css3 PIE 允许在IE上使用CSS3绝大部分的酷炫功能。官网：http://css3pie.com/
  
  
• mui 轻量级css框架。star:1.5K(10.15更新)
• img2css 将图片转为纯css的黑科技。star:1.5K（12.25更新）

  测试/工具

• mocha 一个简单、灵活有趣的 JavaScript 测试框架，用于 Node.js 和浏览器上的 JavaScript 应用测试。 star:6680
• csscss css代码冗余分析仪，用于分析冗余 。star:2800
  
  
• es6-tools es6 工具集，包括Grunt Tasks，Gulp Plugins，Broccoli Plugins，Brunch Plugins，Webpack plugins等等。star:1860
  
  
• async 一个工具模块，提供了直接而强大的 JavaScript 异步功能。虽然是为 Node.js 设计的，但是它也可以直接在浏览器中使用。star:13000
  
  
• simditor 团队协作工具 Tower 使用的富文本编辑器。star:1300
  
  
• HTMLHint HTML 静态代码分析工具，可以集成到IDE环境或编译系统中。star:900
  
  
• jshint js静态代码分析工具，可以帮你检测js语法错误和潜在的问题。star:5100
  
  
• csslint 分析和优化你的CSS样式表的工具。由Nicholas C.
  Zakas所写。star:2700
  
  
• protractor 一款端对端的angular apps 测试框架。star:4K
  
  
• casperjs 一个基于PhantomJS的开源导航脚本和测试工具。star:4.8K
  
  
• Karma 自动化完成单元测试，允许你在多个浏览器里执行js代码。让你的TDD变得简单，快速，有趣。star:5.3K
  
  
• jasmine 是一个简易的JS单元测试框架， 用来测试Javascript代码。star:9.1K（6.28更新）
  
  
• chai 一个针对 Node.js 和浏览器的TDD(测试驱动开发)/BDD(行为驱动开发)的断言框架，可与任何 JavaScript 测试框架集成。star:2K（6.29更新）
  
  
• Qunit 一个很容易使用的js单元测试框架，该框架是由jQuery团队的成员所开发，并且是jQuery的官方测试套件。star:3.3K（6.29更新）

Workflow/构建工具

• Grunt 基于Node.js的项目构建工具。拥有数量庞大的插件，是一款优秀的前端自动化工具。star:9500
  
  
• yeoman 一个强健的工具，库，及工作流程的组合。star:960
  
  
• gulp 基于node.js流的新一代前端构建系统。star:14000
  
  
• spm 是 CMD 的包管理工具，需要和 Sea.js 配合使用。

canvas/数据可视化

• echarts 基于Canvas，纯Javascript图表库，提供直观，生动，可交互，可个性化定制的数据可视化图表。star:6900
  
  
• Chart.js 使用<canvas>标签的简易HTML5图表。star:14600
  
  
• sketch.js 跨平台JavaScript创意编码框架，gzip压缩后仅有2kb。star:1500
  
  
• d3 一个基于数据操作文档的js数据可视化框架，最流行的可视化库之一。star:38000
  
  
• zrender 一个轻量级的Canvas类库，MVC封装，数据驱动，提供类DOM事件模型，让canvas绘图大不同！star:850
  
  
• c3 一个基于 D3.js 的可重用 JavaScript 图表库。几乎零学习曲线。star:4.5K（6.28更新）
  
  
• img2css 将图片转为纯css代码。（11.3更新）

模块管理/加载器

• ESL 是一个浏览器端、符合AMD的标准加载器，适合用于现代Web浏览器端应用的入口与模块管理。

ESL vs RequireJS

体积更小 (Smaller)
性能更高 (Higher performance)
更健壮 (More Robustness)
不支持在非浏览器端使用 (Browser only)
依赖模块用时定义 (Lazy define)

• seajs 一个遵循CommonJS规范的JavaScript模块加载器。提供简单、极致的模块化开发体验。star:4100
  
  
• Component 一个模块化的JavaScript框架，同时也是面向前端的包管理器。
  
  
• webpack一个模块打包工具，你可以使用WebPack管理你的模块依赖，并编绎输出模块们所需的静态文件。star:9K

动画

• animate.css 一个跨浏览器的CSS动画库。简单易用易上手。star:23000
  
  
• move.js 极小的 JavaScript 库,支持 CSS3 的动画效果,非常简单优雅。star：2600
  
  
• TweenJS 是一个简单但强大的 Javascript 动画库。CreateJS 套件的一部分。star:1500
  
  
• bounce.js 一个用于制作漂亮的 CSS3 关键帧动画的 JavaScript
  库,使用其特有的方式生成的动画效果。star:3600
  
  
• Swipe 号称最精确的Slider触摸库，专为移动设备优化。star:4.7K
  
  
• tween.js 一款可生成平滑动画效果的js动画库。tween.js允许你以平滑的方式修改元素的属性值。它可以通过设置生成各种类似CSS3的动画效果。star:2.5K(7.15更新)
  
  
• parallax.js轻量级的的视差引擎，能对智能设备的方向作出反应。。star:9K （10.17更新）
• Velocity 是一款和jQuery的$.animate()有相同API的动画引擎。很适合移动端的动画开发，还打包了颜色动画，转换，循环，easing效果，类动画、滚动等功能。star：9.5K(12月25更新)

插件

• zepto.fullpage 专注于移动端的全屏滚动插件。star:510
  
  
• fullPage.js pc端的全屏滚动插件。 star:9500 view demo
  
  
• onepage-scroll 可以轻松建立一个动感的响应式的滚动效果页面，比较适用于单页面的专题站。支持现代浏览器和IE8以上版本。View demo 。star:7700
  
  
• slick 一款完全响应式的 jQuery 图片滚动插件，能够根据容器自动适应宽度。star:10000 view demo
  
  
• superslides 致力于解决网站大部分特效展示问题。网站上常用的“焦点图/幻灯片”“Tab标签切换”“图片滚动”“无缝滚动”等只需要一个SuperSlide即可解决！ view demo star:1100
  
  
• jQuery-One-Page-Nav 当用户滚动网页时，实现平滑滚动和智能导航。star:1100
  
  
• slider 一个jquery完全开源的JavaScript代码库，用户可以开发，调试和深度定制自己的滑块。star:850 view demo
  
  
• github-hovercard github 鼠标悬停显示用户，仓库等摘要信息。(10.15更新)
  
  
• onepage-scroll 一款带有背景视觉差效果的jQuery整页滚动特效插件。star：8K （10.17更新）view demo
  
  
• justlazy.js 轻量级js图片延迟加载插件。（10.22更新）
• awesome-browser-extensions-for-github 收集关于github上优秀的浏览器插件。非常实用。star:200 (12.25更新)

框架、库和组件

• polymer web组件构建框架。一套以“一切皆组件、最少化代码量、最少框架限制”为设计理念的Web UI框架。 star:9900
  
  
• impress.js 创建令人兴奋的演示。使用CSS3的转换和过渡，这个库允许你创建令人印象深刻的演示文稿。view demo。star:24300
  
  
• ionic 先进的HTML5 移动端开发框架。帮助开发者使用HTML5, CSS3和js做出不可思议的hybrid app。star:17000
  
  
• reveal.js 基于CSS3的3D幻灯片工具。能够制作绚丽的演示文稿并生成HTML格式，将它发布到web上。star:21500 view demo
• pure.css 一组很小的，响应式的css组件，你可以在网页的项目上到处使用。star:12000
  
  
• three.js 是JavaScript编写的WebGL第三方库。提供了非常多的3D显示功能。star:20000
  
  
• TimelineJS 轻松制作时间轴。star:8000
  
  
• jquery-pjax 对ajax 和 pushState的封装，让你可以很方便的使用pushState技术，用以实现页面无刷新加载。star:11500
  
  
• highlight.js javascript语法高亮。既可以运行在浏览器端也可以运行在服务端。star:5500
  
  
• commander.js Node.js命令行工具。star:3800
  
  
• togetherjs 由Mozilla打造的一款可以给网站添加实时协作功能的JavaScript库。star:5K
  
  
• HTML.js 轻量级的简化与DOM操作的js库。view demo star:1.5K
  
  
• MEAN.JS 全栈式javascript，使用MongoDB, Express, AngularJS 和 Node.js。star:2.2K
  
  
• wechat.js 微信相关的 js 操作：分享、网络、菜单。star:700
  
  
• JavaScript-Load-Image 一个js加载和转换图像文件的库。 star:1.2K view
  demo
  
  
• progress.js 一个 js 和 CSS3的库，帮助开发人员为网页上的每个对象创建和管理进度条效果。star:1.6K view demo
  
  
• foundation 号称世界上最先进的响应式前端框架，也是一款Mobile First的框架。star:21K
  
  
• Sugar 一个JavaScript库。它扩展了现有的JS对象的方法，让你可以用更少的代码做更多的事情。star:2.8K
  
  
• todomvc 帮你挑选一款MV_框架，它使用不同的最流行的js MV_框架实现了一个相同的Todo应用。star:13K
  
  
• yepnope.js 这是一个异步的条件加载框架，速度超快，只为用户加载需要的脚本。使用非常简单，非常有用！star:2.5K
  
  
• Material UI 是一个 CSS 框架和一组实现谷歌 Material Design 设计规范的 React
  组件。star:8.8K（6.28更新）
  
  
• Pikaday 是一个 JavaScript 日期选择器，特点是轻量级、无依赖和模块化的
  CSS。star:2.8K view demo(7.1更新)
• vuejs 用于构建交互式的 Web 界面的库。它提供了 MVVM 数据绑定和一个可组合的组件系统,具有简单、灵活的 API。star:6K（7.12更新）
  
  
• meteor 超简单的，数据库无处不在的，用于自动化和简化实时运行的 Web 应用程序的开发。纯JavaScript的Web框架。star:27K（7.12更新）
  
  
• webuploader
  一个简单的以HTML5为主，FLASH为辅的现代文件上传组件。支持大文件分片并发上传，极大的提高了文件上传效率。star:1.8K
  
  
• fastclick触摸UI上的消除点击延迟js库。star:1W(10.15更新)
  
  
• wangEditor 轻量级web富文本框。 (10.15更新)
  
  
• benchmark.js是强大的基准测试库，几乎适用于所有JavaScript平台。支持high-resolution定时器，并返回重要的统计结果。star:1.7k(10.15更新)
  
  
• headroom.js是一个轻量级、纯 JS 组件,用来隐藏或展现页面上的元素,为你的页面留下更多展示内容的空间。star:7.5K (10.15更新)
  
  
• tooling 快速开发web app

移动端

• Swipe 加速移动触摸滑块与硬件之间的转换。star:5000。
  
  
• hammer.js 一个支持多点触摸的手势库。star:11000
  
  
• amDoc 无线Web解决方案 - 文档规范指南
  
  
• amazeui 移动优先的跨屏前端框架。面向HTML5开发，使用css3做动画和交互。star:4.1K
  
  
• Zepto 一款面向移动端设备、API与jQuery兼容的基础库。
  
  
• mui 最接近原生APP体验的高性能框架 。star:1.1K（6.28更新）
  
  
• Swiper纯javascript打造的滑动特效插件，面向手机、平板电脑等移动终端。能实现触屏焦点图、触屏Tab切换、触屏多图切换等常用效果。star:6K(10月18更新)
  
  
• SUI-Mobile由阿里巴巴国际UED前端出品的移动端UI库，轻量精美 star:2K(2016.1.14更新)
  
  
• lib-flexible 淘宝出品的移动端可伸缩布局方案。star:1.3K+（2016.1.14更新）

Node.js相关

http://nodeframework.com/ 专门收集node.js的web框架的网站。其项目同样均托管在github上。

• nodeclub 使用 Node.js 和 MongoDB 开发的社区系统。star:3000
  
  
• N-chat 使用 Express + Socket.IO 搭建的多人聊天室 。star:300
  
  
• N-blog 使用 Express + MongoDB 搭建多人博客。star:1800
  
  
• node-inspector 基于Blink开发者工具的Node.js调试器。star:7000
  
  
• node-lessons：Node.js包教不包会。star:2.5K
  
  
• nodePPT 使用nodejs写的网络幻灯片。可能是迄今为止最好的网页版PPT。star:1.6K view demo
  
  
• hexo 一款快捷，简单，强大的博客框架，基于Nodejs。star:5.2K
  
  
• koa 下一代Node.js Web 框架。由 Express 团队设计。star:6.3K
  
  
• awesome-nodejs 关于Nodejs 包和资源的收集。star:7K
  
  
• connect Node平台的中间件框架。Express就是基于Connect开发的。star:5.6K（6.29更新）
  
  
• n node版本管理，tj大神所写。star:2.7K
  
  
• nvm node版本管理，通过bash脚本来管理。star:7.5K

React相关

• react-style 是 React.js 可维护的样式组件
  
  
• react-component 基于reactjs的组件。
  
  
• react-native 一个用React构建native apps的框架。star:15000
  
  
• react-native-guide 汇集了react-native学习资源与各类开源app。star:850
  
  
• awesome-react 关于react的工具，资源，视频的集合。star:700
  
  
• Flux 是一个Facebook开发的、利用单向数据流实现的应用架构，用于
  React。Flux应用有三个主要的部分组成：调度程序、存储和视图（React 组件）。star:6.8K（6.28更新）
• iscroll 高性能，体积小，无外部依赖，跨平台的滚动组件 star:6K（7.19更新）
• react-tappable Tappable component for React.(2016,1.4更新)
• react-native-lesson react-native入门指南.star:1.3K(2016,1.4更新)

HTML5

• html5-boilerplate 一套专业的前端模版，主要用于开发快速、健壮、适应性强的app或网站。star:27K （12.25更新）
• Browserquest Mozilla开发的HTML5多人在线游戏。star:5200
• video.js 开源的HTML5和Flash视频播放器。支持自定义进度条、按钮以及工具栏的底色。star:9.1K
  
  
• html5shiv 主要解决HTML5提出的新的元素不被IE6-9识别。star:6K(7.15更新)
  
  
• brunch 快速的前端 HTML5 构建工具。star:4.5K（7.19更新）
  
  
• ulkit 一个轻量级的、模块化前端框架，它被用于快速开发强大的web界面。也是一款优秀的响应式HTML5 框架。star:5.3K (8.3更新)

模板引擎

• Handlebars.js 一个js语义模板库，能让你轻松高效的编写语义化模板。star:8.6K(6.29 update)
  
  
• artTemplate 性能卓越的 js 模板引擎。star:1.7K
  
  
• jade 一款高性能简洁易懂的模板引擎，Jade是Haml的Javascript实现。star:8.7K
• ejs tj大神写的嵌入javascript的模板引擎，主要用于Node

浏览器兼容方案

• es6-shim 提供兼容性垫片，使ES6能兼容于传统的JavaScript引擎。star:1.5K(7.15更新)
  
  
• Modernizr 用来检测浏览器功能支持情况的JavaScript库,可以检测18项CSS3功能以及40多项关于HTML5的功能。star:16000
  
  
• normalize.css 一个可定制的 CSS 文件，使浏览器呈现的所有元素，更一致和符合现代标准。支持IE8+。star:17000
  
  
• html5shiv 主要解决HTML5提出的新的元素不被IE6-9识别。star:6K(7.15更新)
  
  
• css3please 跨浏览器自动生成css3前缀
  
  
• Babel 是一款为了写下一代js的编译器，无需等待浏览器支持就可以使用新的语法。star：8.3K (7.29更新)

高产大牛

• Evan You 前端轻量级框架MVVM框架vue.js作者，前Google工程师。followers:1.6K
  
  
• TJ Holowaychuk Luna 编程语言, Koa, Express, Stylus, Cluster, Mocha, Jade, node-canvas, component 等知名开源项目的创建和贡献者。 followers:14.1K
  
  
• PaulIrish 著名的前端开发工程师，同时他也是Chrome开发者关系团队成员，jQuery团队成员，Modernizr、Yeoman、CSS3 Please和HTML5 Boilerplate的lead developer。followers:15.7K
  
  
• Mike Bostock 知名可视化库 D3.js的主要作者。followers:8.3K
  
  
• Nicolas Gallagher Normalize.css 作者。followers:3.6K
  
  
• 司徒正美 前端迷你MVVM框架Avalon作者。followers:2.1K

其他

• javascript-style-guide 最合理的使用javascript的方法。 star:18000
  
  
• Mars 腾讯移动Web前端知识库。star:1600
  
  
• brackets 一款使用 HTML，CSS，JavaScript 创建的开源的针对 Web 开发的编辑器。star:23000
  
  
• Ghost Node.js开发最新博客系统, 简单简洁, 响应式设计, 支持完全自定义, 免费, 专注博客。star:16000
  
  
• io.js 从NodeJS里分离出来的一条分支。star:13000
  
  
• 2048 游戏 view demo star:7000
  
  
• ueditor 百度前端团队出品的富本文编辑器。star:1.1K

优秀开源组织

• AlloyTeam 腾讯 Web 前端团队。
• fex-team 百度前端团队。

新博客：http://hawx1993.github.io/，欢迎关注

本篇文章会持续更新，欢迎收藏，可及时查看最新更新消息。

文章已推送至我的github，欢迎pullrequest：https://github.com/hawx1993/github-FE-project

awesome-webpack-cn

搜罗一切webpack的好文章好工具

webpack 优秀中文文章

如有好文, 请到此issue里提交文章，或者直接发pull request.

🎓 webpack入门　

• webpack指南 | TooBug | 2015
• webpack-demos | ruanyf | 2016
• 一小时包教会 —— webpack 入门指南 | VaJoy Larn | 2015-07-16
• webpack 入门及实践 | zhouweicsu | 2015-10-30
• Webpack傻瓜式指南（一） | 张轩 | 2016
• Webpack傻瓜式指南（二） | 张轩 | 2016
• 入门Webpack，看这篇就够了 | zhangwang | 2016-08-05
• [译] Webpack 2 有哪些新东西 | cssmagic | 2016-02-15
• Webpack 2 Tree Shaking Configuration | Grgur Grisogono | 2016-02-15
• webpack2 tree-shaking 编译研究 | Jschyz | 2017-01-16
• Webpack 2 入门教程 | llp | 2016-11-29
• 让 Webpack 来帮你打包吧 | 达仔 | 2016-06-19
• webpack 2.2: 最终的版本 | leo | 2017-01-18

🎓 webpack进阶

📕 webpack构建性能优化

• Webpack 构建性能优化探索 | pigcan | 2016-08-28
• webpack使用优化（基本篇） | leehey | 2016-01-10
• webpack使用优化（react篇） | leehey | 2016-04-17
• 开发工具心得：如何 10 倍提高你的 Webpack 构建效率 | 紅白 | 2016-06-21
• webpack Performance: The Comprehensive Guide | leehey | 2016-10-26
• 彻底解决Webpack打包慢的问题 | 王伟嘉 | 2016-07-27
• webpack 构建性能优化策略小结 | Abact | 2016-12-22
• Webpack实战 - 使用动态 entry 改善调试体验 | JSCON简时空 | 2016-01-09

📕 webpack针对项目的优化

📖 文件体积

• 彻底解决 webpack 打包文件体积过大 | clinyong | 2016-03-12
• webpack打包bundle.js体积大小优化 | youngwind | 2016-04-20
• webpack CommonsChunkPlugin详细教程 | wjkang | 2016-09-03
• Webpack的dll功能 | 王成 | 2016-07-15
• webpack 如何把代码内联进html中？ | 滴滴公共前端团队 - 水乙 | 2017-01-11

📖 样式及合图

• webpack之postcss集成 | qinghui | 2016-03-12
• webpack自动雪碧图生成 | kyoko-df | 2016-03-16

📖 文件缓存

• Webpack中hash与chunkhash的区别，以及js与css的hash指纹解耦方案 | 才子锅锅 | 2016-06-28
• Webpack的静态资源持久缓存 | yanni4night | 2016-09-05

📖 自动刷新及热替换

• Express结合Webpack的全栈自动刷新 | 梁砫 | 2016-02-08
• 手把手深入理解 webpack dev middleware 原理與相關 plugins | andyyu0920 | 2016-06-01

📖 其它

• [webpack] devtool里的7种SourceMap模式是什么鬼？ | 滴滴出行·DDFE | 2016-12-06

📕 webpack工程化思考与实践

• 【翻译】Webpack——令人困惑的地方 | chemdemo | 2016-05-04
• 基于webpack搭建前端工程解决方案探索 | chemdemo | 2015-08-18
• webpack 单页面应用实战 | huangsw | 2016-07-04
• webpack多页应用架构系列 | array_huang | 2016-09-07
• 使用webpack命令行工具:webpack-dashboard | Yao Wenjie | 2016-08-28
• Webpack从入门到上线 | 会编程的银猪 | 2016-09-16
• 基于 webpack 搭建前端工程基础篇 | chenbin92 | 2016-07-12
• 使用 Riot、ES6 和 Webpack 构建应用 | PPxu | 2016-07-15
• webpack 使用总结 | Tumars | 2016-12-27

🎓 webpack & React

• Webpack+React+ES6开发模式入门指南 | 大额_skylar | 2015-09-18
• 手把手教你基于ES6架构自己的React Boilerplate项目 | lhc | 2016-04-30
• 使用 webpack + react + redux + es6 开发组件化前端项目 | xiaoyann | 2016-07-14

🎓 webpack & Vue

• Vue+Webpack使用规范 | Aresn | 2016-07-21
• Vue.js 和 Webpack | djyde | 2016
• 使用 Vuex + Vue.js 构建单页应用 | 离尘不理人 | 2016-07-06
• webpack入坑之旅系列 | guowenfh | 2016-03-24
• vue-cli#2.0 webpack 配置分析 | 滴滴出行·DDFE | 2016-12-12

🎓 webpack & Angular

• Webpack + Angular的组件化实践 | 王伟嘉 | 2015-10-27
• [译] 通过 Webpack 实现 AngularJS 的延迟加载 | Cheng_Gu | 2016-03-01
• es6+angular1.X+webpack 实现按路由功能打包项目 | yang_j_j | 2016-01-24
• angular-webpack-cookbook | dmachat | 2016

🎓 webpack开发

📕 原理及源码分析

• 细说 webpack 之流程篇 | 七珏 | 2016-09-09
• happypack 原理解析 | 上坡 | 2016-12-08
• webpack 源码解析 | 李黄河 | 2016-05-30
• Webpack 源码（一）—— Tapable 和 事件流 | JSCON简时空 | 2016-01-09
• Webpack 源码（二）—— 如何阅读源码 | JSCON简时空 | 2016-01-09

📕 Plugin及Loader开发

• 如何开发一个 Webpack Loader ( 一 ) | joeyguo | 2016-05-14
• 如何写一个webpack插件（一） | leehey | 2016-01-09

📕 生成代码分析

• 简要分析webpack打包后代码 | wjkang | 2016-09-04
• webpack2生成代码分析 | leehey | 2016-10-26

📕 其它

• [译] 基于 Webpack 和 ES6 打造 JavaScript 类库 | cssmagic | 2016-01-14
• webpack不适合多页面应用？你写的插件还不够多 | 小虫巨蟹 | 2016-09-20
• [webpack]源码解读：命令行输入webpack的时候都发生了什么？ | zyf394 | 2016-01-05

webpack 优秀 starter kit

如有好的starter kit, 请到此issue里提交章，或者直接发pull request.

📦 webpack & react

• react-starter-kit | bodyno | 2016
• steamer-react | leehey | 2016
• rekit | supnate | 2016

webpack 中文文档

https://doc.webpack-china.org/

Credit To

webpack-tutorial-collection

Python初学者（零基础学习Python、Python入门）书籍、视频、资料、社区推荐

---

本文 主要 针对 零基础 想学习Python者。

一、学会使用搜索引擎，尤其是Google。推荐阅读文章

《如何用好Google搜索引擎？》 知乎问答@崔凯

《十大高明的Google搜索技巧》by-雪影蓝风

《如何用好Google》 by-李笑来

二、学会提问

推荐阅读 《提问的智慧》 by-啄木鸟社区

三、书籍推荐

零基础

1. Python官方文档 点击打开链接 英语不好的，暂时就先别看了，以后一定肯定要加强英语学习哦;)。
2. 推荐《How to think like a computer scientist》，对应中文版本《Python学习笔记--皮大庆》，非常适合零基础入门。
3. 推荐 《Python编程实践》
4. 推荐 《简明Python教程》
5. 推荐《笨办法学 Python （Learn Python The Hard Way）》

有其他编程语言基础

1. 推荐《Python基础教程》
2. 推荐Python入门教程-By廖雪峰

进阶

1. 推荐Requests 源码阅读
2. 《Python进阶》（Intermediate Python 中文版）

更多书籍推荐

1. 知乎问答：关于 Python 的经典入门书籍有哪些？
2. V2EX问答： 文科生想学Python
3. Python快速教程

四、视频推荐

麻省理工公开课《计算机科学及编程导论》，该课程针对零基础者 网易公开课 。

课程介绍
这门课程适用于那些拥有 很少或没有编程经验 的学生,它致力于使学生理解计算机在解决问题中的作用,并且帮助学生， 不论其专业，使他们对于能够完成有用的小程序的目标充满信心。

五、学习方法

知乎问答：零基础，应当如何开始学习 Python ？--by@黎敏

虽然我不是Python高手，但我是零基础，之前会的都是软件PS，PPT之类。

如果目的是想成为程序员，参考教学大纲。

如果只是学程序，理解科技，解决工作问题，我的方式可以参考使用：

1. 找到合适的入门书籍，大致读一次，循环啊判断啊，常用类啊，搞懂（太难的跳过）

2. 做些简单习题，字符串比较，读取日期之类
   《Python Cookbook》不错（太难太无趣的，再次跳过，保持兴趣是最重要的，不会的以后可以再学）

3. 加入Python讨论群，态度友好笑眯眯（很重要，这样高手才会耐心纠正你错误常识）。
   很多小问题，纠结许久，对方一句话点播思路，真的节约你很多时间。耐心指教我的好人，超级超级多谢。

4. 解决自己电脑问题。
   比如下载美剧，零散下载了2，4，5，8集，而美剧共12集，怎样找出漏下的那几集？然后问题分解，1读取全部下载文件名，2提取集的数字，3数字排序和（1--12）对比，找出漏下的。

5. 时刻记住目的，不是为了当程序员，是为了解决问题。

   比如，想偷懒抓网页内容，用urllib不行，用request也不行，才发现抓取内容涉及那么多方面（cookie，header，SSL，url，javascript等等），当然可以听人家劝，回去好好读书，从头读。

   或者，不求效率，只求解决，用ie打开网页再另存为行不行？ie已经渲染过全部结果了。

   问题变成：1--打开指定的10个网页（一行代码就行）。更复杂的想保存呢？利用已经存在的包，比如PAM30（我的是Python3），直接打开ie，用函数outHTML另存为文本，再用搜索函数（str搜索也行，re正则也行） 找到数据。简单吧？而且代码超级短。

6. 保持兴趣，用最简单的方式解决问题，什么底层驱动，各种交换，留给大牛去写吧。我们利用已经有的包完成。

7. 耐心读文档，并且练习快速读文档。拿到新包，找到自己所需要的函数，是需要快速读一次的。这个不难，读函数名，大概能猜到是干嘛的，然后看看返回值，能判断是不是自己需要的。

8. 写帮助文件和学习笔记，并发布共享。教别人的时候，其实你已经自己再次思考一次了。

   我觉得学程序就像学英文，把高频率的词（循环，判断，常用包，常用函数）搞懂，就能拼装成自己想要的软件。

   然后，http://stackoverflow.com 和 http://Google.com 是很好用的。

   然后，坚持下去。

   一定要保持兴趣，太复杂的跳过，就像小学数学，小学英语，都是由简入深。

   网络很平面，无数国际大牛著作好书，关于Python，算法，电脑，网络，或者程序员思路，或者商业思维（浪潮之巅是本好书）等等，还有国际名校的网络公开课（中英文字幕翻译完毕，观看不是难事），讲计算机，网络，安全，或者安卓系统，什么都有，只要能持续保持兴趣，一点点学习下去，不是难事。

   所有天才程序员，都曾是儿童，回到儿童思维来理解和学习。觉得什么有趣，先学，不懂的，先放着，遇到问题再来学，效果更好。

   唯一建议是，不要太贪心，耐心学好一门优雅的语言，再学其它。虽然Javascript做特效很炫，或提某问题时，有大牛建议，用Ruby来写更好之类，不要改方向。就像老笑话：“要学习递归，必须首先理解递归。”然后死循环一直下去。坚持学好一门语言，再研究其他。

   即使一门语言，跟网络，数据库等等相关的部分，若都能学好，再学其他语言，是很快的事情。

   另外就是，用学英文的耐心来学计算机，英文遇到不懂的词，抄下，查询。

   python里，看到Http，查查定义，看到outHtml，查查定义，跟初学英语时候一样，不要直接猜意思，因为精确描述性定义，跟含糊自然语有区别的。而新人瞎猜，很容易错误理解，wiki，google很有用。

芝麻问答：如何学习Python 点击打开链接作者：@halida

如何学习python

我们假设你是一个初级程序员, 只懂得一点点的基础知识, 希望能够用python来做开发. 这篇文档就是为了满足以上目标而写的.

大纲

按照这篇文档所指示的任务过一遍, 你就能够做到:

熟悉python语言, 以及学会python的编码方式. 熟悉python库, 遇到开发任务的时候知道如何去找对应的模块. 知道如何查找和获取第三方的python库, 以应付开发任务. 学习步骤

安装开发环境

如果你在window下, 去下载pythonxy安装起来, 然后运行python, 进入python解释环境.

如果你在ubuntu下, 执行: sudo apt-get install python, 然后在命令行下运行python, 进入python解释环境.

学习方法

作为一名成熟的开发人员, 我学习新东西(假设是pyqt)的习惯方式是:

直接用google搜索pyqt的官方网站. 按照官方网站的说明, 下载pyqt. (如果是用ubuntu, 看看软件库里面是否有足够新的版本) 下载过程中, 开始阅读官方网站上面的教程. 一边看教程, 一遍按照教程使用pyqt. 如果发现教程不够全面, 用google搜索是否有对应的教学书籍可以看. 示例学习完毕, 开发一个玩具程序, 用来检验自己是否需要用到的功能. 开始学习python

我建议你学习的过程也按照上面来, 首先过一遍python官方文档:

http://docs.python.org/tutorial/index.html

然后做 http://www.pythonchallenge.com/ 这个网站上面的题目.

如果卡在某一关太久, 可以看答案(google python challenge answer), 做完后看看别人的编码方式和自己有什么区别.

小项目

做完一遍后, 你会发现已经熟悉了基本的python开发. 然后做点小项目吧. 这里是一些题目, 挑感兴趣的去做.

• 写一个简单的计算器/记账软件/扫雷游戏(用pyqt库做界面)
• 写一个聊天室网站(用webpy框架, jquery刷新新的回复)
• 写一个爬虫, 获取douban上面所有用户的地点, 画地点分布的直方图(用lxml解析, 保存数据到sqlite里面去, 用matplotlib画图)

FAQ

Q: 遇到了问题, 到哪里求助?

A: 上 http://groups.google.com/group/python-cn (需要翻墙) 或者 http://stackoverflow.com 提问就可以了.

Q: 如何查找python的某个功能?

A: 看官方文档. http://docs.python.org/library/index.html

Q: 如何用python完成一个任务(比如写网站)?

A: google: python 写网站, 或者 google: python web development.

知乎问答：你是如何自学 Python 的？点击打开链接 作者:@成增存

阶段一：前辈领进门。
第一眼是一个前辈给我看了看Python的代码，因为自己最早学习的是Java语言，第一眼看到Python的时候，前辈说，“Python是面向对象的”，然后就 打印了几句代码。可我怎么也看不出到底哪里是“面向对象”的。前辈说“在Python里，一切皆对象”，我才有点领悟的说道：“原来把什么看成对象，就是面向对象”，哈哈。

阶段二：开始看的是《Dive into Python》、《Leaning python》、《Python Doc》。
因为有很多语言学习经历，很快就完成了初步语法和使用学习。太复杂的特性还是在使用中逐步掌握的。

阶段三：开始使用Python做自己的一些日常工作。
比如Python搜索文件，Python批量处理等，使用最多的还是re模块和socket相关模块。写了大量的例子，让自己对Python更加喜爱，也更加熟悉。此时翻阅最多的是《Python Doc》的指南。不管是语言参考、库参考、Demo参考，都有大量可使用的内容，内容质量很高堪比JDK。

阶段四：生产上马。
开始使用Django，Flask，Tornado开发一些web应用，写一些日常使用的工具包等。逐步提升设计能力，和整体代码的管理能力。

阶段五：更合理的分配好C，Java，Python三门语言各自擅长的部分。
把合适的语言用到合适的地方。尽管一门语言有时候可以搞定所有的，但用擅长的语言解决合适的问题才是效率最高的。这也是“Python的大道至简”的理念带给我的帮助和认识。

PS：其中过程中主要的一些 方法 :

1. 看书。学习的基础。

2. 自己本地练习。编程还是要实践出真知。
   

3. 资料查询。google，stackoverflow等多关注。
   

4. 交流。各种论坛上的python group，论坛。最早去的CU，JavaEye，不过现在貌似去的少了。google group 必须订阅。
   

   学习+实践+总结，掌握语言的法宝。

六、Just Do It

看了这么多资料了，还没动手敲代码？

好吧，最好一篇文章《我在学习编程中犯的两个 最大错误 》点击打开链接

Just do it 。动手敲代码吧。

注：本文由@史江歌（[email protected]）根据互联网资料收集整理而成。

七、更新

Python技术博客、招聘、开源软件、Python中文网站导航

遇到python问题怎么样解决？python help dir stackoverflow docs google

在线视频教学(英文)codecademy

英文Python for beginners

英文How do I learn Python from zero to web development?（各种电子书推荐）点击打开链接

Python应用与实践 Python是什么？谁在用它？相关工具？作者：@吴秦

Python模块学习 相当于翻译官网文档

针对有其他语言经验的人，英文：Learn X in Y minutes 中文翻译Y分钟学会Python（译）

PyCoder’s Weekly 中文翻译 说明：文章质量很高

PEP 20 (Python之禅) 的实例 说明：code_stype

Unicode之痛 必读

有关 Python 2 和 Sublime Text 中文 Unicode 编码问题的分析与理解 必读

stackoverflow上Python相关回答整理翻译

Python语言总结-初级中级高级教程 作者：@crifan Li

Python Guide Python 最佳实践 英文

《码农周刊》干货精选（Python 篇） 精选总结

八、爬虫以及模拟登陆新浪微博

知乎：Python 爬虫如何入门学习

Python爬虫学习系列教程 @崔庆才系列教程，入门、实战、爬虫利器介绍、进阶

Python模拟登录新浪微薄（使用RSA加密方式和Cookies文件）

http://uliweb.clkg.org/tutorial/view_chapter/240

一个简单的分布式新浪微博爬虫

用python爬虫抓站的一些技巧总结

使用python爬虫抓站的一些技巧总结：进阶篇

网络爬虫系列

九、工具

Windows系统下，Python相关包Windows Binaries for Python Extension Packages

Stackoverflow经典Python问答

如果你是一名自诩为程序员的，那么，就必须知道stackoverflow.com这个网站。因为它是一个非常好的技术问答网站，里面不仅有高手，更重要的是有对问题进行详细耐心解答的高手。

目录

基本对象和语句

• Python是否有三元条件运算符
• 如何把两个Python字典用一个表达式合并
• 对Python字典按值排序
• append和extend的区别
• 获得Python的循环索引
• 判断一个字符串是否含子串的方法
• 怎样在Python中实现Enum（枚举）的功能
• 将多行的异常变成一行
• 解释Python的切片法
• 如何在Python中获取当前时间
• 查看某个给定的键是否已经在字典中
• 如何删除Python中的换行符？
• 如何将Python列表均匀划分？
• join函数为什么是string.join(list)而不是list.join(string)
• 我如何在Python中检查一个字符串否可转化为数字？

文件

• 如何使用Python来检查文件是否存在
• 如何在Python中列出目录下的所有文件

函数和类

• Python中yield关键词的作用是什么
• Python中的元类是什么
• 怎样在Python中创建函数装饰器链
• if __name__ == "__main__"是做什么用的
• @staticmethod（静态方法）和@classmethod（类方法）的区别
• 如何通过参数来传递一个变量？
• Python中的 __str__和__repr__之间的区别
• 如何使用 ' super '
• Python中的静态方法？

系统

• 在Python中调用外部命令
• 检查目录是否存在，如果有必要就创建一个目录

python面试题库整理(待完善)

python面试题

---

• Python面试题长啥样？

前端面试题库整理

FED面试题库整理

---

第一部分

• 写给前端面试者
• FEX 的面试过程
• 前端面试问题和答案
• Web前端程序员简历模板
• 经典-Front-end-Developer-Questions
• Front-end-Web-Development-Interview-Question
• Front-end-Interview-questions
• 前端开发校招（电面）面试题

---

第二部分

• 前端面试题目1
• 前端面试题目2
• 前端面试题目3
• 前端面试题目4
• 前端面试题目5
• 前端面试题目6
• 前端面试题目7
• 前端面试题目8
• 前端面试题目9
• 前端面试题目10
• 前端面试题目11
• 前端面试题目12
• 前端面试题目13
• 前端面试题目14
• 前端面试之CSS总结(上)
• HTML-CSS-Answers
• Web前端面试题目汇总
• 前端工作面试经典问题（超级全）
• Front End Developer Questions（前端开发面试题）
• FE-Interview
• 前端工程师面试题汇总
• 那几个月在找工作（百度，网易游戏）
• 2014最新面试题
• 阿里前端面试题
• 2016校招内推 — 阿里巴巴前端 — 三面面试经历
• 腾讯面试题
• 年后跳槽那点事：乐视+金山+360面试之行
• 阿里前端面试题上线
• 拉勾网js面试题
• 前端面试
• Web开发笔试面试题 大全
• 前端开发面试题
• 2014最新前端面试题
• 百度面试
• 面试题
• 前端工作面试问题
• 前端开发面试题
• 最全前端面试问题及答案总结
• 如何面试一名前端开发工程师？
• 史上最全 前端开发面试问题及答案整理
• 前端实习生面试总结
• 史上最全 前端开发面试问题及答案整理
• BAT及各大互联网公司2014前端笔试面试题：JavaScript篇
• 前端开发面试题大收集
• 收集的前端面试题和答案
• 如何面试前端工程师
• 前端开发面试题
• 牛客网-笔试面经

---

第三部分

• 牛客网-专业IT笔试面试备考平台-全面提升IT编程能力
• Front End Web Development Quiz
• JavaScript Web Quiz
• Interview Questions for front-end-Developer
• 10 Interview Questions Every JavaScript Developer Should Know
• InterviewThis
• 前端面试题集锦及答案解析

---

综合其他

• 前端基础问题整理-JavaScript相关
• 关于前端面试
• FE-interview
• 关于程序员求职简历
• about-resume
• 如何写简历--推荐阅读
• 很多前端面试题
• Front-end-Interview-questions

前端入门资源

转载请注明出处: https://github.com/qiu-deqing/FE-learning

Table of Contents generated with DocToc

• FE-learning
  • 必备基础技能
  • 基本开发工具
  • 学习方法和学习目标
  • 入门之路
  • 继续提高
  • 一些个人经历
    • [LingyuCoder的学习经历](#lingyucoderhttpsgithubcomlingyucoder%E7%9A%84%E5%AD%A6%E4%B9%A0%E7%BB%8F%E5%8E%86)
      • 工具
      • 技能
        • 语言基础
        • 进阶
        • 项目
        • 未来
        • 其他
      • 入门书
      • 一些不错的网站
      • 历程
    • [MrRaindrop的学习经历](#mrraindrophttpsgithubcommrraindrop%E7%9A%84%E5%AD%A6%E4%B9%A0%E7%BB%8F%E5%8E%86)
      • 缘起
      • 项目，下一个项目
      • 收集癖和知识管理
      • 跟对神
      • 读书
      • 前端的定位
      • 最后
    • byr论坛yiyizym的建议

FE-learning

结合个人经历总结的前端入门方法，总结从零基础到具备前端基本技能的道路、学习方法、资料。由于能力有限，不能保证面面俱到，只是作为入门参考，面向初学者，让初学者少走弯路。

互联网的快速发展和激烈竞争，用户体验成为一个重要的关注点，导致专业前端工程师成为热门职业，各大公司对前端工程师的需求量都很大，要求也越来越高，优秀的前端工程师更是稀缺。个人感觉前端入门相对容易，但是也需要系统地认真学习，在打好基础后坚持学习，成为优秀前端工程师也只是时间问题。

学习任何知识最重要的都是兴趣，如果经过一段时间的学习感觉不喜欢，那可能强迫自己学习是很痛苦的，效果也不会好，毕竟这很可能就是以后很多年生存的技能。不过随着互联网行业的发展，前端必然是Web开发人员需要学习的知识，有时候是没有专业前端工程师一起合作的，所以即使不做专门的前端工程师，掌握基本的前端技能为工作带来方便。

后期邀请了一些同学分享学习经历。如果有同学愿意分享,欢迎push

必备基础技能

前端技能汇总这个项目详细记录
了前端工程师牵涉到的各方面知识。在具备基本技能之后可以在里面找到学习
的方向，完善技能和知识面。

frontend-dev-bookmarks是老外总结的前端开发资源。覆盖面非常广。包括各种知识点、工具、技术，非常全面。

以下是个人觉得入门阶段应该熟练掌握的基础技能：

• HTML4，HTML5语法、标签、语义
• CSS2.1，CSS3规范，与HTML结合实现各种布局、效果
• Ecma-262定义的javascript的语言核心，原生客户端javascript，DOM操作，HTML5新增功能
• 一个成熟的客户端javascript库，推荐jquery
• 一门服务器端语言：如果有服务器端开发经验，使用已经会的语言即可，如果没有服务器端开发经验，熟悉Java可以选择Servlet，不熟悉的可以选PHP，能实现简单登陆注册功能就足够支持前端开发了，后续可能需要继续学习，最基本要求是实现简单的功能模拟，
• HTTP

在掌握以上基础技能之后，工作中遇到需要的技术也能快速学习。

基本开发工具

恰当的工具能有效提高学习效率，将重点放在知识本身，在出现问题时能快速定位并
解决问题，以下是个人觉得必备的前端开发工具：

• 文本编辑器：推荐Sublime Text，支持各种插件、主题、设置，使用方便
• 浏览器：推荐Google Chrome，更新快，对前端各种标准提供了非常好的支持
• 调试工具：推荐Chrome自带的Chrome develop tools，可以轻松查看DOM结构、样式，通过控制台输出调试信息，调试javascript，查看网络等
• 辅助工具：PhotoShop编辑图片、取色，fireworks量尺寸，AlloyDesigner对比尺寸，以及前面的到的Chrome develop tools，
• 翻墙工具：lantern, 壁虎漫步

学习方法和学习目标

方法：

1. 入门阶段反复阅读经典书籍的中文版，书籍中的每一个例子都动手实现并在浏览器中查看效果
2. 在具备一定基础之后可以上网搜各种教程、demo，了解各种功能的实际用法和常见功能的实现方法
3. 阅读HTML，CSS，Javascript标准全面完善知识点
4. 阅读前端牛人的博客、文章提升对知识的理解
5. 善用搜索引擎

目标：

1. 熟记前面知识点部分的重要概念，结合学习经历得到自己的理解
2. 熟悉常见功能的实现方法，如常见CSS布局，Tab控件等。

入门之路

以下是入门阶段不错的书籍和资料

1. HTML先看《HTML & CSS: Design and Build Websites》1-9章，然后《HTML5: The Missing Manual》1-4章。
2. CSS先看《CSS: The Missing Manual》，然后《CSS权威指南》
3. javascript先看《javascript高级程序设计》，然后《javascript权威指南》
4. HTTP看HTTP权威指南
5. 在整个学习过程中HTML CSS JavaScript会有很多地方需要互相结合，实际工作中也是这样，一个简单的功能模块都需要三者结合才能实现。
6. 动手是学习的重要组成部分，书籍重点讲解知识点，例子可能不是很充足，这就需要利用搜索引擎寻找一些简单教程，照着教程实现功能。以下是一些比较好的教程网址
   • 可以搜索各大公司前端校招笔试面试题作为练习题或者他人总结的前端面试题还有个人总结的面试题（带参考答案）
   • http://code.tutsplus.com有各种各样的教程
   • MDN也有很多教程，更重要的是里面有详细的文档，需要查找某个功能时在Google搜索：xxx site:https://developer.mozilla.org
   • http://www.html5rocks.com/zh/也有很多优质教程
   • http://www.sitepoint.com/
   • http://alistapart.com/
7. 原生javascript是需要重点掌握的技能，在掌握原生javascript的基础上推荐熟练掌握jQuery，在实际工作中用处很大，这方面的书籍有《Learning jQuery》或者去jQuery官网
8. 建一个https://github.com/账号，保存平时学习中的各种代码和项目。
9. 有了一定基础之后可以搭建一个个人博客，记录学习过程中遇到的问题和解决方法，方便自己查阅也为其他人提供了帮助。也可以去http://www.cnblogs.com/或者http://www.csdn.net/这样的网站注册账号，方便实用
10. 经常实用Google搜索英文资料应该经常找到来自http://stackoverflow.com/的高质量答案，与到问题可以直接在这里搜索，如果有精力，注册一个账号为别人解答问题也能极大提高个人能力。
11. 经典书籍熟读之后，可以打开前面必备基础技能部分的链接。认真读对应标准，全面掌握知识

继续提高

有了前面的基础之后，前端基本算是入门了，这时候可能每个人心中都有了一些学习方向，如果还是没有。
可以参考前面必备技能部分提到的那两个项目，从里面选一些进行发展学习。以下是一些不错的方面：

• Grunt：前端自动化工具，提高工作效率
• less css：优秀的CSS预处理器
• bootstrap：优秀的CSS框架，对没有设计师的团队很不错，与less结合使用效果完美
• requirejs：AMD规范的模块加载器，前端模块化趋势的必备工具
• Node.js：JavaScript也可以做后台，前端工程师地位更上一步
• AngularJS：做Single Page Application的好工具
• 移动端web开发：智能手机的普及让移动端的流量正在逐步赶超PC端
• Javascript内存管理：SPA长期运行需要注意内存泄露的问题
• High Performance JavaScript(Build Faster Web Application Interfaces)
• Best Practices for Speeding Up Your Web Site：重要技能

一些个人经历

LingyuCoder的学习经历

上面的大神都总结得差不多了，我这里就胡扯一些吧

工具

• chrome dev tools：前端开发调试利器，着重注意几个功能：
  • console（废话）
  • elements:元素样式调整，很常用
  • sources：代码中添加断点，单步调试，以及单步调试过程中查看内存中的对象
    • watch expression：通过表达式查看当前内存中的值
    • call stack：查看调用栈，开启async，可以看异步调用栈（这个非常有用，尤其是ajax调试的时候）
    • scope variables：作用域链上的变量，非常有用
  • network：抓包查看每个请求，非常重要，前后端联调必备
  • timeline：分析渲染、js执行等等各个阶段，性能优化利器
  • emulation：模拟移动端环境，mobile页面开发必备
  • 一些插件:
    • liveload: 修改页面后自动刷新，不用按F5
    • dimensions：直接在页面上测量的利器
    • livestyle：css样式修改后自动起效果，不需要刷新，elements修改后也能同步到代码中
    • image tool：测量，取色
    • UC二维码：移动端调试扫码必备
    • pagespeed，YSlow：页面性能分析和优化插件
    • 马克飞象：优秀的在线markdown编辑器，快速写周报，做记录
• sublime text2：编码方便，插件多，速度快，性能好
  • emmet：提升html编码速度必备
  • sublimelinter + 各种语言的lint和hint：代码纠错
  • 一些snippets：自动补全，提升开发效率
• Intellij IDEA和WebStorm：集成开发环境，集成了各种功能，开发比sublime要方便，但会比较吃性能
• Mark Men：测量、取色、标注利器，拿到视觉稿之后第一个打开的软件
• GFW Fucker：我用红杏，可以的话买个虚拟服务器当梯子
• iHosts：非常优秀的hosts管理软件，轻松修改hosts，开发调试必备
• Charles：Mac 平台最好用的抓包分析工具
• Rythem：AlloyTeam出品的代理抓包软件，非常轻量，安装简单，移动端（真机）开发调试很好用
• Wunderlist：一个非常不错的Todo List，任务、需求多的时候管理起来很方便

技能

前端的技能其实除了JavaScript（包括NodeJS）、HTML、CSS以外，还有很多。其实前端的技能树很大，这里只能列一些我开发中见到的说一说

语言基础

JavaScript：

• 作用域链、闭包、运行时上下文、this
• 原型链、继承
• NodeJS基础和常用API

CSS：

• 选择器
• 浏览器兼容性及常见的hack处理
• CSS布局的方式和原理（盒子模型、BFC、IFC等等）
• CSS 3，如animation、gradient、等等

HTML：

• 语义化标签

进阶

JavaScript:

• 异步控制（Promise、ES6 generator、Async）
• 模块化的开发方式（AMD、CMD、KMD等等）
• JavaScript解释器的一些相关知识
  • 异步IO实现
  • 垃圾回收
  • 事件队列
• 常用框架使用及其原理
  • jQuery：基于选择器的框架，但个人认为不能叫框架，应该算工具库，因为不具备模块加载机制，其中源码很适合阅读钻研
  • AngularJS/Avalon等MVVM框架：着重理解MVVM模式本身的理念和双向绑定的实现，如何解耦
  • underscore：优秀的工具库，方便的理解常用工具代码片段的实现
  • polymer/React: 组件化开发，面向未来，理解组件化开发的原理

CSS和HTML：主要是CSS3的特性和HTML5的特性，以及浏览器处理的流程和绘制原理

• DOM树、CSSOM树、渲染树的构建流程及页面渲染的过程
• 解析HTML、CSS、JavaScript时造成的阻塞
• HTML5相关
  • SVG及矢量图原理
  • Canvas开发及动画原理（帧动画）
  • Video和Audio
• flex box布局方式
• icon fonts的使用

常用NodeJs的package：

• koa
• express
• underscore
• async
• gulp
• grunt
• connect
• request

一些理念：

• 响应式Web
• 优雅降级、渐进增强
• don`t make me think
• 网页可用性、可访问性、其中的意义
• SEO搜索引擎优化，了解搜索引擎的原理
• SPA的好处和问题

性能优化：

• 减少请求数量（sprite、combo）
• 善用缓存（application cache、http缓存、CDN、localstorage、sessionstorage，备忘录模式）
• 减少选择器消耗（从右到左），减少DOM操作（DOM和JavaScript解释器的分离）
• CSS的回流与重绘

项目

• 版本管理：首推Git，用过Git都不会想用SVN了
  • Git：本地版本管理的机制
  • SVN：远程中心的版本管理机制
• 自动化构建：主要就是less、模板、coffee等的预处理以及对代码压缩和合并
  • Gulp：基于流构建，速度快、模块质量好
  • Grunt：独立任务构建，速度慢，配置蛋疼，灵活性高
• 预处理和模板引擎
  • less：语法简单，但功能有限
  • jade、ejs、velocity等模板引擎，各有各的长处
  • coffee：python工程师最爱，我没用过
• 环境搭建：主要是将线上代码映射到本地，并在本地启动一个demo服务器，至于模拟数据的mock，见仁见智了
  • 本地代理：ihosts
• 自动化测试：在业务较为稳定的情况下，可以通过自动化测试来减少测试的事件，但需求较多的时候，维护测试用例的成本会很高，可能用自动化测试会起到反效果
  • jasmine
  • mocha
• 生态系统
  • npm
  • bower
  • spm
• 搭建一个属于自己的博客
  • git pages
  • hexo
  • jekyll

未来

• Web Componets：面向未来的组件化开发方式
  • HTML模板
  • Shadow DOM
  • Custom Elements
  • HTML Import
• 移动端Native开发：这也是需要了解的，以后前端工程师会经常地和webview打交道，也要了解native开发

其他

有些东西不是考敲码就能弄好的，我参与实习的时候感受到了很多，这些是我遇到的也是我感觉自己做的不好的地方

• 对于业务的思考：我个人这方面非常欠缺，所以放在最前面，在敲码前要多思考业务
• 交流和沟通能力：这个非常重要，前端同时需要与项目经理、产品、交互、后台打交道，沟通不善会导致很多无用功，延缓项目
• 知识管理、时间管理：input和output的平衡，output是最好的input。如何做好分享，参与社区，做好交流，作好记录
• 对新技术的渴望，以及敢于尝试

入门书

入门可以通过啃书，但书本上的东西很多都已经过时了，在啃书的同时，也要持续关注技术的新动态。这里推几本我觉着不错的书：

• 《JavaScript高级编程》：可以作为入门书籍，但同时也是高级书籍，可以快速吸收基础，等到提升再回来重新看
• 《JavaScript权威指南》：不太适合入门，但是必备，不理解的地方就去查阅一下，很有帮助
• 《编写可维护的JavaScript》和：
• 《Node.js开发指南》：不错的Nodejs入门书籍
• 《深入浅出Node.js》：Nodejs进阶书籍，必备
• 《JavaScript异步编程》：理解JS异步的编程理念
• 《JavaScript模式》和《JavaScript设计模式》：JavaScript的代码模式和设计模式，将开发思维转变到JavaScript，非常好的书
• 《JavaScript框架设计》：在用轮子同时，应当知道轮子是怎么转起来的，讲解很详细，从源码级别讲解框架的各个部分的实现，配合一个现有框架阅读，可以学到很多东西
• 《Don`t make me think》：网页设计的理念，了解用户行为，非常不错
• 《CSS禅意花园》：经久不衰的一部著作，同样传递了网页设计中的理念以及设计中需要注意的问题
• 《高性能JavaScript》和《高性能HTML5》：强调性能的书，其中不只是性能优化，还有很多原理层面的东西值得学习
• 《HTML5 Canvas核心技术》：我正在读的一本书，对于canvas的使用，动画的实现，以及动画框架的开发都非常有帮助
• 《HTTP权威指南》：HTTP协议相关必备，前端开发调试的时候也会经常涉及到其中的知识
• 《响应式Web设计》：技术本身不难，重要的是响应式网页的设计理念，以及移动先行的**
• 《JavaScript语言精粹》：老道的书，也是普及JavaScript的开发思维的一本好书，非常适合入门

一些不错的网站

• github：没啥好说的，多阅读别人的源码，多上传自己的源码，向世界各地的大牛学习
• codepen：感受前端之美的必选之地，里面有很多酷炫的效果和优秀的插件
• echojs：快速了解js新资讯的网站
• stackoverflow和segmentfault：基本上各种问题都能在上面获得解答
• google web fundamentals：每篇文章都适合仔细阅读
• static files：开放的CDN，很好用
• iconfont：阿里的矢量图标库，非常不错，支持CDN而且支持项目
• html5 rocks: 一个不错的网站，很多浏览器的新特性以及前沿的技术，都能在这上面找到文章
• css tricks：如何活用CSS，以及了解CSS新特性，这里可以满足你
• JavaScript 秘密花园 JavaScript初学必看，非常不错
• w3cplus：一个前端学习的网站，里面的文章质量都挺不错的
• node school：一个不错的node学习网站
• learn git branch：一个git学习网站，交互很棒
• 前端乱炖：一个前端文章分享的社区，有很多优秀文章
• 正则表达式：一个正则表达式入门教程，非常值得一看
• 阮一峰的博客和张鑫旭的博客：快速了解某些知识的捷径，但是如果需要深挖，还需要其他的资源
• 各路大牛的博客：这个太多了，就不贴了，知乎上有很全的
• 各种规范的官方网站，不懂得时候读规范

历程

以前是做Java SSH的，半路出家做的前端，所以水平比较弱，遇到问题也比较多。基本上入门靠看书和W3C School上的教程，以及一些前端博客，如汤姆大叔的博客。以前也只是使用jQuery，原生js也没有太多的钻研，后来逐渐看了很多本动物书，比如老道的语言精粹等等。从这些书中学到了很多语言层面的知识。但这显然是不够的，所以我经常会去社区上看看大家在谈论什么，然后去看看相关的资料，感兴趣就会多找些资料看看，或者写一写demo。学CSS主要就是通过这种方式。后来开始更多的关注各路大牛的博客和一些比较深的书籍，以及关注一些新的知识和框架，并且不断地练手提交代码到github，这样也学到了很多知识。在实习的过程中，切身参与到实际项目开发之中，能学到很多在学校学不到的理念和思维，这点也有很大的帮助。不说了，我要去搬砖求offer了...

MrRaindrop的学习经历

应qiu神的邀请分享一下前端学习经验，这里对前端知识体系架构就不做总结了，各位大神们的总结已经相当到位了，我就贡献几个个人认为还比较有用的链接大家研究研究就好，然后主要分享一下我在前端学习过程中遇到的问题和总结的经验教训吧，如果能帮到想要入门的FE初学者（我就姑且假定为本文的读者受众类型了），让他们少走点弯路，每走一步都知道自己下一步的方向，这是最好了。各位大神的总结和分享详见qiu神整理的FE-learning。

先说下，前端这个东西每个人都可以有适合自己的学习方法，这篇仅作参考，写的有点乱，各位凑合看。

缘起

我是属于误打误撞进了前端，之前一直往做游戏的方向去来着，搞过游戏网站，玩过游戏引擎，比如unity，unreal这种商业引擎，捣鼓了几个游戏原型，不过自打研一进了实验室，直接就被导师派去写了js，导师给了我半个月时间让我写个基于百度地图api的数据展示页面，虽然这个时间还是相当宽裕的，不过之前没怎么写过js，也不会用地图api，于是我就一边啃着《Javascript权威指南》（犀牛书）一边参考实验室前人留下的“代码”，总算是把功能都写出来了。那个页面算我的js入门作了，也是我前端学习路线的开始。

现在想来，虽然指派了去做前端，但是一直做下去并做好还是得靠兴趣维持，当然前端是一个趣味性十足的技术领域，而且社区每天都很“热闹”。

项目，下一个项目

我个人认为前端的学习，初学阶段你可以完全脱离开书本，以项目驱动。虽然我个人是从犀牛书开始啃的，不过如果你没有充足的时间，或者觉得啃大部头乏而无味的话，还是别像我这样。当然了如果决定啃书最好是把书里的例子都跟着敲一遍的。我上研之前没接触过js，4月份还没开学呢就被直接被导师甩了个百度地图api的项目到脸上，接着就是各种ERP，地图数据展示，虽然换着花样来一点不重样，不过基本上都是前端的活，SSH和android开发也打过酱油，整个实验室就我一个人写前端敢信？富客户端SPA时代的后端就是一个restful接口，代码量基本都在前端啊，写的我一个人怎一个爽字了得...期间跟着导师感受了一把创业，每天从7点搞到晚上10点，也算是经历了一段快速成长期。

掌握一门技术先掌握它的大体框架，想一个能实现的点子，做一个能跑就行的demo，再去完善它的细节，等到demo完成了，对这门技术有了一个感性的认识，再去啃书，收获会大很多。我从开始原生js写到jquery，再到extjs，再到angularjs，从导师指定技术，到自己做技术选型，一个项目接着一个项目的练，就跟打怪升级似的。当然没有项目就去自己创造项目，动手实现自己的想法是件有乐趣和成就感的事。

收集癖和知识管理

前端学习有个特点，很多东西都很零碎，分散，需要你自己去整理、归纳和总结。在微博、知乎上follow了众多的大神，你不仅仅是为了听八卦，大神们的只言片语有时候留下的是无尽的余味，很有可能一个不经意提到的一个词就成为你下一个学习的目标。收集这些信息，善用google，提问，思考。就像游戏里的收集要素，前端学习也是充满搜集要素的一个“游戏”，只不过你需要一个知识管理工具来充当物品栏和仓库，我所知道的大牛们无一不是知识管理工具的重度使用者。以前用的oneNote，那时候还没绑定到云存储，现在基本上用evernote，笔记已经累计到1200+篇。书签一直打算用delicious，因为它是基于tag管理的，但一直没用起来。当然重点不在于这些工具，但是趁手的工具可以提高你的学习效率。最关键当然是随时保持旺盛的学习欲望，你的目标是了解有关前端的一切（当然不是所有都要掌握，因为毕竟你的精力有限，而且现实的说这也不太可能）。

跟对神

这个可控性貌似不大...跟对老大这个就不多说了，一定程度要看造化。不过话说回来，多跟身边的高手交流是王道，这个高手不一定要多高，但是一定要对技术有热情。研一的时候热情高涨，每天7点进实验室门，然后发现有个家伙居然比我还早到。后来发现这家伙上午就走了，下午又来了，而且导师对此习以为常，原来这家伙晚上不睡觉通宵写代码，上午才跑回去睡。后来经常和这位神讨论问题，每次感觉经验值蹭蹭蹭的往上涨。然后实验室还有一位神，被前面这位通宵神形容为“只能望其项背，一直在追赶，从来没赶上”，两位神的特点都是什么都了解一点，所以什么都能跟你讨论得起来，我有段时间做了个读书计划，从c/c++到vc/mfc再到unix网络编程，最后一路看到java核心技术和MSDN上的C#编程指南，和神们也能扯得很high了。

总之就是这两位神把我拉进了坑，或者说从一个坑跳进另一坑，虽然两位神都不是搞前端的，不过技术之间总有相通之处。

读书

读书，多读书，读好书。在刘未鹏的博客里看到过一个公式，你第一个月的工资等于之前买过（读过）的技术书价格总和（这里说的技术书指那些经典的公认的好书）。讨论这个公式的正确性似乎没什么意义，然而它的合理性是毋庸置疑的，那就是多读经典技术书。最极端的一个例子，google的徐宥在我的大学里面说他扫荡了图书馆的整个TP312书架...对于前端的经典书籍，后面列了一个我收集的前端书列（如果有遗漏的前端经典好书，还请留言告诉我），有条件可以尝试刷一遍这些书，我也是在找完整的时间去啃完它们。之前说的，前端知识点松散，收集零散的知识点，从博客里快速学习等，这些只是前端学习的一个方面，如果你要想深入理解一个知识体系，了解它的来龙去脉，对它建立系统认识，读经典书还是必不可少的。

我从最开始啃完犀牛书，然后接着去看了其他一些和前端干系不大的经典技术书，再后来通过实验室的项目和自己弄的一些小项目逐渐对前端领域比较上路以后，又看了《Javascript模式》、《Javascript设计模式》、《编写可维护的Javascript》，后来了解到node并开始用node搞点小玩意儿，又看了本《NodeJS up and run》和《Mongodb权威指南》，不过感觉前者略坑。那会儿朴灵那本深入浅出（晒书么么哒）还没出，后来出了就去图书馆借来看完，这么看下来感觉还不错，不过感觉看的还是偏少了，还需要继续刷（参照上面的书列）。

前端的定位

前端的定位关乎到你需要吸收什么样的知识和技能，决定在技术世界里你对什么需要格外敏感。如果你认为前端仅仅停留在切页面，实现交互和视觉的要求，那你对前端的认识还停留在初级阶段。阿里终面的时候我问了考官这么个问题：前端技术日新月异，范围越扩越宽，标准越来越丰富，似乎任何一个触角都能伸出很远。怎么给前端一个合适的定位？考官给我分析了半天，然后总结成一句话，就是用户和网站的联结者，用户体验的创造者（原话不是这样，但大体是这个意思）。也就是说前端的终极目标其实就是创造用户体验，提升用户体验，以用户体验为中心。不管你是从交互设计上下手，还是从性能优化出发，或者改进工作流提升工作流效率，最终都是为了创造和提升用户体验，最终都要体现到用户体验这一点上来。我认为这个总结非常有道理（当然“用户体验”这个词太宽泛了，并且不仅仅是前端工程师的范畴，比如开发后台的时候对一个数据处理过程进行优化，提升了整体性能，这也是对用户体验的一个提升）。

现在的前端工程师做到一定阶段不可避免会接触到很多比切页面、实现视觉要求、实现交互等更深入的问题，比如前端自动化、图像编程、性能优化等等，再往后推一点就是PHP/JSP/ASP/nodeJs，过去后端模板一般属于后端的范畴，现在随着前端架构的演进，可能会让你去写后端模板的代码，需要用到后端语言（PHP/Java/C#等），这就是所谓大前端（然而这与前端的定位并不是相背离的，大前端处理的依然是与用户接触的部分，仍然是对用户体验的优化）。可能最常见或者被谈论最多的就是node，其实这几种技术选型都可以，bat三家据说百度用PHP比较多，阿里用node比较多。

玉伯在他的博客里提过所谓全端是横向的，全栈是纵向的。全端即所有的终端说白了都是前端，因为都关乎到用户体验，直接和用户接触。适应多终端的开发，要求你在web前端的基础上，可能还要去扩展android开发和ios开发的知识，好在由于hybrid开发方式的流行，对使用native语言开发的技能会要求的不那么深入。

全栈可以说是最适合初创公司的一种发展类型，广义上认为是从前端干到后端，从开发干到运维，这种就不说了，一般人应该不会想要去往这个方向发展，想要成为这种意义上的full-stack dev的，可能用不着来看我这篇文章了；而狭义上的全栈特指使用js语言从前端写到架设在nodeJs上的后端，前后端统一语言，统一编程模型，甚至公用同一套代码。更多了解全栈开发可以看看玉伯这篇说说全栈工程师。

以上是我对前端以及衍生出来的技术路线的一些浅薄理解，学习一个领域掌握它的整体上的走向和趋势还是挺重要的。另外如果想要对前端学习方向、职业成长路径有一个整体的认识，推荐看看拔赤总结的这篇前端开发十日谈。

最后

贡献几个对前端学习、面试有帮助的链接：

• 前端面试问题合集（Front-end-Developer-Interview-Questions）
• 前端技能汇总（JacksonTian）
• 另一张前端技能汇总图
• 前端那点事儿（书列）

byr论坛yiyizym的建议

与grunt相比，学习gulp会比较简单

做SPA的话，推荐backbone.js和 backbone.marionette.js

翻墙不用折腾，花十块钱买一个月的 红杏。

把基础打扎实了再学这些都没问题。

html 没什么好说的，有空学学html5。

css 尽量看文档 ，因为很多中文资料都各执一辞，看多了反而会糊涂。

有个网站可以查找html/css标签、属性在各个浏览器中的支持情况，挺好用的。

javascript 就看 javascript高级程序设计 。不过这么厚的书看过就会忘。对javascript核心概念的讲解：对象/原型链/ 构造函数/执行上下文/作用域链/闭包/this，这里有篇不错的文章。

有闲情可以看看 ecmascript 6，计划明年6月就发布啦。阮一峰的网站有入门资料。

jquery 有很多 API,这个网站可以方便查到。有时间弄清楚jquery deferred 的用法。

多给 sublimetext 装插件，比如说检查代码错误的，新建目录文件的，整理代码的。

free-programming-books

• 该项目整理了所能整理到的网络上的关于编程方面免费的书籍资源，几乎涵盖所有语言

设计师资源大全

目录

ICON图标

• Fontello：图标字体生成器
• The Noun Project：免费提供高度可辨识符号图标
• IconArchive：专业图标搜索引擎
• iConify：Mac平台的苹果应用图标自动化生成工具
• Iconbench：在线ICON素材图标制作工具
• EasyIcon：免费图标搜索和下载平台
• Icon Deposit：一个奇妙的图标下载站

Logo 设计

• Logaster：教你在线几分钟内搞定专业的LOGO设计
• LogoLounge：国际知名的LOGO设计权威网站
• LogoMoose：一个优秀的logo素材站点
• LogoPond：LOGO设计作品收藏网
• BRAND NEW：资源丰富的Logo设计网站
• LOGOED：一个展示Logo设计的博客
• LOGOSPIRE：logo设计的交流平台
• Logo of the Day：汇集世界各地优秀LOGO作品的站点
• LogoDesignLove：Logo设计技巧分享网
• Brandseen：匹配流行品牌LOGO颜色的在线游戏

Photoshop插件

• Retinize：iOS切图神器
• GuideGuide：一款PS参考线插件
• Divine Proportions Toolkit：黄金分割工具
• Kockout：PS抠图神器
• Coolors：自动生成配色色板的小工具
• Assistor PS：一个功能强大的PS辅助工具
• Flexify 2：PS变形滤镜插件
• DevRocket：一款iOS UI设计效率工具
• Slicy：Mac下的切图神器
• Kuler：Adobe的配色工具

交互设计工具

• VXPLO：专业的HTML5编辑工具
• Epub360：专业级H5交互设计工具
• Indigo Studio：UI原型设计和交互设计工具
• Avocado：无需编码的跟设计原型进行交互
• Webflow：傻瓜式网页设计制作平台
• Marvel：更专注交互动作的在线工具
• Principle：Mac平台交互动效设计神器
• Quartz Composer：图形化的编程工具
• Form：交互原型设计工具
• Pixate：设计师的免费动效神器
• Framer.js：一个交互原型设计框架
• Keynote：快速制作高保真交互原型
• ORIGAMI：交互神器-图像设计动画合成工具
• InVision：便捷的产品原型生成工具

流程图/脑图

• ProcessOn：免费的在线作图、实时协作工具
• DrawAnywhere：在线流程图制作工具
• Lovely Charts：功能强大的在线图表制作工具
• Creately：优秀的绘制产品图形的在线工具
• Cacoo：在线简单易用的网络画图工具
• LucidChart：在线流程图绘制和协作应用平台
• Gliffy：在线免费流程图制作工具
• NovaMind：非常优秀的思维导图软件
• MindMapper：专业的可视化脑图管理工具
• FreeMind：免费的思维导图软件
• XMind：非常实用的商业思维导图软件
• MindManager：专业思维导图工具
• 百度脑图：便捷的思维编辑工具

灵感酷站

• Sketchrepo：免费高品质的Sketch资源
• Psdrepo：免费高品质的PSD资源
• 1X：一个优秀的摄影作品网站
• Magdeleine：免费高清灵感图片网
• We Heart It：每天发现充满灵感且美丽的图片
• PinSpire：灵感创意作品收集平台
• NotCot：一个集视觉效果、美学为一体的网站
• 9GAG：全球最搞笑的趣图网站
• BoooooooM：设计简约但内容丰富的博客
• illusion：展示最惊人的创意图片
• Baubauhaus：提供设计灵感、插画摄影等艺术作品
• Niice：设计师必备的灵感搜索引擎
• DeviantArt：最大的艺术和设计社区
• 花瓣网：设计师寻找灵感的天堂
• pixiv：日本同人画、插画作品分享站点
• Awwwards：最佳网页设计展示平台
• WallHaven：高清壁纸图片搜索引擎
• Pinterest：图片分享类的社交网站
• Abduzeedo：一家集创意灵感和教程的设计博客
• Yanko Design：最棒的现代工业设计站点
• SwissMiss：分享创意设计的网站
• PetaPixel：专业的摄影爱好者点评博客
• 365PSD：免费psd图片素材下载网站
• Typophile：字体设计艺术网站
• Patterntap：适合用户界面设计和图案感兴趣的同学
• Designshack：设计作品欣赏网站
• Behance：全球领先的专业创意平台
• Dribbble：设计师必备网站之一
• FFFFound：专业的图片收藏网
• MyModernmet：众多艺术家不可或缺的信息来源
• Grain Edit：复古和古典风格的设计内容
• UIparade：灵感UI设计作品分享网站
• Muuuuu：日本网站画廊，收集最具创意网站
• iKesai：网页设计作品案例库
• CSS Winner：网站设计资源站点

线框图/原型图

• Prott：移动测试原型制作工具
• Solidify：一款原型制作软件
• ProcessOn：免费的在线作图、实时协作工具
• Mockingbird：一个基于 Web 的在线原型设计平台
• Creately：优秀的绘制产品图形的在线工具
• Cacoo：在线简单易用的网络画图工具
• Gliffy：在线免费流程图制作工具
• Indigo Studio：UI原型设计和交互设计工具
• 墨刀MockingBot：免费的移动应用原型与线框图工具
• Marvel：更专注交互动作的在线工具
• Keynote：快速制作高保真交互原型
• OmniGraffle：Mac平台下最好的原型设计工具
• Handmade Sketches：手工草图绘制工具
• Mockups.me：ui线框图软件
• Live wire：iPad上的线框图制作工具
• UXToolbox：Window平台的线框图工具
• DevRocket：一款iOS UI设计效率工具
• AppCooker：从图标草图到原型设计的iPad应用
• Blueprint：你轻而易举地设计原型的iPad应用
• Mockplus摩客：简洁高效的原型图设计工具
• Pencil Project：制作图表和GUI原型的工具
• iPlotz：用来创建可点击、可导航的原型和线框图工具
• Mokk.me：一个简单快速的原型工具
• InVision：便捷的产品原型生成工具
• HotGloo：功能强大的产品原型在线工具
• iPhone Mockup：非常简单的在线原型工具
• FlairBuilder：用来创建交互性线框图的快速原型工具
• Pidoco：一款基于Web的原型设计软件
• Omnigraffle：用来快速绘制线框图、图表、流程图等
• WireframeSketcher：灵活的线框图和原型快速创作工具
• Protoshare：十分便捷的在线原型制作工具
• MockFlow：制作产品原型的在线工具
• Balsamiq Mockups：基于Flash的快速制作线框图工具
• Proto.io：一个专用的手机原型开发平台
• Axure RP：专业的快速原型设计工具
• Wireframe.cc：在线线框图绘制工具
• PowerMockup ：把微软的PPT文件直接变成线框图工具
• UXPin：实体模型和在线可点击原型创作工具
• Fluid UI：用于移动开发的Web原型设计工具
• Mockup：在线线框图工具
• justinmind：产品原型设计工具

设计博客

• BoooooooM：设计简约但内容丰富的博客
• LOGOED：一个展示Logo设计的博客
• Abduzeedo：一家集创意灵感和教程的设计博客
• SwissMiss：分享创意设计的网站
• The Industry：学习平面设计的极佳出版物
• Net Magazine：文章覆盖面广，适合扩宽眼界
• Web Designer Depot：适合视觉设计人员专注
• Design Modo：偏于设计前沿和设计趋势的博客
• Lukew：干货文章分享，资深的用户体验专家
• UX Magazine：善于用通俗的案例讲解理论知识
• UXbooth：专注于用户体验设计文章
• Smashing Magazine：整体质量很高的设计文章
• The Great Discontent：提供世界顶尖创意者的漫长访谈

设计工具

• One% CSS Grid：一款基于百分比的CSS响应式框架
• Simple Grid：轻量级的响应式 CSS 网格系统
• Iconify：一个作品网站平台
• iConify：Mac平台的苹果应用图标自动化生成工具
• Viewport Resizer：一个测试响应式设计的小书签
• Divshot：在线的可视化网页设计工具
• Bootply：一款很棒的 Bootstrap UI 编辑工具
• Jetstrap：Bootstrap框架的可视化制作工具
• Layoutit：在线搭建Bootstrap响应式布局的工具
• Bonsai：一套轻量级的JavaScript绘图库
• Bootsnipp：针对Web设计师和开发者的前端元素库
• SimplyTestable：一款自动的前端网页测试工具
• Onlytasks：支持双向同步的Evernote效率工具
• rwdgrid：基于960grid的响应式网格系统
• Iconbench：在线ICON素材图标制作工具
• Photo Raster：在线免费图片编辑美化工具
• Manymo：在线安卓系统模拟器工具
• Sellbox：可以通过Dropbox账户售卖你的数字文档
• RightFont：超好用的字体管理工具
• Wobzip：提供在线解压缩文件的网站
• Archive.Today：一个网页快照捕捉工具
• Minigrid：简约漂亮的网页布局栅格系统
• Background Burner：简单的在线抠图工具
• CloudConvert：在线免费的万能文件格式转换器
• Lovely Charts：功能强大的在线图表制作工具
• Cacoo：在线简单易用的网络画图工具
• Incogna：相似图片搜索引擎
• Picitup：在线相似图片搜索引擎
• PinCap：图片资源收集管理工具
• TinEye：以图搜图的反向图片搜索引擎
• Giphy：专搜GIF动态图的搜索引擎
• LibreStock：一站搜寻二十个常用的图库网站
• Assistor PS：一个功能强大的PS辅助工具
• PaintCode：矢量图设计工具
• Macaw：富有超前性和前瞻性的Web设计工具
• Jimdo：在线网页自助建站平台
• Ceilfire：一个创建HTML5游戏并分享的平台
• Weebly：快速搭建免费网站、博客和网店
• Google Web Designer：可视化HTML5网页和广告设计开发工具
• Wix：基于html5的免费网站生成应用
• VXPLO：专业的HTML5编辑工具
• 易企秀：H5页面移动微场景应用制作工具
• 兔展：微信场景应用的在线制作工具
• Liveapp：移动场景应用平台
• MAKA：简单、强大的H5创作工具
• 初页：微信H5海报创作工具
• 白板：设计图多人实时讨论工具
• Ulead Cool 360：一个全景图片生成器
• Red pen：设计图实时讨论工具
• Coolsite360：无需编程的响应式网站设计工具
• Epub360：专业级H5交互设计工具
• 皮影客：三分钟做部动画片
• Webflow：傻瓜式网页设计制作平台
• Quartz Composer：图形化的编程工具
• After Effects：一款图形视频处理软件
• Hype 3：帮助不会编程的用户轻松创建 HTML 5
• Dorado：一款方便灵活的标注工具
• WhatFontIs：在线图片字体识别工具
• 在线认字体：看图识字的求字体网
• MarkMan马克鳗：高效的设计稿标注、测量工具
• Skala Preview：iOS UI 设计师必备
• Briefs：专业APP设计工具
• Placeit：在线预览APP界面设计效果图的模板工具
• UI Parde：在线UI设计工具
• CSS Content Filter：易于定制、便于集成的CSS内容过滤工具
• TinyCon：用于管理Favicon和弹出框
• Gitup：为Git所准备的图形化客户端
• Unsplash：用于网页中的图片占位符
• Now UI Kit：用于网页设计、平板和手机的界面
• Timber：一款前端框架工具
• Grid.Guide：计算栅格宽度的工具
• Apostrophe：一款设计驱动下的内容管理系统
• Bonsai：一款为自由设计师所准备的工具
• GridLayout：一款轻量级的栅格系统
• Rucksack：一款有趣的CSS工具
• Flarum：一套简约易用的开源论坛系统
• Lightning Design Systems：专注于构建体验优秀的企业级APP
• Frontify：维护品牌风格和样式的在线工具
• TinyPng：在线PNG图片压缩工具
• Kendo UI : jQuery HTML5 UI组件框架
• AdobeEdgeWebFonts：Adobe免费Web字体
• Sizecalc：字体大小计算器
• Inkpad：iPad 矢量插图应用

设计教程

• SlideRule：在线免费课程搜索平台
• Abduzeedo：一家集创意灵感和教程的设计博客
• HackDesign：黑客设计教学网
• Lukew：干货文章分享，资深的用户体验专家
• UX Magazine：善于用通俗的案例讲解理论知识
• UXbooth：专注于用户体验设计文章
• Smashing Magazine：整体质量很高的设计文章
• The Great Discontent：提供世界顶尖创意者的漫长访谈
• Information Aesthetics：学习信息图设计和布局的网站
• about tech：数字排版开放课程
• AIGA：专业的设计理论文章
• Design Tutsplus：专业设计教程网

设计素材

• Freepik：免费的素材搜索引擎
• RBNo2.1：是简化版的非衬线字体
• Moki：从七种不同的风格演变而来的字体
• King Wood Volume：带有Tuscan的哥特式风格的字体
• Window Dressing JNL：线条干净、简洁的字体
• Zombie Sunrise：一款手绘设计的字体
• Toolkit：一款免费的怀旧感字体
• Poly：一款基于几何排列的免费显示字体
• Eaglefeather：由P22 Type Foundry调整而来的字体
• Hummingbird：一款既怀旧复古又有科技感的字体
• Rosarian：一款书法字体
• Sketchrepo：免费高品质的Sketch资源
• Psdrepo：免费高品质的PSD资源
• The Pattern Library：免费纹理素材资源网
• PicJumbo：在线免费高质量素材网
• Material UI Colors：为Material Design而生的配色模板
• Design Kindle：免费网页UI设计素材下载站
• DeviantArt：最大的艺术和设计社区
• 花瓣网：设计师寻找灵感的天堂
• 365PSD：免费psd图片素材下载网站

配色方案

• Spectrum：色彩搭配、图片取色器工具
• Coolors：自动生成配色色板的小工具
• Material Palette：Material Design专用在线配色工具
• Material UI Colors：为Material Design而生的配色模板
• Web安全色：WEB设计、开发中常用的安全颜色
• Color Hunter：一个十分酷炫的配色网站
• 配色网：国内的非盈利配色素材网站
• Nippon colors：日本传统用色色谱网站
• Colorotate：独特创意的设计调色板
• ColorZilla：火狐浏览器网页取色器插件
• Contrast-A：非常专业的调色板配置工具
• Adobe Color CC：Adobe取色器
• Kuler：Adobe的配色工具
• Color Palette Generator：图片配色工具
• Color Scheme Designer：免费网络调色工具
• Color Hunt：漂亮炫酷的配色方案
• Brandseen：匹配流行品牌LOGO颜色的在线游戏

高清图库

• PhotoPin：基于Flickr图片资源搜索引擎
• SplitShire：免费高清摄影图片下载
• Free Refe Mobile Photos：主要提供免费的手机图片
• Photo Raster：在线免费图片编辑美化工具
• Stock Up：一次查找21个免费可商用图库网站
• Wallpaperswide：精品壁纸下载站
• Socwall：高清壁纸下载站
• flickr：雅虎旗下图片分享网站
• 500px：一个专业摄影师图片社区
• 1X：一个优秀的摄影作品网站
• Jaymantri：免费高清摄影图片网
• Picography：免费高清摄影图片分享网
• FoodiesFeed：免费食品图片下载网站
• Magdeleine：免费高清灵感图片网
• Raumrot：免费高分辨率无版权图片网
• FreeImages：免费商业图片素材网
• LifeOfPix：免费欧美生活图片网
• Incogna：相似图片搜索引擎
• Picitup：在线相似图片搜索引擎
• We Heart It：每天发现充满灵感且美丽的图片
• illusion：展示最惊人的创意图片
• VisualizeUs：一个图片收藏网站
• PinCap：图片资源收集管理工具
• TinEye：以图搜图的反向图片搜索引擎
• Giphy：专搜GIF动态图的搜索引擎
• LibreStock：一站搜寻二十个常用的图库网站
• IM Free：免费高清图片库
• The Pattern Library：免费纹理素材资源网
• PicJumbo：在线免费高质量素材网
• Design Kindle：免费网页UI设计素材下载站
• 花瓣网：设计师寻找灵感的天堂
• WallHaven：高清壁纸图片搜索引擎
• Snapographic：免费高清照片订阅网
• Twnsnd：免费复古照片公共档案库
• GIRLY DROP：高清美女图片素材站
• Foter：免费图片素材搜索引擎
• DesignersPics：免费高清图片资源
• Pexels：免费高品质图片 可商用
• Gratisography：定期发布高品质的免费照片
• Function：优秀的图片网站
• Pixabay：内容丰富的摄影照片网站
• Death To The Stock Photo：高品质的照片网站
• DotSpin：漂亮的图片素材网站
• New Old Stock：一个有趣的复古照片网站
• Superfamous：免费高质量图片素材
• Little Visuals：免费高质量图片素材
• Unsplash： 高品质免费图片素材库

GitHub上值得关注的项目

GitHub上值得关注的项目

---

• github上值得关注的前端项目
• Github资源收集

前端在线资源汇总

入门类

• 前端入门教程
• 瘳雪峰的Javascript教程
• jQuery基础教程
• 前端工程师必备的PS技能——切图篇
• 结合个人经历总结的前端入门方法

工具类

• css sprite 雪碧图制作
• 版本控制入门 – 搬进 Github
• Grunt-beginner前端自动化工具

慕课专题

• 张鑫旭 - 慕课系列
• lyn - 慕课系列
• 艾伦 - 慕课系列
• 碧仔 - Hello，移动WEB

API

• 包含各种API集合
• 开源**在线API文档合集
• devdocs 英文综合API网站

jQuery

jQuery API 中文文档

hemin 在线版

css88 jq api

学习jquery

jquery 源码查找

设计资源 Design Resources

A collection of UI/UX design resources.

设计模式 | Design Patterns

界面设计模式 | UI Design Patterns

1. Pattrns，按模式提供优秀应用的截图。主要为 iPhone, iPad 和 iOS7 三大类。
2. Mobile Patterns，移动设计模式。包括 iPhone 和 Android。
3. Lovely UI。一个移动 UI 设计元素的集合。
4. Zurb University Pattern TAP Zurb 出品。
5. Inspired UI包括 iPhone, iPad 和 Android。
6. 设计模式 - Web 端：主要为 Web 端的设计模式。
7. Android 设计模式

动效设计模式 | Motion Design Patterns

1. 动效体验
2. Capptivate。最全的动效模式。

iOS 设计 | iOS Design

指南 | Guidelines

1. iOS 人机交互指南官方英文原版，点此查看中文版。
2. 非官方的 iOS 设计指南（英文原版），点此可查看中文版。此版本非常具体全面，值得一读。
3. Apple Watch 人机交互指南（官方英文原版）
4. iOS 设计指南

UI 模板 | UI Kit

系统 | OS

1. iOS8 Illustrator Vector UI Kit
2. iOS8 UI Kit For SKetch

设备 | Devices

1. iPhone6 Plus Template[PSD]
2. iPhone6 PSD Mockup
3. iPhon6 PSD Mockup （带场景图）
4. iPhone6 Plus PSD Vector Mockup （矢量）
5. Apple 官方产品图片下载
6. iPhone6 Template [PSD]
7. 设备模板

Apple Watch

1. Apple Watch UI Kit
2. Apple Watch .sketch File
3. Uber Watch

框线图模板 | Wireframe Mockup

Android Material 设计 | Android Design

1. Material Design 官方英文版，中文版点击此处
2. Material Up
3. Material Design Spec - Color
4. http://material.cmiscm.com/：一些有趣的 Demo

指南 | Guidelines

音效资源 | UI Sounds

1. http://raisedbeaches.com/octave/
   ：免费的界面音效库
2. http://www.freesound.org/
3. https://soundkit.io/
4. http://rcptones.com/dev_tones/

技巧练习 | Skills

设计的技巧

1. http://bezier.method.ac/：一个教你掌握钢笔工具的游戏
2. http://cubic-bezier.com/贝塞尔曲线值

Framerjs 资源

1. http://framerco.de/ 一个关于 Framerjs 的组件，代码的集合地
2. http://prototyp.in/ 在浏览器中利用 js 创建原型
3. http://www.prototypingwithframer.com/ 每周都会有小贴士以及教程，帮助你更好的创建原型
4. http://www.stakelon.com/2015/03/40-examples-of-how-to-design-with-code-using-framer/ 40个如何通过Framer用编程的方式设计的案例

100+ 超全的web开发工具和资源

#100+ 超全的web开发工具和资源

整合 WEB 开发包含的 JavaScript 库，前端框架，Web 应用框架，任务批处理工具 / 包管理器，编程语言 / 开发平台，数据库，icon 图标，本地开发环境搭建，协作工具，Web 开发社区，未能一一整合，欢迎评论提交哦。

英文原文： https://www.keycdn.com/blog/web-development-tools/

转载出处： https://xituqu.com/170.html

译者： 稀土区

作为Web开发者，这是好的时代，也是坏的时代。Web开发技术也在不断变化。虽然很令人兴奋，但是这也意味着Web开发人员需要要积极主动的学习新技术和新的编程语言，并愿意和渴望接受新的挑战，以适应变化。新的挑战可能会包括一些开发上的要求，如利用适应现有的框架来满足业务需求。测试一个网站，能从中知道出了哪些技术上的问题，并且我们针对这些问题进行优化和消除。便于后端的开发进程加快和测试。所以我们列出了完整的web开发所需要的工具和资源，助力开发者提高开发效率！学不止步，让我们努力成为一个优秀的开发者！

Web开发工具和资源整合

在这里说声抱歉，对于开发者开发使用的工具，我们无法一一囊括，这里是选取较为热门的工具和资源作为范例。我们希望能从中找到适合自己的工具助力自己的开发！

注：工具和资源排序不分先后。

JavaScript库

我敢说JavaScript语言是目前web开发最流行的编程语言。JavaScript库又称JavaScript框架，封装了很多预定义的对象和使用函数。是网站更容易兼容各式各样的浏览器。那么您就可以使用以下JavaScript库来帮助你的开发更好进行。

jQuery：快y速，小巧，功能丰富的JavaScript库。

BackBoneJS：为复杂Javascript应用程序提供模型(models)、集合(collections)、视图(views)的结构。

D3.js：_D3_是基于数据的文档操作javascript库,_D3_能够把数据和HTML、SVG、CSS结合起来,创造出可交互的数据图表。

React:：Facebook的Javascript库为构建用户界面而开发。

jQuery UI：jQuery UI 是以 jQuery 为基础的开源 JavaScript 网页用户界面代码库。包含底层用户交互、动画、特效和可更换主题的可视控件。

jQuery Mobile：基于HTML5用于创建移动 web 应用程序的框架。

Underscore.js：JavaScript实用库,提供了类似Prototype.js的一些功能,但是没有继承任何JavaScript内置对象。

Moment.js：一个 JavaScript 日期处理类库，用于解析、检验、操作、以及显示日期。

Lodash：一个 JavaScript 实用工具库,提供一致性,模块化,性能和配件等功能。

前端框架

通俗的前端由HTML，CSS，JavasScript等构成。当然为了适应Web开发日益增长的需求，应运而生许多独立的前端框架，例如Bootstrap。一个优秀的框架可以为前端开发人员在开发过程中增益，减小开发压力。

Bootstrap： Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的,它简洁灵活,使得 Web 开发更加快捷。

Foundation： 迄今为止最好的响应式前端框架，更快、更轻、更多功能、更灵活、更强大！

Semantic UI：Semantic UI 是一款语义化设计的前端开源框架,其功能强大,使用简单,为设计师和开发师提供可复用的完美设计方案。

uikit：_UIKit_使用的变量基于LESS,具有体积小、模块化、可轻松地自定义主题及响应式界面。

Web应用框架

Web应用框架作为一个软件框架，意在帮助和缓解开发者在进行Web应用的开发与维护时遇见的开发问题。例如：AngularJS，您可以在您的项目完全免费使用它，详细文档请您参见 angularcdn.com.

Ruby：Ruby on Rails 是使用 Ruby 语言编写的网页程序开发框架，目的是为开发者提供常用组件，简化网页程序的开发。

React：React 起源于 Facebook 的内部项目，React 的设计**极其独特，属于革命性创新，性能出众，代码逻辑却非常简单。是现在非长热门的框架。

Vue：Vue.js 是用于构建交互式的 Web  界面的库。它提供了 MVVM 数据绑定和一个可组合的组件系统，具有简单、灵活的 API。从技术上讲， Vue.js 集中在 MVVM 模式上的视图模型层，并通过双向数据绑定连接视图和模型。

AngularJS：AngularJS 通过新的属性和表达式扩展了 HTML，可以构建一个单一页面应用程序。AngularJS有着诸多特性，最为核心的是：MVVM、模块化、自动化双向数据绑定、语义化标签、依赖注入等等。

Ember.js：一个用于创建 web 应用的 JavaScript MVC 框架，采用基于字符串的Handlebars模板，支持双向绑定、观察者模式、计算属性（依赖其他属性动态变化）、自动更新模板、路由控制、状态机等。

Express：基于 Node.js 平台的 web 应用开发框架 基于Node.js 平台,快速、开放、极简的 web 开发框架。

Meteor：Meteor 是一个构建在 Node.js 之上的平台，用来开发实时网页程序。Meteor 位于程序数据库和用户界面之间，保持二者之间的数据同步更新。

Django：_Django_是一个开放源代码的Web应用框架,由Python写成。采用了MVC的软件设计模式,即模型M,视图V和控制器C。

ASP.net：ASP.NET是免费，高兼容的WEB应用框架，能够提供标准化WEB应用构建时所需的解决方案。

Laravel：一个免费，开源的PHP Web应用程序框架，可以基于MVC模式来创建Web应用程序。

Zend Framework 2：一款的Web应用框架，基于PHP来创建Web应用和服务端应用。

Phalcon：Phalcon 是开源、全功能栈、使用 C 扩展编写、针对高性能优化的 PHP 5 框架。

Symfony：_Symfony_是一个基于MVC模式的面向对象的PHP5框架。_Symfony_允许在一个web应用中分离事务控制，服务逻辑和表示层。

CakePHP：_CakePHP_是一个运用了诸如ActiveRecord、Association Data Mapping、Front Controller和MVC等著名设计模式的快速开发框架。主要目标是提供一个可以让各种层次的PHP开发人员快速地开发出健壮的Web应用，而 又不失灵活性。

Flask：_Flask_是一个使用 Python 编写的轻量级 Web 应用框架。其 WSGI 工具箱采用 Werkzeug ，模板引擎则使用 Jinja2

CodeIgniter：CodeIgniter 是一个简单快速的PHP MVC框架。它为团队提供了足够的自由支持，允许开发人员更迅速地工作。

任务批处理工具/包管理器

任务批量处理工具可将你的工作流程全自动化.例如你可以创建一个任务，使用JavaScript语言编写的工具来进行自动化的处理。 然后打包，这样会大大提高开发效率。 包管理器它能跟踪所有已安装的软件、自动化进行安装和删除应用程序、以及确保所有软件都保持更新以获得最新的增强功能和错误修复。

Grunt：_Grunt_是基于Node.js的项目构建工具。它可以自动运行你所设定的任务。

Gulp：Gulp.js 是基于 Node.js 构建的一个自动化构建工具,开发者可以使用它在项目开发过程中自动执行常见任务。

npm：NPM（node package manager），通常称为node包管理器。顾名思义，它的主要功能就是管理node包，包括：安装、卸载、更新、查看、搜索、发布等。

Bower：Bower是一个客户端技术的软件包管理器，它可用于搜索、安装和卸载如JavaScript、HTML、CSS之类的网络资源。

编程语言 / 开发平台

所有Web开发都需要编程语言的支持.编程语言（programming language），是用来定义计算机程序的形式语言。它是一种被标准化的交流技巧，用来向计算机发出指令。一种计算机语言让程序员能够准确地定义计算机所需要使用的数据，并精确地定义在不同情况下所应当采取的行动。.当然进行Web开发不仅仅只有一门语言来进开发。

PHP：PHP（外文名:PHP: Hypertext Preprocessor，中文名：“超文本预处理器”）是一种通用开源脚本语言。语法吸收了C语言、Java和Perl的特点，利于学习，使用广泛，主要适用于Web开发领域

NodeJS：Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。Node.js 使用了一个事件驱动、非阻塞式 I/O 的模型,使其轻量又高效。

Javascript：JavaScript一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型。它的解释器被称为JavaScript引擎，为浏览器的一部分，广泛用于客户端的脚本语言

HTML5：标记语言，是HTML和XHTML的最新版本。

Python：Python是一种解释型、面向对象、动态数据类型的高级程序设计语言。

Ruby：Ruby，一种为简单快捷的面向对象编程（面向对象程序设计）而创的脚本语言

Scala：_Scala_是一门多范式的编程语言，一种类似java的编程语言，设计初衷是实现可伸缩的语言、并集成面向对象编程和函数式编程的各种特性。

CSS3：CSS_即层叠_样式表（Cascading StyleSheet）。 在网页制作时采用层叠_样式表_技术，可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。CSS3是CSS的最新版本。

SQL：结构化查询语言(Structured Query Language)简称_SQL，_是一种特殊目的的编程语言，是一种数据库查询和程序设计语言，用于存取数据以及查询、更新和管理关系数据库系统；同时也是数据库脚本文件的扩展名。

Golang：Go是Google开发的一种编译型，可平行化，并具有垃圾回收功能的编程语言。

Rust：Rust是Mozilla开发的注重安全、性能和并发性的编程语言。

Elixir：Elixir 是一种函数式编程语言,建立在Erlang虚拟机之上。它是一种动态语言,灵活的语法与宏支持,利用Erlang的能力来构建并发、分布式、容错应用程序与热代码升级。

数据库

数据库（Database）是按照数据结构来组织、存储和管理数据的仓库。

MySQL：MySQL是一种关联数据库管理系统，关联数据库将数据保存在不同的表中，而不是将所有数据放在一个大仓库内，这样就增加了速度并提高了灵活性。

MariaDB：_MariaDB_数据库管理系统是MySQL的一个分支，主要由开源社区在维护，采用GPL授权许可 _MariaDB_的目的是完全兼容MySQL，包括API和命令行，使之能轻松成为MySQL的代替品。

MongoDB：MongoDB 教程 MongoDB 是一个基于分布式文件存储的数据库。由 C++ 语言编写。旨在为 WEB 应用提供可扩展的高性能数据存储解决方案。

Redis：_Redis_是一个开源的使用ANSI C语言编写、支持网络、可基于内存亦可持久化的日志型、Key-Value数据库，并提供多种语言的API。

PostgreSQL：ostgreSQL支持大部分 SQL标准并且提供了许多其他现代特性：复杂查询、外键、触发器、视图、事务完整性、MVCC。

CSS 预处理器

CSS 预处理器定义了一种新的语言，其基本**是，用一种专门的编程语言，为 CSS 增加了一些编程的特性，将 CSS 作为目标生成文件，然后开发者就只要使用这种语言进行编码工作。

通俗的说，“CSS 预处理器用一种专门的编程语言，进行 Web 页面样式设计，然后再编译成正常的 CSS 文件，以供项目使用。CSS 预处理器为 CSS 增加一些编程的特性，无需考虑浏览器的兼容性问题”，例如你可以在 CSS 中使用变量、简单的逻辑程序、函数等等在编程语言中的一些基本特性，可以让你的 CSS 更加简洁、适应性更强、可读性更佳，更易于代码的维护等诸多好处。例如：Sass，Less，Stylus。

Sass： Sass是一种CSS的开发工具，提供了许多便利的写法，大大节省了设计者的时间，使得CSS的开发，变得简单和可维护。

Less：_Lesscss_是一种动态样式语言,属于CSS预处理语言的一种,它使用类似CSS的语法,为CSS的赋予了动态语言的特性,如变量、继承、运算、函数等,更方便CSS的编写和维护。

Stylus：Stylus 是一个CSS的预处理框架，2010年产生，来自Node.js社区，主要用来给Node项目进行CSS预处理支持，所以Stylus 是一种新型语言，可以创建健壮的、动态的、富有表现力的CSS。

如果你是刚刚开始使用CSS的预处理器，你可能要先使用第三方编译器进行开发，如下所示。

文本编辑器 / 代码编辑器

无论你是做笔记，敲代码，或者Markdown文档编写，一个好的文本编辑器都是必须拥有的！

Atom：Atom 更为先进的文本代码编辑器 - 由 Github 打造的下一代编程开发利器在代码编辑器、文本编辑器领域,有着不少的「神器」级的产品。

Sublime Text：Sublime Text 是一个代码编辑器（Sublime Text 2和3是收费软件，但可以无限期试用），也是HTML和散文先进的文本编辑器。

Notepad++：_Notepad++_是 Windows操作系统下的一套文本编辑器(软件版权许可证: GPL)，有完整的中文化接口及支持多国语言编写的功能。

Visual Studio Code ：微软推出，一个运行于 Mac OS X、Windows和 Linux 之上的，针对于编写现代 Web 和云应用的跨平台源代码编辑器。

TextMate：TextMate是Mac下的著名的文本编辑器软件，与BBedit一起并称苹果机上的emacs和vim。

Coda 2:  OS X下快速，简洁，功能强大的编辑器【需要付费】.

WebStorm：jetbrains公司旗下一款JavaScript 开发工具。被广大**JS开发者誉为“Web前端开发神器”、“最强大的HTML5编辑器”、“最智能的JavaScript IDE”等。

Vim：Vim是一个类似于Vi的著名的功能强大、高度可定制的文本编辑器，在Vi的基础上改进和增加了很多特性。

Brackets：Brackets 是一个免费、开源且跨平台的 HTML/CSS/JavaScript 前端 WEB 集成开发环境 (IDE工具)。

Emacs：著名的集成开发环境和文本编辑器。_Emacs_被公认为是最受专业程序员喜爱的代码编辑器之一。

Markdown 编辑器

Markdown 是一种轻量级的「标记语言」,它的优点很多,目前也被越来越多的写作爱好者,撰稿者广泛使用。Markdown 十分轻量,学习成本也不高。

MWeb：专业的 Markdown 写作、记笔记、静态博客生成软件 【付费】

Markeditor：MarkEditor 是最新的一款 Markdown 编辑器，除了基本功能外，还包含了诸如表格编辑、图表、高亮、公式等等丰富的功能！【付费】

StackEdit：一个开放源码免费使用的 MarkDown 编辑器, 基于 PageDown,使用了 Stack Overflow 和其他 Stack Exchange 网站的 MarkDown 库

Dillinger：Dillinger 是一款在线的 Markdown 编辑器,支持更换主题,字数统计,云服务保存,导出 HTML、PDF 等功能。

Mou: Mac OS X下的免费Markdown编辑器【作者貌似已经跑路了】

Texts：Windows和Mac OS X下纯文本编辑器。

表示有些付费的Markdown编辑器宝宝买不起。

icon图标

几乎每一个Web开发者，尤其是前端开发人员都会需要icon图标来增色项目。

Font Awesome：Font Awesome为您提供可缩放的矢量图标,您可以使用CSS所提供的所有特性对它们进行更改,包括:大小、颜色、阴影或者其它任何支持的效果。

IconMonster：免费，高质量, 庞大且资源不断增长的简洁的icon图标库。

IconFinder：_Iconfinder_提供美丽的图标,服务数以百万计的设计师,开发商和其他有创意的专业人员。

Fontello：一个目测有200+个图标（数量还在增加）的 Web-font 图标市场，对于广大设计师、前端开发者来说是很棒的资源。

Git 代理 / 服务

Git是一款免费、开源的分布式版本控制系统，用于敏捷高效地处理任何或小或大的项目。Git是一个开源的分布式版本控制系统，可以有效、高速的处理从很小到非常大的项目版本管。Git 是 Linus Torvalds 为了帮助管理 Linux 内核开发而开发的一个开放源码的版本控制软件。

SourceTree：SourceTree 是 Windows 和Mac OS X 下免费的 Git 和 Hg 客户端。支持创建、克隆、提交、push、pull 和合并等操作。

GitKraken (Beta)：一款自由、直观、快捷、美观的跨平台Git客户端。

Tower 2：一款美丽，高效，强大的Git管理，让Git版本控制变得容易。

GitHub Client：有助于无缝连接GitHub和GitHub的企业的项目。

Gogs：Gogs (Go Git Service) 是一款极易搭建的自助 Git 服务。 开发目的 Gogs 的目标是打造一个最简单、最快速和最轻松的方式搭建自助 Git 服务。

GitLab:  GitLab是利用 Ruby on Rails 一个开源的版本管理系统,实现一个自托管的Git项目仓库,可通过Web界面进行访问公开的或者私人项目。

Coding：Coding 的代码托管功能除了基本的 Git 仓库以外，还有保护分支，分屏对比， Code Review 等高级功能。并且整合了 Pages 服务，质量管理，演示平台等开发工具，提升研发效率。

本地开发环境搭建

根据您运行的是什么操作系统和计算机配置，有时候进行测试的时候就有可能需要搭建一个快速的本地开发环境。自己搭建很是蛮烦，不用担心，有很多将Apache，Nginx，MySQL和phpMyAdmin进行打包一体化的软件。这些软件很是方便我们来进行本地测试。

XAMPP：XAMPP（Apache+MySQL+PHP+PERL）是一个功能强大的建站集成软件包。

MAMP PRO：MAMP Pro for mac是Mac OS平台搭建本地服务器环境的组合软件套装,包含 Macintosh、Apache、MySQL和PHP 四大开发环境。

WampServer：Wamp就是Windows Apache Mysql PHP集成安装环境，即在window下的apache、php和mysql的服务器软件。

Vagrant：_Vagrant_是一个基于Ruby的工具，用于创建和部署虚拟化开发环境。它 使用Oracle的开源VirtualBox虚拟化系统，使用 Chef创建自动化虚拟环境。

Laragon：Laragon工具就是Laravel的一键安装工具吧，还集成了一整套wamp工具，除去Laravel安装外，它也是一款不错的wamp工具，干净简单，便捷迅速。Diff Checkers
Wnmp：WNMP是Windows下便捷，安全的Nginx+MariaDB+PHP开发环境环境集成套件包。

文本对比检查

Diff checkers 可以帮助您比较文件之间的差异，然后合并更改。帮助我们更直观的看见文本之间的差异。

Diffchecker：Diffchecker 是一款非常好用的在线文本对比工具,能够高亮显示有差异的行和字符。Diffchecker 提供了文件上传对比功能,还可以选择对比的存储时间。

Beyond Compare：Beyond Compare是一套由Scooter Software推出的软件，主要用途是对比两个文件夹或者文件，并将差异以颜色标示。

当然有很多免费的文本编辑器，包括我们上面提到的也有插件和扩展，可以协助开发者方便的进行文件比较。

代码共享 / 代码测试

前端开发者在公司内或者团体间需要进行协作，共享代码，那么一下工具很值得开发者一试。

JS Bin：JS _Bin_能够让你编辑和测试JavaScript和HTML代码。你还可以将编辑后的代码保存到本地,或将URL地址发给其他人,让其协助调试代码。

JSfiddle：jsFiddle是一个在线的shell编辑器,通过流行的JS框架创建自定义的环境,以简化JS代码。可以用于测试示例代码。

codeshare：与其他开发者实时共享代码。

Dabblet：Dabblet是一个开源互动测试工具,用于测试CSS和HTML。_Dabblet_支持实时更新、匿名备份、嵌入网站、与他人共享或者存储到GitHub。

协作工具

每一个很棒的开发团队需要一种方式来保持联系，协作，来帮助提高生产力。

Slack：Slack 是聊天群组 + 大规模工具集成 + 文件整合 + 统一搜索。

Trello：Trello的目标是提供简洁清晰的团队协作工具。不过弥缝在这里将介绍如果将_Trello_用来建立自己的时间管理系统。

Glip：Glip:在线团队办公协作平台是一个类似于Slack网站的网络办公集合体,内置了邮箱、网盘、即时通讯应用、协作服务等,把所有和网络办公有关的服务和工具都整合在了一起。

Asana：Asana是一款团队任务管理软件 方便人们去制定和跟踪团队的项目任务的完成情况

Jira：JIRA是Atlassian公司出品的项目与事务跟踪工具，被广泛应用于缺陷跟踪、客户服务、需求收集、流程审批、任务跟踪、项目跟踪和敏捷管理等工作领域。

灵感创意

当我们进行开发时，偶尔迸发的灵感会使我们的项目或者产品增色不少。当然不仅仅依靠自我的灵感，我们也需要从别人的作品中得到灵感来保证我们的Web设计界面或者产品不落后这个时代。

CodePen：全球web前端开发人员的圣地！可以展示个人的创意和建立一个测试实例来解决bug。 来寻找你的项目设计方式和灵感吧。

Dribble：Dribbble是一个面向创作家、艺术工作者、设计师等创意类作品的人群，提供作品在线服务，供网友在线查看已经完成的作品或者正在创作的作品的交流网站。

网站测速工具

网站的速度是用户体验关键因素。网站速度快与慢决定是否能更高的搜索引擎排名，更高的转换率，更低的跳出率，以及更好的整体用户体验和。值得高兴的是很多免费软件可以用于测试网站速度，帮助我们找出加载缓慢的问题，方便我们去解决。

Google PageSpeed Insights：PageSpeed Insights是一款可以分析网页速度瓶颈,让网页设计人员开发出速度更快的网站的_谷歌_浏览器插件。

Google Chrome DevTools：Chrome DevTools 是公认的优秀的前端调试工具，功能强大，使用起来有一定的学习门槛。

WebPageTest：_WebPagetest_是一款Web应用程序,它将一个URL以及一系列配置参数作为输入,并对那个URL运行性能测试。

Pingdom：pingdom全面的网站监测服务网站,可测速和ping跟踪路由,可以免费监测1个站点,最短1分钟监测一次。

GTmetrix：主要优点在于提供了丰富的详细的测量结果，并建议如何来优化网页中每个元素的，最重要的是会根据网站的具体情况，直接告诉你导致网站加载速度变慢的根源在哪里

Web开发社区

当开发者在开发的过程中有遇到问题时，除了询问他人以外，还可以使用搜索引擎搜索。社区的重要性就显而易见了，大部分开发者会在开发社区分享他们经验，如何避过不必要踩的坑。

国内：
 
谷歌开发者社区(GDG)：开放 · 分享 · 创新

segmentfault：是**领先的_开发_者技术_社区_。 为编程爱好者提供一个纯粹、高质的技术交流的平台, 与_开发_者一起学习、交流与成长。【老实话我觉得这名字不好记】

全栈社区：**最大的全栈_开发者社区_,致力于打造一个问题解答,技术文章分享,全栈人员创业的服务平台,让开发更容易,让创业更简单.

国外：

Stack Overflow：Stack Overflow是一个与程序相关的IT技术问答网站。用户可以在网站免费提交问题，浏览问题，索引相关内容，在创建主页的时候使用简单的HTML。

Front-end Front：在Front-end Front，前端开发者可以提出问题，分享有趣的链接，并展示他们的项目作品。

Hashnode：Hashnode是开发者讨论技术问题，分享解决方案，与世界各地的开发者共享资源的聚集地。

Refind：有着开发者, 黑客, 设计师收集和分享最好的资源的社区。

Google+ Web Developers Group：Web 开发者,Web设计师和Web开发.

Google+ Web Developers Group：Java, PHP, Ruby, JavaScript and Python 资源。

Facebook WordPress Front-end Developers Group：WordPress 前端开发者的分享社区，可以提问题，分享开发者的项目作品，还有讨论WP未来发展趋势。

LinkedIn Web Design and Development Professionals Group：与专业网页设计师，网页开发者共享Web开发资源

LinkedIn Web Site Development Group: 网站设计和开发。

LinkedIn PHP Developer Group: PHP, Mysql, Drupal, Joomla, Zend, Cake, MVC.

LinkedIn WordPress Developers Group: WordPress 开发. 使用WP来创建CMS和CMF.

Webdeveloper.com：帮助Web开发者和设计师学习使用HTML，java和javascript开发网站。

Sitepoint Forums: Web开发者论坛。

/r/perfmatters: 讨论关于 web 性能

/r/webdev: 关于Web开发和开发者的新闻

Web开发新闻聚合

阅读开发和设计的技术干货，及时的知道技术圈内更新了什么，保持信息流新鲜，有助于我们更好的开发！

国内：
掘金：掘金是**质量最高的技术分享社区，邀请稀土用户作为Co-Editor 来分享优质的技术干货，从前端到后端开发，从设计到产品，让每一个_掘金_用户都能挖掘到有价值的干货。

开发者头条：一个以程序员为中心，基于学习和分享的开发者社区。你可以阅读头条新闻、分享技术文章、发布开源项目，订阅技术极客们创建的学习主题和关注编程牛人。

推酷：以技术为驱动，以聚合挖掘为核心，打造个性推荐和订阅，给你一站式的阅读。 更汇聚优质公开课和线下活动，让信息知识获取更便捷。

国外：
wdrl.info：精心挑选的Web开发相关资源，每星期进行整合报道。

webopsweekly.com： 每周进行报道关于网络运营，应用部署，网站性能和工具分享类的文章。

web tools weekly：专注于前端开发和网页设计工具分享。每一个问题都有一个简短的提示或教程，另外每周都会分享的各种应用程序、脚本、插件和其他有用的资源。

freshbrewed.co：每周为前端开发者和设计师提供开发和设计类的阅读摘要。

smashingmagazine.com： Smashing Magazine是一款专门为个人前端开发者和设计师提供的在线报纸，每周二都会定时的更新有用的资源。

front-end dev weekly: 每周为前端开发者提供新闻, 包含工具资源，还有灵感。

friday front-end：邮件订阅，每日为前端开发者发关于开发资源的邮件。

dev tips: 收集开发者的问题和建议, 用gif呈现，会每周发邮件通知。

当然, 你也可以关注稀土区，来找到你需要的文章，顺便解决你的问题。

备注
如你所见，有数以百计的网络开发工具和资源，可以帮助简化你的开发工作流程，帮助开发更高效。我们无法一一列出所有工具或资源，如果有重要的工具或资源有遗漏，那就要麻烦小伙伴们在下面的评论里进行补充，谢谢！

版权归原作者所有！

程序员必知的七个图形工具

程序员必知的七个图形工具

get new source

PHP资源整理

• [PDF] PHP 宝刀未老（@InfoQ）
  PHP 性能优化教程之深入篇（Dustin Whittle）
• 高效使用 PHP Streams 函数（Vito Tardia）
• 免费在线交互式 PHP 学习网站
• Yar - 一个支持并行、轻量级的 PHP RPC 框架（@Laruence）
• [视频] PHP 3小时光速入门（@燕十八老师）
• PHP 真正多线程的使用（@张宴）
• 2014年最受关注的 PHP 框架（Bruno Skvorc）
• 写给系统管理员的25个 PHP 安全实践（Kroderia）
• Pux - 一个高性能 PHP 路由
• PHP 5.6 新功能（Bruno Skvorc）
• Curl 的毫秒超时的一个”Bug”（@Laruence）
• HHVM 是如何提升 PHP 性能的？（@吴多益）
• [译] PHP 之道（@wulijun01234）
• PHP 的改进和新标准 (Josh Lockhart)
• Facebook 发布新编程语言 Hack
• PHP 最佳实践 (TIM)
• PHP 语法分析器：RE2C && BISON 总结（吴帅）
• PHP 学习资源列表 (Jamie York ziadoz)
• PHP 代码重构实战 (Patkos Csaba)
• 系列访谈：谁说 PHP 写不出伟大的应用？ (Matthew Setter)
• [PDF] PHP 语言规范
• yac-0.9.1 发布
• PHPCon China 2014 大会幻灯片 (@thinkinlamp)
• 深入 PHP 内核（一）——弱类型变量原理探究（王帅）
• 深入理解 Yii 2.0 (Linuor)
• Web 常见问题排查（Nginx & PHP）
• [译] 8 个很有用的 PHP 安全函数 (@dwido)
• Poor Man PHP Profiler (@火丁笔记)
• [译] PHP 未来的一些可能 (Frank Karlitschek)
• Yii 框架原理简介 (@夏永锋_SJTU)
• PHP 引擎调研 (Weibing Wang)
• [译] GitHub 上的 PHP 资源大全 (@PHP100官方)
• PHP 优化杂烩 (@火丁笔记)
• phptrace - 一个 PHP 程序跟踪和分析工具
• Laravel 5.0 中文文档
• PHPHub - 一个用 Laravel 编写的开源 PHP & Laravel 开发者社区 (@summer_charlie)
• PHP 扩展开发进阶 (@黑夜路人V)
• Laravel: From Apprentice To Artisan（中文版） (zgldh)
• 浅谈 PHP 自动化代码审计技术 (@隐形人很忙)
• 7 阶段系统全面掌握 PHP 开发
• Lumen 中文文档 (@summer_charlie)
• PHP The Right Way 2015 中文版
• EvaOAuth 1.0：统一接口的 OAuth 登录 PHP 类库 (@Allo)
• [英] PHP 月报（5 月） (Mikhail Vink)
• PHP 过往、现在及变革（一） (thinkpc)
• PHP 从小白到大牛必须掌握的 7 个知识模块
• Swoole：PHP 的异步、并行、分布式扩展 (@韩天峰-Rango)
• [译] 在 PHP 中使用协程实现多任务调度 (@Laruence)
• PHP 过往、现在及变革（二）：前后端分离和消息中间件 (thinkpc)
• PHPTrace 0.3 发布：做个靠谱的线上调试工具 (努力de猴子)
• [译] PHP 7 Alpha 1 发布，新版 Zend Engine (@开源**)
• 很好用的 PHP 在线调试工具 ydb (micweaver)
• [英] 打造 PHP 开发者的 Sublime Text 3 开发环境 (Matt Stauffer)
• 7 阶段系统全面掌握 PHP 开发
• 简单好用的 PHP 汉字转拼音类 (@jifei_1988)
• [译] 25+ 必备 WordPress 插件列表 (@就爱PHP)
• TSF：腾讯推出的 PHP 协程方案 (@韩天峰-Rango)
• opencc4php：OpenCC 的 PHP 扩展，能优雅地完成简繁体转换 (@刘相轩)
• 基于词库的中文转拼音优质解决方案（PHP） (overtrue)
• Stark - 一个 PHP 实现的轻量级多进程处理 Daemon (@陈杰要骑车)
• [译] PHP 7.0 升级备注 (Linux**)
• Windows 上使用 Vagrant 打造 Laravel Homestead 可协同跨平台开发环境 (王奥 ＯＸ)
• 一个用 Laravel 5 开发的博客系统 (yccphp)
• PHP 开发者的 Docker 之旅
• [译] PHP 安全编程建议 (Linux**)
• Yii2 系列教程（五）：简单的用户权限管理 (JellyBool)
• PHP 模板引擎的原理与实践 (@我才是二亮)
• HyperDown - 一个结构清晰、易维护、现代的 PHP Markdown 解析器 (@SegmentFault)
• PHP 路由技术的原理与实践 (我才是二亮)
• [译] PHP 5.6.x 版本迁移至 PHP 7.0.x 版本 (@吕毅)
• Packagist / Composer **全量镜像
• 关于 C++、PHP 和 Swoole (@韩天峰-Rango)
• xunsearch：简单易用的专业全文检索技术方案 (jifei_1988)
• 线上 PHP 问题排查思路与实践 (@淘宝信海龙)
• 关于 PHP 程序员解决问题的能力（2014） (@韩天峰-Rango)
• PHP 7 革新与性能优化 (@Hansion徐汉彬)
• 让你的 PHP 7 更快之 Hugepage (@Laruence)
• 一些常用的 PHP 类库、资源和技巧 (Mr憬忟)
• 大量 Laravel 学习资源 (chiraggude)
• Blink：PHP 框架的全新打开方式
• PHP 7 的几个新特性
• PHP 实现敏感词过滤系统
• 在 Laravel 5.1 中使用 Pjax
• [译] 如何编写一个独立的 PHP 扩展
• PHP 编程中的锁
• PHP 新特性介绍
• [译] Box 迁移到 HHVM 实践
• PHP 的普罗米修斯："Swoole" 项目
• PHP 7 正式发布，鸟哥给的一些高性能小提示
• 《PHP 扩展开发及内核应用》
• 网页解谜开发框架（PHP）
• PHPHub for Server：使用 Laravel 5.1 开发的一套开源的 PHPHub 社区的 API 接口
• PHP 7 新特性
• [译] 变量在 PHP 7 内部的实现（一）
• 理解 Laravel 中的 pipeline
• PHP-FIG 制定的 PHP 编码规范
• 高并发简单解决方案：Redis 缓存队列 + MySQL 批量入库 + PHP 离线整合
• php-fpm 的 max_chindren 的一些误区
• PHP 规范化代码风格指南
• Phan - 一个 PHP 7+ 代码静态分析工具
• 深入 PHP 面向对象、模式与实践
• 从零构建 PHP 商用 MVC 框架
• PHP 版的查看微信被删列表
• PHP 扩展迁移为兼容 PHP 7 记录
• [译] 理解数组在 PHP 内部的实现（给 PHP 开发者的 PHP 源码：第四部分）
• 深入理解 FastCGI 协议以及在 PHP 中的实现
• Lumen 5.2 中文文档
• 在 Docker 中运行 PHP 项目的探索之旅
• DockerPHP：基于 Docker 容器化 PHP 开发环境解决方案
• PHP 扩展开发入门
• [译] Badoo 告诉你切换到 PHP 7 节省了 100 万美元
• PHP 的 json_encode 分析
• PHP 并发 IO 编程之路
• 深入理解 PHP：Nginx 与 FPM 的工作机制
• [译] PHP 中的设计模式
• [译] 深入理解 PHP 对象注入
• 手把手编写自己的 PHP MVC 框架实例教程
• PHP 资源列表
• slim-born：Slim 3 骨架
• 如何优雅地使用 PhpStorm
• Laravel Valet：Mac 下极简的 PHP 开发环境
• PHP-DS: Data structures for PHP 7
• 神奇的服务容器
• 微博升级 PHP 7 经验分享
• PHP 源码注解
• PHP 开发者实践
• 设计模式：PHP 和 Go 语言实现
• 2016 版 Laravel 系列入门教程（一）

一份详细的前端总结