前端资源汇总

<div class="iteye-blog-content-contain" style="font-size: 14px;">
<p>前端收藏夹：<br>http://collect.w3ctrain.com/<br>https://github.com/JacksonTian/fks<br>http://html5ify.com/fks/fks_chart/<br>https://github.com/hjzheng<br><br></p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<div id="article_content" class="article_content csdn-tracking-statistics tracking-click" style="overflow: hidden;">
<div class="markdown_views">
<h2 id="前端开发资源汇总">
<a name="t0"></a>前端开发资源汇总</h2>
<p>原址：<a href="http://www.jeffjade.com/2016/03/30/104-front-end-tutorial/" target="_blank">http://www.jeffjade.com/2016/03/30/104-front-end-tutorial/</a></p>
<h3 id="综合类">
<a name="t1"></a>综合类</h3>
<table>
<thead><tr>
<th>综合类</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>前端知识体系</td>
<td><a href="http://www.cnblogs.com/sb19871023/p/3894452.html" target="_blank">http://www.cnblogs.com/sb19871023/p/3894452.html</a></td>
</tr>
<tr>
<td>前端知识结构</td>
<td><a href="https://github.com/JacksonTian/fks" target="_blank">https://github.com/JacksonTian/fks</a></td>
</tr>
<tr>
<td>Web前端开发大系概览</td>
<td><a href="https://github.com/unruledboy/WebFrontEndStack" target="_blank">https://github.com/unruledboy/WebFrontEndStack</a></td>
</tr>
<tr>
<td>Web前端开发大系概览-中文版</td>
<td><a href="http://www.cnblogs.com/unruledboy/p/WebFrontEndStack.html" target="_blank">http://www.cnblogs.com/unruledboy/p/WebFrontEndStack.html</a></td>
</tr>
<tr>
<td>Web Front-end Stack v2.2</td>
<td><a href="https://raw.githubusercontent.com/unruledboy/WebFrontEndStack/master/Web%20Front%20End%20Stack.png" target="_blank">https://raw.githubusercontent.com/unruledboy/WebFrontEndStack/master/Web%20Front%20End%20Stack.png</a></td>
</tr>
<tr>
<td>免费的编程中文书籍索引</td>
<td><a href="https://github.com/justjavac/free-programming-books-zh_CN" target="_blank">https://github.com/justjavac/free-programming-books-zh_CN</a></td>
</tr>
<tr>
<td>前端书籍</td>
<td><a href="https://github.com/dypsilon/frontend-dev-bookmarks" target="_blank">https://github.com/dypsilon/frontend-dev-bookmarks</a></td>
</tr>
<tr>
<td>前端免费书籍大全</td>
<td><a href="https://github.com/vhf/free-programming-books" target="_blank">https://github.com/vhf/free-programming-books</a></td>
</tr>
<tr>
<td>前端知识体系</td>
<td><a href="http://www.cnblogs.com/sb19871023/p/3894452.html" target="_blank">http://www.cnblogs.com/sb19871023/p/3894452.html</a></td>
</tr>
<tr>
<td>免费的编程中文书籍索引</td>
<td><a href="https://github.com/justjavac/free-programming-books-zh_CN" target="_blank">https://github.com/justjavac/free-programming-books-zh_CN</a></td>
</tr>
<tr>
<td>智能社 - 精通JavaScript开发</td>
<td><a href="http://study.163.com/course/introduction/224014.htm" target="_blank">http://study.163.com/course/introduction/224014.htm</a></td>
</tr>
<tr>
<td>重新介绍 JavaScript（JS 教程）</td>
<td><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/A_re-introduction_to_JavaScript" target="_blank">https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/A_re-introduction_to_JavaScript</a></td>
</tr>
<tr>
<td>麻省理工学院公开课：计算机科学及编程导论</td>
<td><a href="http://v.163.com/special/opencourse/bianchengdaolun.html" target="_blank">http://v.163.com/special/opencourse/bianchengdaolun.html</a></td>
</tr>
<tr>
<td>JavaScript中的this陷阱的最全收集—没有之一</td>
<td><a href="http://segmentfault.com/a/1190000002640298" target="_blank">http://segmentfault.com/a/1190000002640298</a></td>
</tr>
<tr>
<td>JS函数式编程指南</td>
<td><a href="https://llh911001.gitbooks.io/mostly-adequate-guide-chinese/content/ch1.html" target="_blank">https://llh911001.gitbooks.io/mostly-adequate-guide-chinese/content/ch1.html</a></td>
</tr>
<tr>
<td>JavaScript Promise迷你书（中文版）</td>
<td><a href="http://liubin.github.io/promises-book" target="_blank">http://liubin.github.io/promises-book</a></td>
</tr>
<tr>
<td>腾讯移动Web前端知识库</td>
<td><a href="https://github.com/AlloyTeam/Mars" target="_blank">https://github.com/AlloyTeam/Mars</a></td>
</tr>
<tr>
<td>Front-End-Develop-Guide 前端开发指南</td>
<td><a href="https://github.com/Front-End-Developers-Hunan/Front-End-Develop-Guide" target="_blank">https://github.com/Front-End-Developers-Hunan/Front-End-Develop-Guide</a></td>
</tr>
<tr>
<td>前端开发笔记本</td>
<td><a href="https://li-xinyang.gitbooks.io/frontend-notebook/content" target="_blank">https://li-xinyang.gitbooks.io/frontend-notebook/content</a></td>
</tr>
<tr>
<td>大前端工具集 - 聂微东</td>
<td><a href="https://github.com/nieweidong/fetool" target="_blank">https://github.com/nieweidong/fetool</a></td>
</tr>
<tr>
<td>前端开发者手册</td>
<td><a href="https://dwqs.gitbooks.io/frontenddevhandbook/content" target="_blank">https://dwqs.gitbooks.io/frontenddevhandbook/content</a></td>
</tr>
</tbody>
</table>
<h3 id="入门类">
<a name="t2"></a>入门类</h3>
<table>
<thead><tr>
<th>入门类</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>前端入门教程</td>
<td><a href="http://www.cnblogs.com/jikey/p/3613082.html" target="_blank">http://www.cnblogs.com/jikey/p/3613082.html</a></td>
</tr>
<tr>
<td>瘳雪峰的Javascript教程</td>
<td><a href="http://www.liaoxuefeng.com/wiki/001434446689867b27157e896e74d51a89c25cc8b43bdb3000" target="_blank">http://www.liaoxuefeng.com/wiki/001434446689867b27157e896e74d51a89c25cc8b43bdb3000</a></td>
</tr>
<tr>
<td>jQuery基础教程</td>
<td><a href="http://www.imooc.com/view/11" target="_blank">http://www.imooc.com/view/11</a></td>
</tr>
<tr>
<td>前端工程师必备的PS技能——切图篇</td>
<td><a href="http://www.imooc.com/view/506" target="_blank">http://www.imooc.com/view/506</a></td>
</tr>
<tr>
<td>结合个人经历总结的前端入门方法</td>
<td><a href="https://github.com/qiu-deqing/FE-learning" target="_blank">https://github.com/qiu-deqing/FE-learning</a></td>
</tr>
</tbody>
</table>
<h3 id="工具类">
<a name="t3"></a>工具类</h3>
<table>
<thead><tr>
<th>工具类</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>前端人的俱乐部</td>
<td>
<a href="http://f2er.club/" target="_blank">http://f2er.club/</a> 真可以解放你的收藏夹</td>
</tr>
<tr>
<td>如何优雅地使用Sublime Text</td>
<td><a href="http://www.jeffjade.com/2015/12/15/2015-04-17-toss-sublime-text/" target="_blank">http://www.jeffjade.com/2015/12/15/2015-04-17-toss-sublime-text/#</a></td>
</tr>
<tr>
<td>新编码神器Atom使用纪要</td>
<td><a href="http://www.jeffjade.com/2016/03/03/2016-03-02-how-to-use-atom/" target="_blank">http://www.jeffjade.com/2016/03/03/2016-03-02-how-to-use-atom/</a></td>
</tr>
<tr>
<td>css sprite 雪碧图制作</td>
<td><a href="http://www.imooc.com/learn/93" target="_blank">http://www.imooc.com/learn/93</a></td>
</tr>
<tr>
<td>版本控制入门 – 搬进 Github</td>
<td><a href="http://www.imooc.com/learn/390" target="_blank">http://www.imooc.com/learn/390</a></td>
</tr>
<tr>
<td>Grunt-beginner前端自动化工具</td>
<td><a href="http://www.imooc.com/learn/30" target="_blank">http://www.imooc.com/learn/30</a></td>
</tr>
<tr>
<td>IntelliJ IDEA 简体中文专题教程</td>
<td><a href="https://github.com/judasn/IntelliJ-IDEA-Tutorial" target="_blank">https://github.com/judasn/IntelliJ-IDEA-Tutorial</a></td>
</tr>
<tr>
<td>Webstorm,InterllIdea,Phpstorm</td>
<td><a href="http://t.cn/8kZZ1Uy" target="_blank">http://t.cn/8kZZ1Uy</a></td>
</tr>
<tr>
<td>SublimeText</td>
<td><a href="https://github.com/jikeytang/sublime-text" target="_blank">https://github.com/jikeytang/sublime-text</a></td>
</tr>
<tr>
<td>Atom</td>
<td><a href="https://atom.io" target="_blank">https://atom.io</a></td>
</tr>
<tr>
<td>visual studio code</td>
<td><a href="https://code.visualstudio.com" target="_blank">https://code.visualstudio.com</a></td>
</tr>
</tbody>
</table>
<h3 id="综合效果搜索平台">
<a name="t4"></a>综合效果搜索平台</h3>
<table>
<thead><tr>
<th>综合效果搜索平台</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>JavaScript 资源大全中文版</td>
<td><a href="https://github.com/jobbole/awesome-javascript-cn" target="_blank">https://github.com/jobbole/awesome-javascript-cn</a></td>
</tr>
<tr>
<td>100+ 超全的web开发工具和资源</td>
<td><a href="https://xituqu.com/170.html" target="_blank">https://xituqu.com/170.html</a></td>
</tr>
<tr>
<td>zoommyapp.com</td>
<td>
<a href="http://zoommyapp.com/" target="_blank">http://zoommyapp.com/</a> 高质量图库</td>
</tr>
<tr>
<td>unsplash.com</td>
<td>
<a href="https://unsplash.com/" target="_blank">https://unsplash.com/</a> 高质量图库</td>
</tr>
<tr>
<td>www.pinterest.com</td>
<td>
<a href="https://www.pinterest.com/" target="_blank">https://www.pinterest.com/</a> 图库</td>
</tr>
<tr>
<td>New Old Stock</td>
<td>
<a href="http://nos.twnsnd.co" target="_blank">http://nos.twnsnd.co</a> 复古风图库</td>
</tr>
<tr>
<td>效果网</td>
<td><a href="http://www.jq22.com" target="_blank">http://www.jq22.com</a></td>
</tr>
<tr>
<td>花瓣网</td>
<td><a href="http://huaban.com/" target="_blank">http://huaban.com/</a></td>
</tr>
<tr>
<td>优美图</td>
<td><a href="http://www.topit.me/" target="_blank">http://www.topit.me/</a></td>
</tr>
<tr>
<td>codepen</td>
<td><a href="http://codepen.io/" target="_blank">http://codepen.io/</a></td>
</tr>
<tr>
<td>摄图网</td>
<td><a href="http://699pic.com/" target="_blank">http://699pic.com/</a></td>
</tr>
<tr>
<td>常用的JavaScript代码片段</td>
<td><a href="http://microjs.com" target="_blank">http://microjs.com</a></td>
</tr>
</tbody>
</table>
<h3 id="团队blog周报类">
<a name="t5"></a>团队Blog周报类</h3>
<table>
<thead><tr>
<th>团队Blog周报类</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>奇舞周刊</td>
<td><a href="http://old.75team.com/weekly/" target="_blank">http://old.75team.com/weekly/</a></td>
</tr>
<tr>
<td>码农周刊</td>
<td><a href="http://weekly.manong.io" target="_blank">http://weekly.manong.io</a></td>
</tr>
<tr>
<td>WEB前端开发</td>
<td><a href="http://www.css88.com" target="_blank">http://www.css88.com</a></td>
</tr>
<tr>
<td>A JS tip per day!</td>
<td><a href="http://www.jstips.co" target="_blank">http://www.jstips.co</a></td>
</tr>
<tr>
<td>腾讯全端 AlloyTeam</td>
<td><a href="http://www.alloyteam.com/webdevelop/" target="_blank">http://www.alloyteam.com/webdevelop/</a></td>
</tr>
<tr>
<td>平安科技移动开发二队技术周报</td>
<td><a href="https://github.com/PaicHyperionDev/MobileDevWeekly" target="_blank">https://github.com/PaicHyperionDev/MobileDevWeekly</a></td>
</tr>
</tbody>
</table>
<h3 id="开发中心">
<a name="t6"></a>开发中心</h3>
<table>
<thead><tr>
<th>开发中心</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>mozilla js参考</td>
<td><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript" target="_blank">https://developer.mozilla.org/zh-CN/docs/Web/JavaScript</a></td>
</tr>
<tr>
<td>chrome开发中心（chrome的内核已转向blink）</td>
<td><a href="https://developer.chrome.com/extensions/api_index.html" target="_blank">https://developer.chrome.com/extensions/api_index.html</a></td>
</tr>
<tr>
<td>safari开发中心</td>
<td><a href="https://developer.apple.com/library/safari/navigation" target="_blank">https://developer.apple.com/library/safari/navigation</a></td>
</tr>
<tr>
<td>microsoft js参考</td>
<td><a href="https://msdn.microsoft.com/zh-cn/library/d1et7k7c(v=vs.94.aspx" target="_blank">https://msdn.microsoft.com/zh-cn/library/d1et7k7c(v=vs.94.aspx</a></td>
</tr>
<tr>
<td>js秘花园</td>
<td><a href="http://sanshi.me/articles/JavaScript-Garden-CN/html/index.html" target="_blank">http://sanshi.me/articles/JavaScript-Garden-CN/html/index.html</a></td>
</tr>
<tr>
<td>js密花园</td>
<td><a href="http://bonsaiden.github.io/JavaScript-Garden/zh" target="_blank">http://bonsaiden.github.io/JavaScript-Garden/zh</a></td>
</tr>
<tr>
<td>w3help</td>
<td>
<a href="http://www.w3help.org" target="_blank">http://www.w3help.org</a> 综合Bug集合网站</td>
</tr>
</tbody>
</table>
<h3 id="nodejs">
<a name="t7"></a>Nodejs</h3>
<table>
<thead><tr>
<th>Nodejs</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>nodejs 篇幅比较巨大</td>
<td><a href="http://liuqing.pw" target="_blank">http://liuqing.pw</a></td>
</tr>
<tr>
<td>Node.js 包教不包会</td>
<td><a href="https://github.com/alsotang/node-lessons" target="_blank">https://github.com/alsotang/node-lessons</a></td>
</tr>
<tr>
<td>篇幅比较少</td>
<td><a href="http://www.rainweb.cn/article/category/Nodejs" target="_blank">http://www.rainweb.cn/article/category/Nodejs</a></td>
</tr>
<tr>
<td>node express 入门教程</td>
<td><a href="http://www.w3cfuns.com/article-5598538-1-1.html" target="_blank">http://www.w3cfuns.com/article-5598538-1-1.html</a></td>
</tr>
<tr>
<td>nodejs定时任务</td>
<td><a href="http://my.oschina.net/u/568264/blog/193773" target="_blank">http://my.oschina.net/u/568264/blog/193773</a></td>
</tr>
<tr>
<td>一个nodejs博客</td>
<td><a href="http://60sky.com" target="_blank">http://60sky.com</a></td>
</tr>
<tr>
<td>【NodeJS 学习笔记04】新闻发布系统</td>
<td><a href="http://www.cnblogs.com/yexiaochai/p/3536547.html" target="_blank">http://www.cnblogs.com/yexiaochai/p/3536547.html</a></td>
</tr>
<tr>
<td>过年7天乐，学nodejs 也快乐</td>
<td><a href="http://www.cnblogs.com/qqloving/p/3541099.html" target="_blank">http://www.cnblogs.com/qqloving/p/3541099.html</a></td>
</tr>
<tr>
<td>七天学会NodeJS</td>
<td><a href="https://github.com/nqdeng/7-days-nodejs" target="_blank">https://github.com/nqdeng/7-days-nodejs</a></td>
</tr>
<tr>
<td>Nodejs学习笔记（二）—- 事件模块</td>
<td><a href="http://www.cnblogs.com/zhongweiv/p/nodejs_events.html" target="_blank">http://www.cnblogs.com/zhongweiv/p/nodejs_events.html</a></td>
</tr>
<tr>
<td>nodejs入门</td>
<td><a href="http://www.cnblogs.com/liusuqi/p/3735491.html" target="_blank">http://www.cnblogs.com/liusuqi/p/3735491.html</a></td>
</tr>
<tr>
<td>angularjs nodejs</td>
<td><a href="https://github.com/zensh/jsgen" target="_blank">https://github.com/zensh/jsgen</a></td>
</tr>
<tr>
<td>从零开始nodejs系列文章</td>
<td><a href="http://blog.fens.me/series-nodejs" target="_blank">http://blog.fens.me/series-nodejs</a></td>
</tr>
<tr>
<td>理解nodejs</td>
<td><a href="http://debuggable.com/posts/understanding-node-js:4bd98440-45e4-4a9a-8ef7-0f7ecbdd56cb" target="_blank">http://debuggable.com/posts/understanding-node-js:4bd98440-45e4-4a9a-8ef7-0f7ecbdd56cb</a></td>
</tr>
<tr>
<td>nodejs事件轮询</td>
<td><a href="http://blog.mixu.net/2011/02/01/understanding-the-node-js-event-loop" target="_blank">http://blog.mixu.net/2011/02/01/understanding-the-node-js-event-loop</a></td>
</tr>
<tr>
<td>node入门</td>
<td><a href="http://www.nodebeginner.org/index-zh-cn.html" target="_blank">http://www.nodebeginner.org/index-zh-cn.html</a></td>
</tr>
<tr>
<td>nodejs cms</td>
<td><a href="http://ourjs.com/detail/53e1f281c5910a9806000001" target="_blank">http://ourjs.com/detail/53e1f281c5910a9806000001</a></td>
</tr>
<tr>
<td>Node初学者入门，一本全面的NodeJS教程</td>
<td><a href="http://ourjs.com/detail/529ca5950cb6498814000005" target="_blank">http://ourjs.com/detail/529ca5950cb6498814000005</a></td>
</tr>
<tr>
<td>NodeJS的代码调试和性能调优</td>
<td><a href="http://www.barretlee.com/blog/2015/10/07/debug-nodejs-in-command-line" target="_blank">http://www.barretlee.com/blog/2015/10/07/debug-nodejs-in-command-line</a></td>
</tr>
</tbody>
</table>
<h3 id="综合api">
<a name="t8"></a>综合API</h3>
<table>
<thead><tr>
<th>综合API</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>javascripting</td>
<td><a href="http://www.javascripting.com" target="_blank">http://www.javascripting.com</a></td>
</tr>
<tr>
<td>各种流行库搜索</td>
<td><a href="http://microjs.com" target="_blank">http://microjs.com</a></td>
</tr>
<tr>
<td>runoob.com-包含各种API集合</td>
<td><a href="http://www.runoob.com" target="_blank">http://www.runoob.com</a></td>
</tr>
<tr>
<td>开源中国在线API文档合集</td>
<td><a href="http://tool.oschina.net/apidocs" target="_blank">http://tool.oschina.net/apidocs</a></td>
</tr>
<tr>
<td>devdocs</td>
<td>
<a href="http://devdocs.io" target="_blank">http://devdocs.io</a> 英文综合API网站</td>
</tr>
</tbody>
</table>
<h3 id="ecmascript">
<a name="t9"></a>Ecmascript</h3>
<table>
<thead><tr>
<th>Ecmascript</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>Understanding ECMAScript 6 - Nicholas C. Zakas</td>
<td><a href="https://leanpub.com/understandinges6/read" target="_blank">https://leanpub.com/understandinges6/read</a></td>
</tr>
<tr>
<td>exploring-es6</td>
<td><a href="https://leanpub.com/exploring-es6/read" target="_blank">https://leanpub.com/exploring-es6/read</a></td>
</tr>
<tr>
<td>exploring-es6翻译</td>
<td><a href="https://github.com/es6-org/exploring-es6" target="_blank">https://github.com/es6-org/exploring-es6</a></td>
</tr>
<tr>
<td>exploring-es6翻译后预览</td>
<td><a href="http://es6-org.github.io/exploring-es6" target="_blank">http://es6-org.github.io/exploring-es6</a></td>
</tr>
<tr>
<td>阮一峰 es6</td>
<td><a href="http://es6.ruanyifeng.com" target="_blank">http://es6.ruanyifeng.com</a></td>
</tr>
<tr>
<td>阮一峰 Javascript</td>
<td><a href="http://javascript.ruanyifeng.com" target="_blank">http://javascript.ruanyifeng.com</a></td>
</tr>
<tr>
<td>ECMA-262，第 5 版</td>
<td><a href="http://yanhaijing.com/es5" target="_blank">http://yanhaijing.com/es5</a></td>
</tr>
<tr>
<td>es5</td>
<td><a href="http://es5.github.io" target="_blank">http://es5.github.io</a></td>
</tr>
</tbody>
</table>
<h3 id="js-template">
<a name="t10"></a>Js template</h3>
<table>
<thead><tr>
<th>Js template</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>template-chooser</td>
<td><a href="http://garann.github.io/template-chooser" target="_blank">http://garann.github.io/template-chooser</a></td>
</tr>
<tr>
<td>artTemplate</td>
<td><a href="https://github.com/aui/artTemplate" target="_blank">https://github.com/aui/artTemplate</a></td>
</tr>
<tr>
<td>tomdjs</td>
<td><a href="https://github.com/aui/tmodjs/blob/master/README.md" target="_blank">https://github.com/aui/tmodjs/blob/master/README.md</a></td>
</tr>
<tr>
<td>淘宝模板juicer模板</td>
<td><a href="http://juicer.name/docs/docs_zh_cn.html" target="_blank">http://juicer.name/docs/docs_zh_cn.html</a></td>
</tr>
<tr>
<td>Fxtpl v1.0 繁星前端模板引擎</td>
<td><a href="http://koen301.github.io/fxtpl" target="_blank">http://koen301.github.io/fxtpl</a></td>
</tr>
<tr>
<td>laytpl</td>
<td><a href="http://laytpl.layui.com" target="_blank">http://laytpl.layui.com</a></td>
</tr>
<tr>
<td>mozilla - nunjucks</td>
<td><a href="https://github.com/mozilla/nunjucks" target="_blank">https://github.com/mozilla/nunjucks</a></td>
</tr>
<tr>
<td>Juicer</td>
<td><a href="https://github.com/PaulGuo/Juicer" target="_blank">https://github.com/PaulGuo/Juicer</a></td>
</tr>
<tr>
<td>dustjs</td>
<td><a href="http://akdubya.github.io/dustjs" target="_blank">http://akdubya.github.io/dustjs</a></td>
</tr>
<tr>
<td>etpl</td>
<td><a href="http://ecomfe.github.io/etpl" target="_blank">http://ecomfe.github.io/etpl</a></td>
</tr>
</tbody>
</table>
<h3 id="html5html">
<a name="t11"></a>HTML5(HTML)</h3>
<table>
<thead><tr>
<th>HTML5(HTML)</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>深入理解HTML5标签</td>
<td><a href="https://segmentfault.com/a/1190000002695791" target="_blank">https://segmentfault.com/a/1190000002695791</a></td>
</tr>
<tr>
<td>如何写出高效率的HTML</td>
<td><a href="https://segmentfault.com/a/1190000002680822" target="_blank">https://segmentfault.com/a/1190000002680822</a></td>
</tr>
<tr>
<td>HTML meta标签总结与属性使用介绍</td>
<td><a href="https://segmentfault.com/a/1190000004279791" target="_blank">https://segmentfault.com/a/1190000004279791</a></td>
</tr>
<tr>
<td>戏说HTML5</td>
<td><a href="http://www.cnblogs.com/dojo-lzz/p/5059316.html" target="_blank">http://www.cnblogs.com/dojo-lzz/p/5059316.html</a></td>
</tr>
</tbody>
</table>
<h3 id="css3css">
<a name="t12"></a>CSS3(CSS)</h3>
<table>
<thead><tr>
<th>CSS3(CSS)</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>CSS 语法参考</td>
<td><a href="http://tympanus.net/codrops/css_reference" target="_blank">http://tympanus.net/codrops/css_reference</a></td>
</tr>
<tr>
<td>如何编写可维护的CSS</td>
<td><a href="https://github.com/chadluo/CSS-Guidelines/blob/master/README.md" target="_blank">https://github.com/chadluo/CSS-Guidelines/blob/master/README.md</a></td>
</tr>
<tr>
<td>CSS3动画手册</td>
<td><a href="http://isux.tencent.com/css3/index.html" target="_blank">http://isux.tencent.com/css3/index.html</a></td>
</tr>
<tr>
<td>腾讯css3动画制作工具</td>
<td><a href="http://isux.tencent.com/css3/tools.html" target="_blank">http://isux.tencent.com/css3/tools.html</a></td>
</tr>
<tr>
<td>志爷css小工具集合</td>
<td><a href="http://linxz.github.io/tianyizone" target="_blank">http://linxz.github.io/tianyizone</a></td>
</tr>
<tr>
<td>css3 js 移动大杂烩</td>
<td><a href="http://www.note12.com/category/blog/2014-6-5/538fe0a9f786f1b7019a4dfb" target="_blank">http://www.note12.com/category/blog/2014-6-5/538fe0a9f786f1b7019a4dfb</a></td>
</tr>
<tr>
<td>bouncejs 触摸库</td>
<td><a href="http://bouncejs.com" target="_blank">http://bouncejs.com</a></td>
</tr>
<tr>
<td>css3 按钮动画</td>
<td><a href="http://fian.my.id/Waves" target="_blank">http://fian.my.id/Waves</a></td>
</tr>
<tr>
<td>animate.css</td>
<td><a href="http://daneden.github.io/animate.css" target="_blank">http://daneden.github.io/animate.css</a></td>
</tr>
<tr>
<td>全局CSS的终结(狗带 [译]</td>
<td><a href="http://www.alloyteam.com/2015/10/8536" target="_blank">http://www.alloyteam.com/2015/10/8536</a></td>
</tr>
<tr>
<td>browserhacks</td>
<td><a href="http://browserhacks.com" target="_blank">http://browserhacks.com</a></td>
</tr>
</tbody>
</table>
<h3 id="angularjs">
<a name="t13"></a>Angularjs</h3>
<table>
<thead><tr>
<th>Angularjs</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>Angular.js 的一些学习资源</td>
<td><a href="https://github.com/dolymood/AngularLearning" target="_blank">https://github.com/dolymood/AngularLearning</a></td>
</tr>
<tr>
<td>angularjs中文社区</td>
<td><a href="http://angularjs.cn" target="_blank">http://angularjs.cn</a></td>
</tr>
<tr>
<td>Angularjs源码学习</td>
<td><a href="http://www.cnblogs.com/xuwenmin888/p/3739096.html" target="_blank">http://www.cnblogs.com/xuwenmin888/p/3739096.html</a></td>
</tr>
<tr>
<td>Angularjs源码学习</td>
<td><a href="http://www.ifeenan.com/?c=AngularJS" target="_blank">http://www.ifeenan.com/?c=AngularJS</a></td>
</tr>
<tr>
<td>angular对bootstrap的封装</td>
<td><a href="http://angular-ui.github.io/bootstrap" target="_blank">http://angular-ui.github.io/bootstrap</a></td>
</tr>
<tr>
<td>angularjs + nodejs</td>
<td><a href="https://cnodejs.org/topic/51404e0f069911196d2e3923" target="_blank">https://cnodejs.org/topic/51404e0f069911196d2e3923</a></td>
</tr>
<tr>
<td>吕大豹 Angularjs</td>
<td><a href="http://www.cnblogs.com/lvdabao/tag/AngularJs" target="_blank">http://www.cnblogs.com/lvdabao/tag/AngularJs</a></td>
</tr>
<tr>
<td>AngularJS 最佳实践</td>
<td><a href="http://www.infoq.com/cn/news/2013/02/angular-web-app" target="_blank">http://www.infoq.com/cn/news/2013/02/angular-web-app</a></td>
</tr>
<tr>
<td>Angular的一些扩展指令</td>
<td><a href="http://www.lovelucy.info/angularjs-best-practices.html" target="_blank">http://www.lovelucy.info/angularjs-best-practices.html</a></td>
</tr>
<tr>
<td>Angular数据绑定原理</td>
<td><a href="https://github.com/Pasvaz/bindonce" target="_blank">https://github.com/Pasvaz/bindonce</a></td>
</tr>
<tr>
<td>一些扩展Angular UI组件</td>
<td><a href="https://github.com/angular-ui" target="_blank">https://github.com/angular-ui</a></td>
</tr>
<tr>
<td>Ember和AngularJS的性能测试</td>
<td><a href="http://voidcanvas.com/emberjs-vs-angularjs-performance-testing" target="_blank">http://voidcanvas.com/emberjs-vs-angularjs-performance-testing</a></td>
</tr>
<tr>
<td>带你走近AngularJS - 基本功能介绍</td>
<td><a href="http://www.cnblogs.com/powertoolsteam/p/angularjs-introdection.html" target="_blank">http://www.cnblogs.com/powertoolsteam/p/angularjs-introdection.html</a></td>
</tr>
<tr>
<td>Angularjs开发指南</td>
<td><a href="http://angular.duapp.com/docs/guide" target="_blank">http://angular.duapp.com/docs/guide</a></td>
</tr>
<tr>
<td>Angularjs学习</td>
<td><a href="http://www.cnblogs.com/amosli/p/3710648.html" target="_blank">http://www.cnblogs.com/amosli/p/3710648.html</a></td>
</tr>
<tr>
<td>不要带着jQuery的思维去学习AngularJS</td>
<td><a href="http://www.rainweb.cn/article/angularjs-jquery.html" target="_blank">http://www.rainweb.cn/article/angularjs-jquery.html</a></td>
</tr>
<tr>
<td>angularjs 学习笔记</td>
<td><a href="http://wangjiatao.diandian.com/?tag=angularjs" target="_blank">http://wangjiatao.diandian.com/?tag=angularjs</a></td>
</tr>
<tr>
<td>angularjs 开发指南</td>
<td><a href="http://www.angularjs.cn/T008" target="_blank">http://www.angularjs.cn/T008</a></td>
</tr>
<tr>
<td>angularjs 英文资料</td>
<td><a href="https://github.com/jmcunningham/AngularJS-Learning" target="_blank">https://github.com/jmcunningham/AngularJS-Learning</a></td>
</tr>
<tr>
<td>angular bootstrap</td>
<td><a href="http://angular-ui.github.io/bootstrap" target="_blank">http://angular-ui.github.io/bootstrap</a></td>
</tr>
<tr>
<td>angular jq mobile</td>
<td><a href="https://github.com/opitzconsulting/jquery-mobile-angular-adapter" target="_blank">https://github.com/opitzconsulting/jquery-mobile-angular-adapter</a></td>
</tr>
<tr>
<td>angular ui</td>
<td><a href="http://mgcrea.github.io/angular-strap" target="_blank">http://mgcrea.github.io/angular-strap</a></td>
</tr>
<tr>
<td>整合jQuery Mobile+AngularJS经验谈</td>
<td><a href="http://www.tuicool.com/articles/7ZZVr2" target="_blank">http://www.tuicool.com/articles/7ZZVr2</a></td>
</tr>
<tr>
<td>有jQuery背景，该如何用AngularJS编程思想</td>
<td><a href="http://blog.jobbole.com/46589/" target="_blank">http://blog.jobbole.com/46589/</a></td>
</tr>
<tr>
<td>AngularJS在线教程</td>
<td><a href="http://each.sinaapp.com/angular" target="_blank">http://each.sinaapp.com/angular</a></td>
</tr>
<tr>
<td>angular学习笔记</td>
<td><a href="http://www.zouyesheng.com/angular.html" target="_blank">http://www.zouyesheng.com/angular.html</a></td>
</tr>
</tbody>
</table>
<h3 id="react">
<a name="t14"></a>React</h3>
<table>
<thead><tr>
<th>React</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>react.js 中文论坛</td>
<td><a href="http://www.react-china.org" target="_blank">http://www.react-china.org</a></td>
</tr>
<tr>
<td>react.js 官方网址</td>
<td><a href="https://facebook.github.io/react/index.html" target="_blank">https://facebook.github.io/react/index.html</a></td>
</tr>
<tr>
<td>react.js 官方文档</td>
<td><a href="https://facebook.github.io/react/docs/getting-started.html" target="_blank">https://facebook.github.io/react/docs/getting-started.html</a></td>
</tr>
<tr>
<td>react.js material UI</td>
<td><a href="http://material-ui.com/" target="_blank">http://material-ui.com/#</a></td>
</tr>
<tr>
<td>react.js TouchstoneJS UI</td>
<td><a href="http://touchstonejs.io" target="_blank">http://touchstonejs.io</a></td>
</tr>
<tr>
<td>react.js amazeui UI</td>
<td><a href="http://amazeui.org/react" target="_blank">http://amazeui.org/react</a></td>
</tr>
<tr>
<td>React 入门实例教程 - 阮一峰</td>
<td><a href="http://www.ruanyifeng.com/blog/2015/03/react.html" target="_blank">http://www.ruanyifeng.com/blog/2015/03/react.html</a></td>
</tr>
<tr>
<td>React Native 中文版</td>
<td><a href="http://wiki.jikexueyuan.com/project/react-native" target="_blank">http://wiki.jikexueyuan.com/project/react-native</a></td>
</tr>
<tr>
<td>Webpack 和 React 小书 - 前端乱炖</td>
<td><a href="http://www.html-js.com/article/Fakefish%203053" target="_blank">http://www.html-js.com/article/Fakefish%203053</a></td>
</tr>
<tr>
<td>Webpack 和 React 小书 - gitbook</td>
<td><a href="https://fakefish.github.io/react-webpack-cookbook" target="_blank">https://fakefish.github.io/react-webpack-cookbook</a></td>
</tr>
<tr>
<td>webpack</td>
<td><a href="https://github.com/webpack/webpack" target="_blank">https://github.com/webpack/webpack</a></td>
</tr>
<tr>
<td>Webpack，101入门体验</td>
<td><a href="http://html-js.com/article/3009" target="_blank">http://html-js.com/article/3009</a></td>
</tr>
<tr>
<td>webpack入门教程</td>
<td><a href="http://html-js.com/article/3113" target="_blank">http://html-js.com/article/3113</a></td>
</tr>
<tr>
<td>基于webpack搭建前端工程解决方案探索</td>
<td><a href="http://segmentfault.com/a/1190000003499526" target="_blank">http://segmentfault.com/a/1190000003499526</a></td>
</tr>
<tr>
<td>React原创实战视频教程</td>
<td><a href="http://www.piliyu.com" target="_blank">http://www.piliyu.com</a></td>
</tr>
</tbody>
</table>
<h3 id="vue">
<a name="t15"></a>vue</h3>
<table>
<thead><tr>
<th>vue</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>Vue</td>
<td><a href="http://cn.vuejs.org" target="_blank">http://cn.vuejs.org</a></td>
</tr>
<tr>
<td>Vue 论坛</td>
<td><a href="http://forum.vuejs.org" target="_blank">http://forum.vuejs.org</a></td>
</tr>
<tr>
<td>Vue 入门指南</td>
<td><a href="http://www.cnblogs.com/aaronjs/p/3660102.html" target="_blank">http://www.cnblogs.com/aaronjs/p/3660102.html</a></td>
</tr>
<tr>
<td>Vue 的一些资源索引</td>
<td><a href="http://segmentfault.com/a/1190000000411057" target="_blank">http://segmentfault.com/a/1190000000411057</a></td>
</tr>
<tr>
<td>awesome-vue</td>
<td><a href="https://github.com/vuejs/awesome-vue" target="_blank">https://github.com/vuejs/awesome-vue</a></td>
</tr>
</tbody>
</table>
<h3 id="移动端api">
<a name="t16"></a>移动端API</h3>
<table>
<thead><tr>
<th>移动端API</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>99移动端知识集合</td>
<td><a href="https://github.com/jtyjty99999/mobileTech" target="_blank">https://github.com/jtyjty99999/mobileTech</a></td>
</tr>
<tr>
<td>移动端前端开发知识库</td>
<td><a href="https://github.com/AlloyTeam/Mars" target="_blank">https://github.com/AlloyTeam/Mars</a></td>
</tr>
<tr>
<td>移动前端的一些坑和解决方法（外观表现）</td>
<td><a href="http://caibaojian.com/mobile-web-bug.html" target="_blank">http://caibaojian.com/mobile-web-bug.html</a></td>
</tr>
<tr>
<td>【原】移动web资源整理</td>
<td><a href="http://www.cnblogs.com/PeunZhang/p/3407453.html" target="_blank">http://www.cnblogs.com/PeunZhang/p/3407453.html</a></td>
</tr>
<tr>
<td>zepto 1.0 中文手册</td>
<td><a href="http://mweb.baidu.com/zeptoapi" target="_blank">http://mweb.baidu.com/zeptoapi</a></td>
</tr>
<tr>
<td>zepto 1.0 中文手册</td>
<td><a href="http://www.html-5.cn/Manual/Zepto" target="_blank">http://www.html-5.cn/Manual/Zepto</a></td>
</tr>
<tr>
<td>zepto 1.1.2</td>
<td><a href="http://www.css88.com/doc/zeptojs_api" target="_blank">http://www.css88.com/doc/zeptojs_api</a></td>
</tr>
<tr>
<td>zepto 中文注释</td>
<td><a href="http://www.cnblogs.com/sky000/archive/2013/03/29/2988952.html" target="_blank">http://www.cnblogs.com/sky000/archive/2013/03/29/2988952.html</a></td>
</tr>
<tr>
<td>jqmobile 手册</td>
<td><a href="http://app-framework-software.intel.com/api.php" target="_blank">http://app-framework-software.intel.com/api.php</a></td>
</tr>
<tr>
<td>移动浏览器开发集合</td>
<td><a href="https://github.com/maxzhang/maxzhang.github.com/issues" target="_blank">https://github.com/maxzhang/maxzhang.github.com/issues</a></td>
</tr>
<tr>
<td>移动开发大杂烩</td>
<td><a href="https://github.com/hoosin/mobile-web-favorites" target="_blank">https://github.com/hoosin/mobile-web-favorites</a></td>
</tr>
</tbody>
</table>
<h3 id="jquery">
<a name="t17"></a>jQuery</h3>
<table>
<thead><tr>
<th>jQuery</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>jQuery API 中文文档</td>
<td><a href="http://www.jquery123.com" target="_blank">http://www.jquery123.com</a></td>
</tr>
<tr>
<td>hemin 在线版</td>
<td><a href="http://hemin.cn/jq" target="_blank">http://hemin.cn/jq</a></td>
</tr>
<tr>
<td>css88 jq api</td>
<td><a href="http://www.css88.com/jqapi-1.9/on" target="_blank">http://www.css88.com/jqapi-1.9/on</a></td>
</tr>
<tr>
<td>css88 jqui api</td>
<td><a href="http://www.css88.com/jquery-ui-api" target="_blank">http://www.css88.com/jquery-ui-api</a></td>
</tr>
<tr>
<td>学习jquery</td>
<td><a href="http://learn.jquery.com" target="_blank">http://learn.jquery.com</a></td>
</tr>
<tr>
<td>jquery 源码查找</td>
<td><a href="http://james.padolsey.com/jquery" target="_blank">http://james.padolsey.com/jquery</a></td>
</tr>
<tr>
<td>Web前端资源汇总(jQuery,Js,Css3等)</td>
<td><a href="http://www.cnblogs.com/jihua/p/webfront.html" target="_blank">http://www.cnblogs.com/jihua/p/webfront.html</a></td>
</tr>
</tbody>
</table>
<h3 id="d3">
<a name="t18"></a>D3</h3>
<table>
<thead><tr>
<th>D3</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>d3 Tutorials</td>
<td><a href="https://github.com/mbostock/d3/wiki/Tutorials" target="_blank">https://github.com/mbostock/d3/wiki/Tutorials</a></td>
</tr>
<tr>
<td>Gallery</td>
<td><a href="https://github.com/mbostock/d3/wiki/Gallery" target="_blank">https://github.com/mbostock/d3/wiki/Gallery</a></td>
</tr>
<tr>
<td>lofter</td>
<td><a href="http://datavisual.lofter.com/post/40cf3a_188e535" target="_blank">http://datavisual.lofter.com/post/40cf3a_188e535</a></td>
</tr>
<tr>
<td>iteye</td>
<td><a href="http://alanland.iteye.com/blog/1878595" target="_blank">http://alanland.iteye.com/blog/1878595</a></td>
</tr>
<tr>
<td>ruanyifeng</td>
<td><a href="http://javascript.ruanyifeng.com/library/d3.html" target="_blank">http://javascript.ruanyifeng.com/library/d3.html</a></td>
</tr>
</tbody>
</table>
<h3 id="requriejs">
<a name="t19"></a>Requriejs</h3>
<table>
<thead><tr>
<th>Requriejs</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>Javascript模块化编程（一）：模块的写法</td>
<td><a href="http://www.ruanyifeng.com/blog/2012/10/javascript_module.html" target="_blank">http://www.ruanyifeng.com/blog/2012/10/javascript_module.html</a></td>
</tr>
<tr>
<td>Javascript模块化编程（二）：AMD规范</td>
<td><a href="http://www.ruanyifeng.com/blog/2012/10/asynchronous_module_definition.html" target="_blank">http://www.ruanyifeng.com/blog/2012/10/asynchronous_module_definition.html</a></td>
</tr>
<tr>
<td>Javascript模块化编程（三）：require.js的用法</td>
<td><a href="http://www.ruanyifeng.com/blog/2012/11/require_js.html" target="_blank">http://www.ruanyifeng.com/blog/2012/11/require_js.html</a></td>
</tr>
<tr>
<td>RequireJS入门（一）</td>
<td><a href="http://www.cnblogs.com/snandy/archive/2012/05/22/2513652.html" target="_blank">http://www.cnblogs.com/snandy/archive/2012/05/22/2513652.html</a></td>
</tr>
<tr>
<td>RequireJS入门（二）</td>
<td><a href="http://www.cnblogs.com/snandy/archive/2012/05/23/2513712.html" target="_blank">http://www.cnblogs.com/snandy/archive/2012/05/23/2513712.html</a></td>
</tr>
<tr>
<td>RequireJS进阶（三）</td>
<td><a href="http://www.cnblogs.com/snandy/archive/2012/06/08/2538001.html" target="_blank">http://www.cnblogs.com/snandy/archive/2012/06/08/2538001.html</a></td>
</tr>
<tr>
<td>requrie源码学习</td>
<td><a href="http://www.cnblogs.com/yexiaochai/p/3632580.html" target="_blank">http://www.cnblogs.com/yexiaochai/p/3632580.html</a></td>
</tr>
<tr>
<td>requrie 入门指南</td>
<td><a href="http://www.oschina.net/translate/getting-started-with-the-requirejs-library" target="_blank">http://www.oschina.net/translate/getting-started-with-the-requirejs-library</a></td>
</tr>
<tr>
<td>requrieJS 学习笔记</td>
<td><a href="http://www.cnblogs.com/yexiaochai/p/3214926.html" target="_blank">http://www.cnblogs.com/yexiaochai/p/3214926.html</a></td>
</tr>
<tr>
<td>requriejs 其一</td>
<td><a href="http://cyj.me/why-seajs/requirejs/" target="_blank">http://cyj.me/why-seajs/requirejs/</a></td>
</tr>
<tr>
<td>require backbone结合</td>
<td><a href="http://www.cnblogs.com/yexiaochai/p/3221081.html" target="_blank">http://www.cnblogs.com/yexiaochai/p/3221081.html</a></td>
</tr>
</tbody>
</table>
<h3 id="seajs">
<a name="t20"></a>Seajs</h3>
<table>
<thead><tr>
<th>Seajs</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>seajs</td>
<td><a href="http://seajs.org" target="_blank">http://seajs.org</a></td>
</tr>
<tr>
<td>seajs 中文手册</td>
<td><a href="http://cyj.me/why-seajs/zh" target="_blank">http://cyj.me/why-seajs/zh</a></td>
</tr>
</tbody>
</table>
<h3 id="lesssass">
<a name="t21"></a>Less,sass</h3>
<table>
<thead><tr>
<th>Less,sass</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>sass</td>
<td><a href="http://www.w3cplus.com/sassguide" target="_blank">http://www.w3cplus.com/sassguide</a></td>
</tr>
<tr>
<td>sass教程-sass中国</td>
<td><a href="http://www.sass.hk" target="_blank">http://www.sass.hk</a></td>
</tr>
<tr>
<td>Sass 中文文档</td>
<td><a href="http://sass.bootcss.com" target="_blank">http://sass.bootcss.com</a></td>
</tr>
<tr>
<td>less</td>
<td><a href="http://less.bootcss.com" target="_blank">http://less.bootcss.com</a></td>
</tr>
</tbody>
</table>
<h3 id="markdown">
<a name="t22"></a>Markdown</h3>
<table>
<thead><tr>
<th>Markdown</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>Markdown 语法说明 (简体中文版</td>
<td><a href="http://wowubuntu.com/markdown" target="_blank">http://wowubuntu.com/markdown</a></td>
</tr>
<tr>
<td>markdown入门参考</td>
<td><a href="https://github.com/LearnShare/Learning-Markdown/blob/master/README.md" target="_blank">https://github.com/LearnShare/Learning-Markdown/blob/master/README.md</a></td>
</tr>
<tr>
<td>gitbook</td>
<td>
<a href="https://www.gitbook.com" target="_blank">https://www.gitbook.com</a> 国外的在线markdown可编辑成书</td>
</tr>
<tr>
<td>mdeditor</td>
<td>
<a href="https://www.zybuluo.com/mdeditor" target="_blank">https://www.zybuluo.com/mdeditor</a> 一款国内的在线markdown编辑器</td>
</tr>
<tr>
<td>stackedit</td>
<td>
<a href="https://stackedit.io" target="_blank">https://stackedit.io</a> 国外的在线markdown编辑器，功能强大，同步云盘</td>
</tr>
<tr>
<td>mditor</td>
<td>
<a href="http://bh-lay.github.io/mditor" target="_blank">http://bh-lay.github.io/mditor</a> 一款轻量级的markdown编辑器</td>
</tr>
<tr>
<td>lepture-editor</td>
<td><a href="https://github.com/lepture/editor" target="_blank">https://github.com/lepture/editor</a></td>
</tr>
<tr>
<td>markdown-editor</td>
<td><a href="https://github.com/jbt/markdown-editor" target="_blank">https://github.com/jbt/markdown-editor</a></td>
</tr>
<tr>
<td>作业部落</td>
<td>
<a href="https://www.zybuluo.com" target="_blank">https://www.zybuluo.com</a> 功能强大，速度流畅，全平台同步</td>
</tr>
</tbody>
</table>
<h3 id="兼容性">
<a name="t23"></a>兼容性</h3>
<table>
<thead><tr>
<th>兼容性</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>esma 兼容列表</td>
<td><a href="http://kangax.github.io/compat-table/es6" target="_blank">http://kangax.github.io/compat-table/es6</a></td>
</tr>
<tr>
<td>W3C CSS验证服务</td>
<td><a href="http://jigsaw.w3.org/css-validator/validator.html.zh-cn" target="_blank">http://jigsaw.w3.org/css-validator/validator.html.zh-cn</a></td>
</tr>
<tr>
<td>caniuse</td>
<td><a href="http://caniuse.com/#index" target="_blank">http://caniuse.com/#index</a></td>
</tr>
<tr>
<td>csscreator</td>
<td><a href="http://csscreator.com/properties" target="_blank">http://csscreator.com/properties</a></td>
</tr>
<tr>
<td>microsoft</td>
<td><a href="https://msdn.microsoft.com/zh-cn/library/cc351024(v=vs.85.aspx" target="_blank">https://msdn.microsoft.com/zh-cn/library/cc351024(v=vs.85.aspx</a></td>
</tr>
<tr>
<td>在线测兼容-移动端</td>
<td><a href="http://www.responsinator.com" target="_blank">http://www.responsinator.com</a></td>
</tr>
<tr>
<td>emulators</td>
<td><a href="https://www.manymo.com/emulators" target="_blank">https://www.manymo.com/emulators</a></td>
</tr>
</tbody>
</table>
<h3 id="ui相关">
<a name="t24"></a>UI相关</h3>
<table>
<thead><tr>
<th>UI相关</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>bootcss</td>
<td><a href="http://v3.bootcss.com" target="_blank">http://v3.bootcss.com</a></td>
</tr>
<tr>
<td>MetroUICSS</td>
<td><a href="http://www.w3cplus.com/MetroUICSS" target="_blank">http://www.w3cplus.com/MetroUICSS</a></td>
</tr>
<tr>
<td>semantic</td>
<td><a href="http://semantic-ui.com" target="_blank">http://semantic-ui.com</a></td>
</tr>
<tr>
<td>Buttons</td>
<td><a href="http://alexwolfe.github.io/Buttons" target="_blank">http://alexwolfe.github.io/Buttons</a></td>
</tr>
<tr>
<td>kitecss</td>
<td><a href="http://hiloki.github.io/kitecss" target="_blank">http://hiloki.github.io/kitecss</a></td>
</tr>
<tr>
<td>pintuer</td>
<td><a href="http://www.pintuer.com" target="_blank">http://www.pintuer.com</a></td>
</tr>
<tr>
<td>amazeui</td>
<td><a href="http://amazeui.org" target="_blank">http://amazeui.org</a></td>
</tr>
<tr>
<td>worldhello</td>
<td><a href="http://www.worldhello.net/gotgithub/index.html" target="_blank">http://www.worldhello.net/gotgithub/index.html</a></td>
</tr>
<tr>
<td>linuxtoy</td>
<td><a href="http://igit.linuxtoy.org/contents.html" target="_blank">http://igit.linuxtoy.org/contents.html</a></td>
</tr>
<tr>
<td>gitmagic</td>
<td><a href="http://www-cs-students.stanford.edu/~blynn/gitmagic/intl/zh_cn" target="_blank">http://www-cs-students.stanford.edu/~blynn/gitmagic/intl/zh_cn</a></td>
</tr>
<tr>
<td>rogerdudler</td>
<td><a href="http://rogerdudler.github.io/git-guide/index.zh.html" target="_blank">http://rogerdudler.github.io/git-guide/index.zh.html</a></td>
</tr>
<tr>
<td>gitref</td>
<td><a href="http://gitref.justjavac.com" target="_blank">http://gitref.justjavac.com</a></td>
</tr>
<tr>
<td>book</td>
<td><a href="http://git-scm.com/book/zh" target="_blank">http://git-scm.com/book/zh</a></td>
</tr>
<tr>
<td>gogojimmy</td>
<td><a href="http://gogojimmy.net/2012/01/17/how-to-use-git-1-git-basic" target="_blank">http://gogojimmy.net/2012/01/17/how-to-use-git-1-git-basic</a></td>
</tr>
</tbody>
</table>
<h3 id="其它api">
<a name="t25"></a>其它API</h3>
<table>
<thead><tr>
<th>其它API</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>HTTP API 设计指南</td>
<td><a href="http://segmentfault.com/bookmark/1230000002521721" target="_blank">http://segmentfault.com/bookmark/1230000002521721</a></td>
</tr>
<tr>
<td>javascript流行库汇总</td>
<td>javascriptoo</td>
</tr>
<tr>
<td>验证api</td>
<td><a href="http://niceue.com/validator/demo/index.php" target="_blank">http://niceue.com/validator/demo/index.php</a></td>
</tr>
<tr>
<td>underscore 中文手册</td>
<td><a href="http://www.css88.com/doc/underscore" target="_blank">http://www.css88.com/doc/underscore</a></td>
</tr>
<tr>
<td>underscore源码分析</td>
<td><a href="http://www.html-js.com/article/Underscorejs-source-code-analysis-of-underscorejs-source-code-analysis%203031" target="_blank">http://www.html-js.com/article/Underscorejs-source-code-analysis-of-underscorejs-source-code-analysis%203031</a></td>
</tr>
<tr>
<td>underscore源码分析-亚里士朱德的博客</td>
<td><a href="http://yalishizhude.github.io/tags/underscore" target="_blank">http://yalishizhude.github.io/tags/underscore</a></td>
</tr>
<tr>
<td>underscrejs en api</td>
<td><a href="http://underscorejs.org" target="_blank">http://underscorejs.org</a></td>
</tr>
<tr>
<td>lodash - underscore的代替品</td>
<td><a href="https://lodash.com" target="_blank">https://lodash.com</a></td>
</tr>
<tr>
<td>ext4api</td>
<td><a href="http://extjs-doc-cn.github.io/ext4api" target="_blank">http://extjs-doc-cn.github.io/ext4api</a></td>
</tr>
<tr>
<td>backbone 中文手册</td>
<td><a href="http://www.csser.com/tools/backbone/backbone.js.html" target="_blank">http://www.csser.com/tools/backbone/backbone.js.html</a></td>
</tr>
<tr>
<td>qwrap手册</td>
<td><a href="/admin/blogs/%22http:/dev.qwrap.com/resource/js/&lt;em" target="_blank">docs/_youa/#/qw/base/loadJs.htm”&gt;http://dev.qwrap.com/resource/js/<em>docs/_youa/#/qw/base/loadJs</em>.htm</a></td>
</tr>
<tr>
<td>缓动函数</td>
<td><a href="http://easings.net/zh-cn" target="_blank">http://easings.net/zh-cn</a></td>
</tr>
<tr>
<td>svg 中文参考</td>
<td><a href="http://www.w3school.com.cn/svg/svg_reference.asp" target="_blank">http://www.w3school.com.cn/svg/svg_reference.asp</a></td>
</tr>
<tr>
<td>svg mdn参考</td>
<td><a href="https://developer.mozilla.org/en-US/docs/Web/SVG" target="_blank">https://developer.mozilla.org/en-US/docs/Web/SVG</a></td>
</tr>
<tr>
<td>svg 导出 canvas</td>
<td><a href="https://github.com/gabelerner/canvg" target="_blank">https://github.com/gabelerner/canvg</a></td>
</tr>
<tr>
<td>svg 导出 png</td>
<td><a href="https://github.com/exupero/saveSvgAsPng" target="_blank">https://github.com/exupero/saveSvgAsPng</a></td>
</tr>
<tr>
<td>ai-to-svg</td>
<td><a href="http://www.zamzar.com/convert/ai-to-svg" target="_blank">http://www.zamzar.com/convert/ai-to-svg</a></td>
</tr>
<tr>
<td>localStorage 库</td>
<td><a href="https://github.com/machao/localStorage" target="_blank">https://github.com/machao/localStorage</a></td>
</tr>
</tbody>
</table>
<h3 id="图表类">
<a name="t26"></a>图表类</h3>
<table>
<thead><tr>
<th>图表类</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>Highcharts 中文API</td>
<td><a href="http://www.hcharts.cn/api/index.php" target="_blank">http://www.hcharts.cn/api/index.php</a></td>
</tr>
<tr>
<td>Highcharts 英文API</td>
<td><a href="http://api.highcharts.com/highcharts" target="_blank">http://api.highcharts.com/highcharts</a></td>
</tr>
<tr>
<td>ECharts 百度的图表软件</td>
<td><a href="http://echarts.baidu.com/" target="_blank">http://echarts.baidu.com/</a></td>
</tr>
<tr>
<td>高德地图</td>
<td><a href="http://lbs.amap.com/api" target="_blank">http://lbs.amap.com/api</a></td>
</tr>
<tr>
<td>开源的矢量图脚本框架</td>
<td><a href="http://paperjs.org" target="_blank">http://paperjs.org</a></td>
</tr>
<tr>
<td>svg 地图</td>
<td><a href="http://jvectormap.com" target="_blank">http://jvectormap.com</a></td>
</tr>
</tbody>
</table>
<h3 id="正则">
<a name="t27"></a>正则</h3>
<table>
<thead><tr>
<th>正则</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>JS正则表达式元字符</td>
<td><a href="http://segmentfault.com/a/1190000002471140" target="_blank">http://segmentfault.com/a/1190000002471140</a></td>
</tr>
<tr>
<td>正则表达式30分钟入门教程</td>
<td><a href="http://deerchao.net/tutorials/regex/regex.htm" target="_blank">http://deerchao.net/tutorials/regex/regex.htm</a></td>
</tr>
<tr>
<td>MDN-正则表达式</td>
<td><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Regular_Expressions" target="_blank">https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Regular_Expressions</a></td>
</tr>
<tr>
<td>ruanyifeng - RegExp对象</td>
<td><a href="http://javascript.ruanyifeng.com/stdlib/regexp.html" target="_blank">http://javascript.ruanyifeng.com/stdlib/regexp.html</a></td>
</tr>
<tr>
<td>小胡子哥 - 进阶正则表达式</td>
<td><a href="http://div.io/topic/764?page=1" target="_blank">http://div.io/topic/764?page=1</a></td>
</tr>
<tr>
<td>is.js</td>
<td><a href="https://github.com/Cedriking/is.js/blob/master/is.js" target="_blank">https://github.com/Cedriking/is.js/blob/master/is.js</a></td>
</tr>
<tr>
<td>正则在线测试</td>
<td><a href="http://regexper.com" target="_blank">http://regexper.com</a></td>
</tr>
</tbody>
</table>
<h3 id="前端规范">
<a name="t28"></a>前端规范</h3>
<table>
<thead><tr>
<th>前端规范</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>通过分析github代码库总结出来的工程师代码书写习惯</td>
<td><a href="http://alloyteam.github.io/CodeGuide" target="_blank">http://alloyteam.github.io/CodeGuide</a></td>
</tr>
<tr>
<td>HTML&amp;CSS编码规范 by @mdo</td>
<td><a href="http://codeguide.bootcss.com" target="_blank">http://codeguide.bootcss.com</a></td>
</tr>
<tr>
<td>团队合作的css命名规范-腾讯AlloyTeam前端团队</td>
<td><a href="http://www.alloyteam.com/2011/10/css-on-team-naming/" target="_blank">http://www.alloyteam.com/2011/10/css-on-team-naming/</a></td>
</tr>
<tr>
<td>前端编码规范之js - by yuwenhui</td>
<td><a href="http://yuwenhui.github.io" target="_blank">http://yuwenhui.github.io</a></td>
</tr>
<tr>
<td>前端编码规范之js - by 李靖</td>
<td><a href="http://www.cnblogs.com/hustskyking/p/javascript-spec.html" target="_blank">http://www.cnblogs.com/hustskyking/p/javascript-spec.html</a></td>
</tr>
<tr>
<td>前端开发规范手册</td>
<td><a href="http://zhibimo.com/read/Ashu/front-end-style-guide" target="_blank">http://zhibimo.com/read/Ashu/front-end-style-guide</a></td>
</tr>
<tr>
<td>Airbnb JavaScript 编码规范（简体中文版）</td>
<td><a href="https://github.com/yuche/javascript#table-of-contents" target="_blank">https://github.com/yuche/javascript#table-of-contents</a></td>
</tr>
<tr>
<td>AMD与CMD规范的区别</td>
<td><a href="http://www.zhihu.com/question/20351507" target="_blank">http://www.zhihu.com/question/20351507</a></td>
</tr>
<tr>
<td>AMD与CMD规范的区别</td>
<td><a href="http://www.cnblogs.com/tugenhua0707/p/3507957.html" target="_blank">http://www.cnblogs.com/tugenhua0707/p/3507957.html</a></td>
</tr>
<tr>
<td>KISSY 源码规范</td>
<td><a href="http://docs.kissyui.com/1.4/docs/html/tutorials/style-guide/kissy-source-style.html" target="_blank">http://docs.kissyui.com/1.4/docs/html/tutorials/style-guide/kissy-source-style.html</a></td>
</tr>
<tr>
<td>bt编码规范</td>
<td><a href="http://codeguide.bootcss.com" target="_blank">http://codeguide.bootcss.com</a></td>
</tr>
<tr>
<td>规范加强版</td>
<td><a href="https://github.com/Suxiaogang/Code_Guide" target="_blank">https://github.com/Suxiaogang/Code_Guide</a></td>
</tr>
<tr>
<td>前端代码规范 及 最佳实践</td>
<td><a href="http://blog.jobbole.com/79075" target="_blank">http://blog.jobbole.com/79075</a></td>
</tr>
<tr>
<td>百度前端规范</td>
<td><a href="http://coderlmn.github.io/code-standards" target="_blank">http://coderlmn.github.io/code-standards</a></td>
</tr>
<tr>
<td>百度前端规范</td>
<td><a href="http://isobar-idev.github.io/code-standards" target="_blank">http://isobar-idev.github.io/code-standards</a></td>
</tr>
<tr>
<td>百度前端规范</td>
<td><a href="http://zhuanlan.zhihu.com/fuyun/19884834" target="_blank">http://zhuanlan.zhihu.com/fuyun/19884834</a></td>
</tr>
<tr>
<td>ECMAScript6 编码规范—广发证券前端团队</td>
<td><a href="https://github.com/gf-rd/es6-coding-style" target="_blank">https://github.com/gf-rd/es6-coding-style</a></td>
</tr>
<tr>
<td>JavaScript 风格指南/编码规范（Airbnb公司版）</td>
<td><a href="http://blog.jobbole.com/79484" target="_blank">http://blog.jobbole.com/79484</a></td>
</tr>
<tr>
<td>网易前端开发规范</td>
<td><a href="http://nec.netease.com/standard" target="_blank">http://nec.netease.com/standard</a></td>
</tr>
<tr>
<td>css模块</td>
<td><a href="http://www.75team.com/archives/1049" target="_blank">http://www.75team.com/archives/1049</a></td>
</tr>
<tr>
<td>前端规范资源列表</td>
<td><a href="https://github.com/ecomfe/spec" target="_blank">https://github.com/ecomfe/spec</a></td>
</tr>
</tbody>
</table>
<h3 id="php">
<a name="t29"></a>PHP</h3>
<table>
<thead><tr>
<th>PHP</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>最流行的PHP 代码规范</td>
<td><a href="http://segmentfault.com/a/1190000000443795" target="_blank">http://segmentfault.com/a/1190000000443795</a></td>
</tr>
<tr>
<td>最流行的PHP 代码规范</td>
<td><a href="https://github.com/hfcorriez/fig-standards/blob/zh_CN/%E6%8E%A5%E5%8F%97/PSR-2-coding-style-guide.md" target="_blank">https://github.com/hfcorriez/fig-standards/blob/zh_CN/%E6%8E%A5%E5%8F%97/PSR-2-coding-style-guide.md</a></td>
</tr>
</tbody>
</table>
<h3 id="各大公司开源项目">
<a name="t30"></a>各大公司开源项目</h3>
<table>
<thead><tr>
<th>各大公司开源项目</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>Facebook Projects</td>
<td><a href="https://code.facebook.com/projects/web" target="_blank">https://code.facebook.com/projects/web</a></td>
</tr>
<tr>
<td>百度web前端研发部</td>
<td><a href="http://fex.baidu.com" target="_blank">http://fex.baidu.com</a></td>
</tr>
<tr>
<td>百度EFE</td>
<td><a href="http://efe.baidu.com" target="_blank">http://efe.baidu.com</a></td>
</tr>
<tr>
<td>百度github</td>
<td><a href="https://github.com/fex-team" target="_blank">https://github.com/fex-team</a></td>
</tr>
<tr>
<td>alloyteam</td>
<td><a href="http://www.alloyteam.com" target="_blank">http://www.alloyteam.com</a></td>
</tr>
<tr>
<td>alloyteam-github</td>
<td><a href="http://alloyteam.github.io" target="_blank">http://alloyteam.github.io</a></td>
</tr>
<tr>
<td>alloyteam-AlloyGameEngine</td>
<td><a href="https://github.com/AlloyTeam/AlloyGameEngine" target="_blank">https://github.com/AlloyTeam/AlloyGameEngine</a></td>
</tr>
<tr>
<td>AlloyDesigner</td>
<td>
<a href="http://alloyteam.github.io/AlloyDesigner" target="_blank">http://alloyteam.github.io/AlloyDesigner</a> 即时修改，即时保存，设计稿较正，其它开发辅助工具</td>
</tr>
<tr>
<td>H5交互页编辑器AEditor介绍</td>
<td>
<a href="http://www.alloyteam.com/2015/06/h5-jiao-hu-ye-bian-ji-qi-aeditor-jie-shao" target="_blank">http://www.alloyteam.com/2015/06/h5-jiao-hu-ye-bian-ji-qi-aeditor-jie-shao</a> H5动画交互页开发的工具介绍</td>
</tr>
<tr>
<td>AEditor</td>
<td>
<a href="http://aeditor.alloyteam.com" target="_blank">http://aeditor.alloyteam.com</a> H5动画交互页开发的工具</td>
</tr>
<tr>
<td>maka</td>
<td><a href="http://forum.maka.im/wordpress" target="_blank">http://forum.maka.im/wordpress</a></td>
</tr>
<tr>
<td>值得订阅的weekly</td>
<td><a href="https://github.com/fenbility/weekly-feed" target="_blank">https://github.com/fenbility/weekly-feed</a></td>
</tr>
<tr>
<td>腾讯html5</td>
<td><a href="http://cube.qq.com" target="_blank">http://cube.qq.com</a></td>
</tr>
<tr>
<td>奇舞团开源项目</td>
<td><a href="http://75team.github.io" target="_blank">http://75team.github.io</a></td>
</tr>
<tr>
<td>Qunar UED</td>
<td><a href="http://ued.qunar.com" target="_blank">http://ued.qunar.com</a></td>
</tr>
<tr>
<td>Scrat</td>
<td><a href="http://scrat.io" target="_blank">http://scrat.io</a></td>
</tr>
</tbody>
</table>
<h3 id="常用">
<a name="t31"></a>常用</h3>
<table>
<thead><tr>
<th>常用</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>ieBetter.js-让IE6-IE8拥有IE9+,Chrome等浏览器特性</td>
<td><a href="http://www.zhangxinxu.com/wordpress/2013/12/iebetter-js-make-ie6-ie8-like-modern-browser-ie9-chrome" target="_blank">http://www.zhangxinxu.com/wordpress/2013/12/iebetter-js-make-ie6-ie8-like-modern-browser-ie9-chrome</a></td>
</tr>
<tr>
<td>模拟键盘</td>
<td><a href="http://mottie.github.io/Keyboard" target="_blank">http://mottie.github.io/Keyboard</a></td>
</tr>
<tr>
<td>拼音</td>
<td><a href="https://github.com/hotoo/pinyin" target="_blank">https://github.com/hotoo/pinyin</a></td>
</tr>
<tr>
<td>中国个人身份证号验证</td>
<td><a href="https://github.com/mc-zone/IDValidator" target="_blank">https://github.com/mc-zone/IDValidator</a></td>
</tr>
</tbody>
</table>
<h3 id="算法">
<a name="t32"></a>算法</h3>
<table>
<thead><tr>
<th>算法</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>数据结构与算法 JavaScript 描述. 章节练习</td>
<td><a href="https://github.com/Ralph-Wang/algorithm.in.js" target="_blank">https://github.com/Ralph-Wang/algorithm.in.js</a></td>
</tr>
<tr>
<td>常见排序算法（JS版）</td>
<td><a href="https://github.com/twobin/twobinSort" target="_blank">https://github.com/twobin/twobinSort</a></td>
</tr>
<tr>
<td>经典排序</td>
<td><a href="https://github.com/luofei2011/jsAgm/blob/master/js/sort.js" target="_blank">https://github.com/luofei2011/jsAgm/blob/master/js/sort.js</a></td>
</tr>
<tr>
<td>常见排序算法-js版本</td>
<td><a href="https://github.com/hechangmin/jssort" target="_blank">https://github.com/hechangmin/jssort</a></td>
</tr>
<tr>
<td>JavaScript 算法与数据结构 精华集</td>
<td><a href="https://github.com/lightningtgc/JavaScript-Algorithms" target="_blank">https://github.com/lightningtgc/JavaScript-Algorithms</a></td>
</tr>
<tr>
<td>面试常考算法题精讲</td>
<td><a href="http://www.nowcoder.com/live/courses" target="_blank">http://www.nowcoder.com/live/courses</a></td>
</tr>
</tbody>
</table>
<h3 id="移动端">
<a name="t33"></a>移动端</h3>
<table>
<thead><tr>
<th>移动端</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>fastclick</td>
<td><a href="https://github.com/ftlabs/fastclick" target="_blank">https://github.com/ftlabs/fastclick</a></td>
</tr>
<tr>
<td>no-click-delay</td>
<td><a href="https://github.com/mmastrac/jquery-noclickdelay" target="_blank">https://github.com/mmastrac/jquery-noclickdelay</a></td>
</tr>
<tr>
<td>【敏捷开发】Android团队开发规范</td>
<td><a href="http://www.cnblogs.com/lcw/p/3619181.html" target="_blank">http://www.cnblogs.com/lcw/p/3619181.html</a></td>
</tr>
<tr>
<td>Android 开发规范与应用</td>
<td><a href="http://www.jianshu.com/p/4390f4fe19b3" target="_blank">http://www.jianshu.com/p/4390f4fe19b3</a></td>
</tr>
<tr>
<td>ionic</td>
<td><a href="https://github.com/ychow/ionic-guide" target="_blank">https://github.com/ychow/ionic-guide</a></td>
</tr>
</tbody>
</table>
<h3 id="json">
<a name="t34"></a>JSON</h3>
<table>
<thead><tr>
<th>JSON</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>模拟生成JSON数据</td>
<td><a href="http://beta.json-generator.com" target="_blank">http://beta.json-generator.com</a></td>
</tr>
<tr>
<td>返回跨域JSONAPI</td>
<td><a href="http://jsonp.afeld.me" target="_blank">http://jsonp.afeld.me</a></td>
</tr>
</tbody>
</table>
<h3 id="焦点图">
<a name="t35"></a>焦点图</h3>
<table>
<thead><tr>
<th>焦点图</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>myfocus</td>
<td><a href="https://github.com/koen301/myfocus" target="_blank">https://github.com/koen301/myfocus</a></td>
</tr>
<tr>
<td>myfocus-官方演示站</td>
<td><a href="http://www.chhua.com/myfocus" target="_blank">http://www.chhua.com/myfocus</a></td>
</tr>
<tr>
<td>SuperSlidev2.1 — 大话主</td>
<td><a href="http://www.superslide2.com" target="_blank">http://www.superslide2.com</a></td>
</tr>
<tr>
<td>soChange</td>
<td><a href="http://www.bujichong.com/sojs/soChange/index.html" target="_blank">http://www.bujichong.com/sojs/soChange/index.html</a></td>
</tr>
</tbody>
</table>
<h3 id="ext-easyui-j-ui-及其它各种ui方案">
<a name="t36"></a>Ext, EasyUI, J-UI 及其它各种UI方案</h3>
<table>
<thead><tr>
<th>Ext, EasyUI, J-UI 及其它各种UI方案</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>extjs</td>
<td><a href="https://www.sencha.com/products/extjs" target="_blank">https://www.sencha.com/products/extjs</a></td>
</tr>
<tr>
<td>ext4英文api</td>
<td><a href="http://docs.sencha.com/extjs/4.0.7" target="_blank">http://docs.sencha.com/extjs/4.0.7</a></td>
</tr>
<tr>
<td>ext4中文api</td>
<td><a href="http://extjs-doc-cn.github.io/ext4api" target="_blank">http://extjs-doc-cn.github.io/ext4api</a></td>
</tr>
<tr>
<td>jquery easyui 未压缩源代码</td>
<td><a href="http://jquery-easyui.googlecode.com/svn/trunk/src" target="_blank">http://jquery-easyui.googlecode.com/svn/trunk/src</a></td>
</tr>
<tr>
<td>J-UI</td>
<td><a href="http://jui.org" target="_blank">http://jui.org</a></td>
</tr>
<tr>
<td>MUI-最接近原生APP体验的高性能前端框架</td>
<td><a href="http://dcloudio.github.io/mui" target="_blank">http://dcloudio.github.io/mui</a></td>
</tr>
<tr>
<td>Amaze UI(中国首个开源 HTML5 跨屏前端框架)</td>
<td><a href="http://amazeui.org" target="_blank">http://amazeui.org</a></td>
</tr>
<tr>
<td>淘宝 HTML5 前端框架</td>
<td><a href="http://m.sui.taobao.org" target="_blank">http://m.sui.taobao.org</a></td>
</tr>
<tr>
<td>KISSY - 阿里前端JavaScript库</td>
<td><a href="http://docs.kissyui.com" target="_blank">http://docs.kissyui.com</a></td>
</tr>
<tr>
<td>网易Nej - Nice Easy Javascript</td>
<td><a href="http://nej.netease.com" target="_blank">http://nej.netease.com</a></td>
</tr>
<tr>
<td>Kendo UI MVVM Demo</td>
<td><a href="http://demos.telerik.com/kendo-ui/mvvm/index" target="_blank">http://demos.telerik.com/kendo-ui/mvvm/index</a></td>
</tr>
<tr>
<td>Bootstrap</td>
<td><a href="http://www.bootcss.com" target="_blank">http://www.bootcss.com</a></td>
</tr>
<tr>
<td>Foundation</td>
<td><a href="http://foundation.zurb.com" target="_blank">http://foundation.zurb.com</a></td>
</tr>
<tr>
<td>Smart UI</td>
<td><a href="http://smartui.chinamzz.com" target="_blank">http://smartui.chinamzz.com</a></td>
</tr>
<tr>
<td>雅虎UI - CSS UI</td>
<td><a href="http://developer.yahoo.com/yui/grids" target="_blank">http://developer.yahoo.com/yui/grids</a></td>
</tr>
</tbody>
</table>
<h3 id="页面-社会化-分享功能">
<a name="t37"></a>页面 社会化 分享功能</h3>
<table>
<thead><tr>
<th>页面 社会化 分享功能</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>百度分享</td>
<td>
<a href="http://share.baidu.com" target="_blank">http://share.baidu.com</a> pc端</td>
</tr>
<tr>
<td>JiaThis</td>
<td>
<a href="http://jiathis.com" target="_blank">http://jiathis.com</a> pc端</td>
</tr>
<tr>
<td>社会化分享组件</td>
<td>
<a href="http://developer.baidu.com/soc/share" target="_blank">http://developer.baidu.com/soc/share</a> 移动端</td>
</tr>
<tr>
<td>ShareSDK 轻松实现社会化功能</td>
<td>
<a href="http://www.mob.com/#/index" target="_blank">http://www.mob.com/#/index</a> 移动端</td>
</tr>
<tr>
<td>友盟分享</td>
<td>
<a href="http://dev.umeng.com/social/android/quick-integration" target="_blank">http://dev.umeng.com/social/android/quick-integration</a> 移动端</td>
</tr>
</tbody>
</table>
<h3 id="富文本编辑器">
<a name="t38"></a>富文本编辑器</h3>
<table>
<thead><tr>
<th>富文本编辑器</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>功能齐全 tinymce</td>
<td><a href="https://www.tinymce.com" target="_blank">https://www.tinymce.com</a></td>
</tr>
<tr>
<td>百度 ueditor</td>
<td><a href="http://ueditor.baidu.com/website" target="_blank">http://ueditor.baidu.com/website</a></td>
</tr>
<tr>
<td>经典的ckeditor</td>
<td><a href="http://ckeditor.com" target="_blank">http://ckeditor.com</a></td>
</tr>
<tr>
<td>经典的kindeditor</td>
<td><a href="http://kindeditor.net" target="_blank">http://kindeditor.net</a></td>
</tr>
<tr>
<td>wysiwyg</td>
<td><a href="http://www.bootcss.com/p/bootstrap-wysiwyg" target="_blank">http://www.bootcss.com/p/bootstrap-wysiwyg</a></td>
</tr>
<tr>
<td>一个有情怀的编辑器。Bach’s Editor</td>
<td><a href="http://integ.github.io/BachEditor" target="_blank">http://integ.github.io/BachEditor</a></td>
</tr>
<tr>
<td>tower用的编辑器</td>
<td><a href="https://github.com/mycolorway/simditor" target="_blank">https://github.com/mycolorway/simditor</a></td>
</tr>
<tr>
<td>summernote 编辑器</td>
<td><a href="https://github.com/summernote/summernote" target="_blank">https://github.com/summernote/summernote</a></td>
</tr>
<tr>
<td>html5编辑器</td>
<td><a href="http://neilj.github.io/Squire" target="_blank">http://neilj.github.io/Squire</a></td>
</tr>
<tr>
<td>Quilljs编辑器</td>
<td><a href="http://quilljs.com" target="_blank">http://quilljs.com</a></td>
</tr>
<tr>
<td>XEditor</td>
<td><a href="http://lab.hustlzp.com/XEditor" target="_blank">http://lab.hustlzp.com/XEditor</a></td>
</tr>
<tr>
<td>wangEditor</td>
<td><a href="https://github.com/wangfupeng1988/wangEditor" target="_blank">https://github.com/wangfupeng1988/wangEditor</a></td>
</tr>
</tbody>
</table>
<h3 id="前端概述">
<a name="t39"></a>前端概述</h3>
<table>
<thead><tr>
<th>前端概述</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>前端工具大全</td>
<td><a href="http://www.awesomes.cn" target="_blank">http://www.awesomes.cn</a></td>
</tr>
<tr>
<td>什么是前端工程化</td>
<td><a href="https://github.com/fouber/blog/issues/10?from=timeline&amp;isappinstalled=0" target="_blank">https://github.com/fouber/blog/issues/10?from=timeline&amp;isappinstalled=0#</a></td>
</tr>
<tr>
<td>[译] 前端攻略-从路人甲到英雄无敌</td>
<td><a href="https://segmentfault.com/a/1190000005174755" target="_blank">https://segmentfault.com/a/1190000005174755</a></td>
</tr>
</tbody>
</table>
<h3 id="gulp">
<a name="t40"></a>Gulp</h3>
<table>
<thead><tr>
<th>Gulp</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>Gulp官网</td>
<td><a href="http://gulpjs.com" target="_blank">http://gulpjs.com</a></td>
</tr>
<tr>
<td>Gulp中文网</td>
<td><a href="http://www.gulpjs.com.cn" target="_blank">http://www.gulpjs.com.cn</a></td>
</tr>
<tr>
<td>gulp资料收集</td>
<td><a href="https://github.com/Platform-CUF/use-gulp" target="_blank">https://github.com/Platform-CUF/use-gulp</a></td>
</tr>
<tr>
<td>Gulp：任务自动管理工具 - ruanyifeng</td>
<td><a href="http://javascript.ruanyifeng.com/tool/gulp.html" target="_blank">http://javascript.ruanyifeng.com/tool/gulp.html</a></td>
</tr>
<tr>
<td>Gulp插件</td>
<td><a href="http://gulpjs.com/plugins" target="_blank">http://gulpjs.com/plugins</a></td>
</tr>
<tr>
<td>Gulp探究折腾之路(I)</td>
<td><a href="http://www.jeffjade.com/2015/11/25/2015-11-25-toss-gulp/" target="_blank">http://www.jeffjade.com/2015/11/25/2015-11-25-toss-gulp/</a></td>
</tr>
<tr>
<td>Gulp折腾之路(II)</td>
<td><a href="http://www.jeffjade.com/2016/01/19/2016-01-19-toss-gulp/" target="_blank">http://www.jeffjade.com/2016/01/19/2016-01-19-toss-gulp/</a></td>
</tr>
<tr>
<td>Gulp不完全入门教程</td>
<td><a href="http://www.ido321.com/1622.html" target="_blank">http://www.ido321.com/1622.html</a></td>
</tr>
<tr>
<td>为什么使用gulp?</td>
<td><a href="https://github.com/hjzheng/CUF_meeting_knowledge_share/issues/33" target="_blank">https://github.com/hjzheng/CUF_meeting_knowledge_share/issues/33</a></td>
</tr>
<tr>
<td>Gulp安装及配合组件构建前端开发一体化</td>
<td><a href="http://www.dbpoo.com/getting-started-with-gulp" target="_blank">http://www.dbpoo.com/getting-started-with-gulp</a></td>
</tr>
<tr>
<td>Gulp 入门指南</td>
<td><a href="https://github.com/nimojs/gulp-book" target="_blank">https://github.com/nimojs/gulp-book</a></td>
</tr>
<tr>
<td>Gulp 入门指南 - nimojs</td>
<td><a href="https://github.com/nimojs/blog/issues/19" target="_blank">https://github.com/nimojs/blog/issues/19</a></td>
</tr>
<tr>
<td>Gulp in Action</td>
<td><a href="http://www.imooc.com/video/5692" target="_blank">http://www.imooc.com/video/5692</a></td>
</tr>
<tr>
<td>Gulp开发教程（翻译）</td>
<td><a href="http://www.w3ctech.com/topic/134" target="_blank">http://www.w3ctech.com/topic/134</a></td>
</tr>
<tr>
<td>前端构建工具gulpjs的使用介绍及技巧</td>
<td><a href="http://www.cnblogs.com/2050/p/4198792.html" target="_blank">http://www.cnblogs.com/2050/p/4198792.html</a></td>
</tr>
</tbody>
</table>
<h3 id="grunt">
<a name="t41"></a>Grunt</h3>
<table>
<thead><tr>
<th>Grunt</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>gruntjs</td>
<td><a href="http://gruntjs.com" target="_blank">http://gruntjs.com</a></td>
</tr>
<tr>
<td>Grunt中文网</td>
<td><a href="http://www.gruntjs.net" target="_blank">http://www.gruntjs.net</a></td>
</tr>
</tbody>
</table>
<h3 id="fis">
<a name="t42"></a>Fis</h3>
<table>
<thead><tr>
<th>Fis</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>fis 官网</td>
<td><a href="http://fex-team.github.io/fis-site/index.html" target="_blank">http://fex-team.github.io/fis-site/index.html</a></td>
</tr>
<tr>
<td>fis</td>
<td><a href="http://fis.baidu.com" target="_blank">http://fis.baidu.com</a></td>
</tr>
</tbody>
</table>
<h3 id="pc图轮">
<a name="t43"></a>pc图轮</h3>
<table>
<thead><tr>
<th>pc图轮</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>单屏轮播sochange</td>
<td><a href="http://www.jsfoot.com/jquery/demo/2011-09-20/192.html" target="_blank">http://www.jsfoot.com/jquery/demo/2011-09-20/192.html</a></td>
</tr>
<tr>
<td>左右按钮多图切换</td>
<td><a href="http://bxslider.com/examples/carousel-demystified" target="_blank">http://bxslider.com/examples/carousel-demystified</a></td>
</tr>
<tr>
<td>fullpage全屏轮播</td>
<td><a href="https://github.com/alvarotrigo/fullPage.js" target="_blank">https://github.com/alvarotrigo/fullPage.js</a></td>
</tr>
</tbody>
</table>
<h3 id="移动端图轮">
<a name="t44"></a>移动端图轮</h3>
<table>
<thead><tr>
<th>移动端图轮</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>无缝切换</td>
<td><a href="http://www.swipejs.com" target="_blank">http://www.swipejs.com</a></td>
</tr>
<tr>
<td>滑屏效果</td>
<td><a href="http://www.idangero.us/swiper" target="_blank">http://www.idangero.us/swiper</a></td>
</tr>
<tr>
<td>全屏fullpage</td>
<td><a href="https://github.com/peunzhang/fullpage" target="_blank">https://github.com/peunzhang/fullpage</a></td>
</tr>
<tr>
<td>单个图片切换</td>
<td><a href="https://github.com/qiqiboy/touchslider" target="_blank">https://github.com/qiqiboy/touchslider</a></td>
</tr>
<tr>
<td>单个全屏切换</td>
<td><a href="https://github.com/peunzhang/slip.js" target="_blank">https://github.com/peunzhang/slip.js</a></td>
</tr>
<tr>
<td>百度的切换库</td>
<td><a href="http://touch.code.baidu.com/examples.html?qq-pf-to=pcqq.group" target="_blank">http://touch.code.baidu.com/examples.html?qq-pf-to=pcqq.group</a></td>
</tr>
<tr>
<td>单个全屏切换</td>
<td><a href="https://github.com/peunzhang/iSlider" target="_blank">https://github.com/peunzhang/iSlider</a></td>
</tr>
<tr>
<td>滑屏效果</td>
<td><a href="https://github.com/saw/touch-interfaces" target="_blank">https://github.com/saw/touch-interfaces</a></td>
</tr>
<tr>
<td>旋转拖动设置</td>
<td><a href="http://baijs.com/tinycircleslider" target="_blank">http://baijs.com/tinycircleslider</a></td>
</tr>
<tr>
<td>类似于swipe切换</td>
<td><a href="http://touchslider.com" target="_blank">http://touchslider.com</a></td>
</tr>
<tr>
<td>支持多种形式的触摸滑动</td>
<td><a href="http://www.swiper.com.cn/demo/index.html" target="_blank">http://www.swiper.com.cn/demo/index.html</a></td>
</tr>
<tr>
<td>滑屏效果</td>
<td><a href="https://github.com/joker-ye/main/blob/master/wap/index.html" target="_blank">https://github.com/joker-ye/main/blob/master/wap/index.html</a></td>
</tr>
<tr>
<td>大话主pc移动图片轮换</td>
<td><a href="http://www.superslide2.com" target="_blank">http://www.superslide2.com</a></td>
</tr>
<tr>
<td>滑屏效果</td>
<td><a href="https://github.com/hahnzhu/parallax.js" target="_blank">https://github.com/hahnzhu/parallax.js</a></td>
</tr>
<tr>
<td>基于zepto的fullpage</td>
<td><a href="https://github.com/yanhaijing/zepto.fullpage" target="_blank">https://github.com/yanhaijing/zepto.fullpage</a></td>
</tr>
<tr>
<td>[WebApp]定宽网页设计下，固定宽度布局开发WebApp并实现多终端下WebApp布局自适应</td>
<td><a href="http://www.cnblogs.com/plums/archive/2013/01/10/WebApp-fixed-width-layout-of-multi-terminal-adapter-since.html" target="_blank">http://www.cnblogs.com/plums/archive/2013/01/10/WebApp-fixed-width-layout-of-multi-terminal-adapter-since.html</a></td>
</tr>
<tr>
<td>判断微信客户端的那些坑</td>
<td><a href="http://loo2k.com/blog/detecting-wechat-client" target="_blank">http://loo2k.com/blog/detecting-wechat-client</a></td>
</tr>
<tr>
<td>可以通过javascript直接调用原生分享的工具</td>
<td><a href="https://github.com/JefferyWang/nativeShare.js" target="_blank">https://github.com/JefferyWang/nativeShare.js</a></td>
</tr>
<tr>
<td>JiaThis 分享到微信代码</td>
<td><a href="http://www.jiathis.com/help/html/weixin-share-code" target="_blank">http://www.jiathis.com/help/html/weixin-share-code</a></td>
</tr>
<tr>
<td>聊聊移动端跨平台开发的各种技术</td>
<td><a href="http://fex.baidu.com/blog/2015/05/cross-mobile" target="_blank">http://fex.baidu.com/blog/2015/05/cross-mobile</a></td>
</tr>
<tr>
<td>前端自动化测试</td>
<td><a href="http://www.zhihu.com/question/29922082" target="_blank">http://www.zhihu.com/question/29922082</a></td>
</tr>
<tr>
<td>多种轮换图片</td>
<td><a href="http://ajccom.github.io/niceslider" target="_blank">http://ajccom.github.io/niceslider</a></td>
</tr>
<tr>
<td>滑动侧边栏</td>
<td><a href="https://mango.github.io/slideout" target="_blank">https://mango.github.io/slideout</a></td>
</tr>
</tbody>
</table>
<h3 id="文件上传">
<a name="t45"></a>文件上传</h3>
<table>
<thead><tr>
<th>文件上传</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>百度上传组件</td>
<td><a href="http://fex.baidu.com/webuploader" target="_blank">http://fex.baidu.com/webuploader</a></td>
</tr>
<tr>
<td>上传</td>
<td><a href="https://blueimp.github.io/jQuery-File-Upload" target="_blank">https://blueimp.github.io/jQuery-File-Upload</a></td>
</tr>
<tr>
<td>flash 头像上传</td>
<td><a href="http://www.hdfu.net" target="_blank">http://www.hdfu.net</a></td>
</tr>
<tr>
<td>图片上传预览</td>
<td><a href="http://www.dropzonejs.com" target="_blank">http://www.dropzonejs.com</a></td>
</tr>
<tr>
<td>图片裁剪</td>
<td><a href="http://elemefe.github.io/image-cropper" target="_blank">http://elemefe.github.io/image-cropper</a></td>
</tr>
<tr>
<td>图片裁剪-shearphoto</td>
<td><a href="http://www.shearphoto.com" target="_blank">http://www.shearphoto.com</a></td>
</tr>
<tr>
<td>jQuery图片处理</td>
<td><a href="http://www.oschina.net/project/tag/284/jquery-image-tools?lang=0&amp;os=0&amp;sort=view&amp;p=2" target="_blank">http://www.oschina.net/project/tag/284/jquery-image-tools?lang=0&amp;os=0&amp;sort=view&amp;p=2</a></td>
</tr>
</tbody>
</table>
<h3 id="模拟select">
<a name="t46"></a>模拟select</h3>
<table>
<thead><tr>
<th>模拟select</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>糖饼 select</td>
<td><a href="http://aui.github.io/popupjs/doc/selectbox.html" target="_blank">http://aui.github.io/popupjs/doc/selectbox.html</a></td>
</tr>
<tr>
<td>flexselect</td>
<td><a href="https://github.com/rmm5t/jquery-flexselect" target="_blank">https://github.com/rmm5t/jquery-flexselect</a></td>
</tr>
<tr>
<td>双select</td>
<td><a href="http://loudev.com" target="_blank">http://loudev.com</a></td>
</tr>
<tr>
<td>select2</td>
<td><a href="http://select2.github.io" target="_blank">http://select2.github.io</a></td>
</tr>
</tbody>
</table>
<h3 id="取色插件">
<a name="t47"></a>取色插件</h3>
<table>
<thead><tr>
<th>取色插件</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>类似 Photoshop 的界面取色插件</td>
<td><a href="http://www.jq22.com/plugin/367" target="_blank">http://www.jq22.com/plugin/367</a></td>
</tr>
<tr>
<td>jquery color</td>
<td><a href="https://github.com/jquery/jquery-color" target="_blank">https://github.com/jquery/jquery-color</a></td>
</tr>
<tr>
<td>取色插件集合</td>
<td><a href="http://www.oschina.net/project/tag/287/color-picker" target="_blank">http://www.oschina.net/project/tag/287/color-picker</a></td>
</tr>
<tr>
<td>farbtastic 圆环＋正方形</td>
<td><a href="https://github.com/mattfarina/farbtastic" target="_blank">https://github.com/mattfarina/farbtastic</a></td>
</tr>
</tbody>
</table>
<h3 id="城市联动">
<a name="t48"></a>城市联动</h3>
<table>
<thead><tr>
<th>城市联动</th>
<th>地址</th>
</tr></thead>
<tbody><tr>
<td>jquery.cityselect.js基于jQuery+JSON的省市或自定义联动效果</td>
<td><a href="http://www.ijquery.cn/?p=360" target="_blank">http://www.ijquery.cn/?p=360</a></td>
</tr></tbody>
</table>
<h3 id="剪贴板">
<a name="t49"></a>剪贴板</h3>
<table>
<thead><tr>
<th>剪贴板</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>剪贴板</td>
<td><a href="https://github.com/zeroclipboard/zeroclipboard" target="_blank">https://github.com/zeroclipboard/zeroclipboard</a></td>
</tr>
<tr>
<td>clipboard 最新的剪切方案</td>
<td><a href="http://zenorocha.github.io/clipboard.js" target="_blank">http://zenorocha.github.io/clipboard.js</a></td>
</tr>
<tr>
<td>不是Flash的剪贴板</td>
<td><a href="https://github.com/zenorocha/clipboard.js" target="_blank">https://github.com/zenorocha/clipboard.js</a></td>
</tr>
</tbody>
</table>
<h3 id="简繁转换">
<a name="t50"></a>简繁转换</h3>
<table>
<thead><tr>
<th>简繁转换</th>
<th>地址</th>
</tr></thead>
<tbody><tr>
<td>简繁转换</td>
<td><a href="https://github.com/BYVoid/OpenCC" target="_blank">https://github.com/BYVoid/OpenCC</a></td>
</tr></tbody>
</table>
<h3 id="表格-grid">
<a name="t51"></a>表格 Grid</h3>
<table>
<thead><tr>
<th>表格 Grid</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>facebook表格</td>
<td><a href="http://facebook.github.io/fixed-data-table" target="_blank">http://facebook.github.io/fixed-data-table</a></td>
</tr>
<tr>
<td>类似于Excel编辑表格-handsontable</td>
<td><a href="http://handsontable.com" target="_blank">http://handsontable.com</a></td>
</tr>
<tr>
<td>bootstrap-table插件</td>
<td><a href="http://bootstrap-table.wenzhixin.net.cn" target="_blank">http://bootstrap-table.wenzhixin.net.cn</a></td>
</tr>
<tr>
<td>datatables</td>
<td><a href="https://www.datatables.net" target="_blank">https://www.datatables.net</a></td>
</tr>
</tbody>
</table>
<h3 id="在线演示">
<a name="t52"></a>在线演示</h3>
<table>
<thead><tr>
<th>在线演示</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>js 在线编辑 - runjs</td>
<td><a href="http://runjs.cn" target="_blank">http://runjs.cn</a></td>
</tr>
<tr>
<td>js 在线编辑 - jsbin</td>
<td><a href="http://jsbin.com" target="_blank">http://jsbin.com</a></td>
</tr>
<tr>
<td>js 在线编辑 - codepen</td>
<td><a href="http://codepen.io" target="_blank">http://codepen.io</a></td>
</tr>
<tr>
<td>js 在线编辑 - jsfiddle</td>
<td><a href="http://jsfiddle.net" target="_blank">http://jsfiddle.net</a></td>
</tr>
<tr>
<td>java 在线编辑 - runjs</td>
<td><a href="http://ideone.com" target="_blank">http://ideone.com</a></td>
</tr>
<tr>
<td>js 在线编辑 - hcharts</td>
<td><a href="http://code.hcharts.cn" target="_blank">http://code.hcharts.cn</a></td>
</tr>
<tr>
<td>js 在线编辑 - jsdm</td>
<td><a href="http://jsdm.com" target="_blank">http://jsdm.com</a></td>
</tr>
<tr>
<td>sql 在线编辑 - sqlfiddle</td>
<td><a href="http://sqlfiddle.com" target="_blank">http://sqlfiddle.com</a></td>
</tr>
<tr>
<td>mozilla 在线编辑器</td>
<td><a href="https://thimble.mozilla.org" target="_blank">https://thimble.mozilla.org</a></td>
</tr>
</tbody>
</table>
<h3 id="常规优化">
<a name="t53"></a>常规优化</h3>
<table>
<thead><tr>
<th>常规优化</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>Javascript高性能动画与页面渲染</td>
<td><a href="http://www.infoq.com/cn/articles/javascript-high-performance-animation-and-page-rendering" target="_blank">http://www.infoq.com/cn/articles/javascript-high-performance-animation-and-page-rendering</a></td>
</tr>
<tr>
<td>移动H5前端性能优化指南</td>
<td><a href="http://isux.tencent.com/h5-performance.html" target="_blank">http://isux.tencent.com/h5-performance.html</a></td>
</tr>
<tr>
<td>5173首页前端性能优化实践</td>
<td><a href="http://ued.5173.com/?p=1731" target="_blank">http://ued.5173.com/?p=1731</a></td>
</tr>
<tr>
<td>给网页设计师和前端开发者看的前端性能优化</td>
<td><a href="http://www.uisdc.com/front-end-performance-for-web-designers-and-front-end-developers" target="_blank">http://www.uisdc.com/front-end-performance-for-web-designers-and-front-end-developers</a></td>
</tr>
<tr>
<td>复杂应用的 CSS 性能分析和优化建议</td>
<td><a href="http://www.orzpoint.com/profiling-css-and-optimization-notes" target="_blank">http://www.orzpoint.com/profiling-css-and-optimization-notes</a></td>
</tr>
<tr>
<td>张鑫旭——前端性能</td>
<td><a href="http://www.zhangxinxu.com/wordpress/tag/%E5%89%8D%E7%AB%AF%E6%80%A7%E8%83%BD/" target="_blank">http://www.zhangxinxu.com/wordpress/tag/%E5%89%8D%E7%AB%AF%E6%80%A7%E8%83%BD/</a></td>
</tr>
<tr>
<td>前端性能监控总结</td>
<td><a href="http://www.xiaoqiang.org/javascript/font-end-performance-monitor.html" target="_blank">http://www.xiaoqiang.org/javascript/font-end-performance-monitor.html</a></td>
</tr>
<tr>
<td>web前端性能优化进阶路</td>
<td><a href="http://www.aliued.cn/2013/01/20/web%E5%89%8D%E7%AB%AF%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96%E8%BF%9B%E9%98%B6%E8%B7%AF.html" target="_blank">http://www.aliued.cn/2013/01/20/web%E5%89%8D%E7%AB%AF%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96%E8%BF%9B%E9%98%B6%E8%B7%AF.html</a></td>
</tr>
<tr>
<td>前端技术：网站性能优化之CSS无图片技术</td>
<td><a href="http://my.eoe.cn/tuwandou/archive/4544.html" target="_blank">http://my.eoe.cn/tuwandou/archive/4544.html</a></td>
</tr>
<tr>
<td>浏览器的加载与页面性能优化</td>
<td><a href="http://www.baiduux.com/blog/2011/02/15/browser-loading" target="_blank">http://www.baiduux.com/blog/2011/02/15/browser-loading</a></td>
</tr>
<tr>
<td>页面加载中的图片性能优化</td>
<td><a href="http://www.w3ctech.com/p/1503" target="_blank">http://www.w3ctech.com/p/1503</a></td>
</tr>
<tr>
<td>Hey——前端性能</td>
<td><a href="http://www.feelcss.com/tag/%E5%89%8D%E7%AB%AF%E6%80%A7%E8%83%BD" target="_blank">http://www.feelcss.com/tag/%E5%89%8D%E7%AB%AF%E6%80%A7%E8%83%BD</a></td>
</tr>
<tr>
<td>html优化</td>
<td><a href="http://fex.baidu.com/" target="_blank">http://fex.baidu.com/</a></td>
</tr>
<tr>
<td>Yslow——性能优化</td>
<td><a href="http://www.yslow.net/category.php?cid=20" target="_blank">http://www.yslow.net/category.php?cid=20</a></td>
</tr>
<tr>
<td>YSLOW中文介绍</td>
<td><a href="http://www.cnblogs.com/yslow" target="_blank">http://www.cnblogs.com/yslow</a></td>
</tr>
<tr>
<td>转一篇Yahoo关于网站性能优化的文章，兼谈本站要做的优化</td>
<td><a href="http://www.360ito.com/article/40.html" target="_blank">http://www.360ito.com/article/40.html</a></td>
</tr>
<tr>
<td>Yahoo!团队实践分享：网站性能</td>
<td><a href="http://www.360doc.com/content/10/0928/09/2588264_56971287.shtml" target="_blank">http://www.360doc.com/content/10/0928/09/2588264_56971287.shtml</a></td>
</tr>
<tr>
<td>网站性能优化指南：什么使我们的网站变慢？</td>
<td><a href="http://blog.jiasule.com/i/153" target="_blank">http://blog.jiasule.com/i/153</a></td>
</tr>
<tr>
<td>网站性能优化实践，减少加载时间，提高用户体验</td>
<td><a href="http://www.powereasy.net/helpyou/knowledge/ecommerce/9593.html" target="_blank">http://www.powereasy.net/helpyou/knowledge/ecommerce/9593.html</a></td>
</tr>
<tr>
<td>浅谈网站性能优化 前端篇</td>
<td><a href="http://www.umtry.com/archives/747.html" target="_blank">http://www.umtry.com/archives/747.html</a></td>
</tr>
<tr>
<td>前端重构实践之如何对网站性能优化？</td>
<td><a href="http://www.adinnet.cn/blog/designview/2012-7-12/678.html" target="_blank">http://www.adinnet.cn/blog/designview/2012-7-12/678.html</a></td>
</tr>
<tr>
<td>前端性能优化：使用媒体查询加载指定大小的背景图片</td>
<td><a href="http://www.gbin1.com/technology/javascript/20130708-front-end-performance-optimization-9" target="_blank">http://www.gbin1.com/technology/javascript/20130708-front-end-performance-optimization-9</a></td>
</tr>
<tr>
<td>网站性能系列博文</td>
<td><a href="http://www.mykuer.com/post/factors-that-affect-the-speed-of-web-site-open.html" target="_blank">http://www.mykuer.com/post/factors-that-affect-the-speed-of-web-site-open.html</a></td>
</tr>
<tr>
<td>加载，不只是少一点点</td>
<td><a href="http://tgideas.qq.com/webplat/info/news_version3/804/808/811/m579/201109/41355.shtml" target="_blank">http://tgideas.qq.com/webplat/info/news_version3/804/808/811/m579/201109/41355.shtml</a></td>
</tr>
<tr>
<td>前端性能的测试与优化</td>
<td><a href="http://mzhou.me/article/95310" target="_blank">http://mzhou.me/article/95310</a></td>
</tr>
<tr>
<td>分享网页加载速度优化的一些技巧？</td>
<td><a href="http://www.gbin1.com/technology/html/20130217-tips-for-speed-up-page-loading" target="_blank">http://www.gbin1.com/technology/html/20130217-tips-for-speed-up-page-loading</a></td>
</tr>
<tr>
<td>页面加载中的图片性能优化</td>
<td><a href="http://www.f2es.com/images-bytes-opt" target="_blank">http://www.f2es.com/images-bytes-opt</a></td>
</tr>
<tr>
<td>web前端优化(基于Yslow</td>
<td><a href="http://www.tcreator.info/webSchool/website/Front-end-Opt-Yslow.html" target="_blank">http://www.tcreator.info/webSchool/website/Front-end-Opt-Yslow.html</a></td>
</tr>
<tr>
<td>网站性能优化工具大全</td>
<td><a href="https://www.qianduan.net/website-performance-optimization-tool.html" target="_blank">https://www.qianduan.net/website-performance-optimization-tool.html</a></td>
</tr>
<tr>
<td>【高性能前端1】高性能HTML</td>
<td><a href="http://www.alloyteam.com/2012/10/high-performance-html" target="_blank">http://www.alloyteam.com/2012/10/high-performance-html</a></td>
</tr>
<tr>
<td>【高性能前端2】高性能CSS</td>
<td><a href="http://www.alloyteam.com/2012/10/high-performance-css" target="_blank">http://www.alloyteam.com/2012/10/high-performance-css</a></td>
</tr>
<tr>
<td>由12306谈谈网站前端性能和后端性能优化</td>
<td><a href="http://coolshell.cn/articles/6470.html" target="_blank">http://coolshell.cn/articles/6470.html</a></td>
</tr>
<tr>
<td>AlloyTeam——前端优化</td>
<td><a href="http://www.alloyteam.com/webfrontend/%E5%89%8D%E7%AB%AF%E4%BC%98%E5%8C%96" target="_blank">http://www.alloyteam.com/webfrontend/%E5%89%8D%E7%AB%AF%E4%BC%98%E5%8C%96</a></td>
</tr>
<tr>
<td>毫秒必争，前端网页性能最佳实践</td>
<td><a href="http://www.cnblogs.com/developersupport/p/3248695.html" target="_blank">http://www.cnblogs.com/developersupport/p/3248695.html</a></td>
</tr>
<tr>
<td>网站性能工具Yslow的使用方法</td>
<td><a href="http://blog.sina.com.cn/s/blog_6e9d2e0701017kvu.html" target="_blank">http://blog.sina.com.cn/s/blog_6e9d2e0701017kvu.html</a></td>
</tr>
<tr>
<td>前端工程与性能优化（上）：静态资源版本更新与缓存</td>
<td><a href="http://www.infoq.com/cn/articles/front-end-engineering-and-performance-optimization-part1" target="_blank">http://www.infoq.com/cn/articles/front-end-engineering-and-performance-optimization-part1</a></td>
</tr>
<tr>
<td>前端工程与性能优化（下）：静态资源管理与模板框架</td>
<td><a href="http://www.infoq.com/cn/articles/front-end-engineering-and-performance-optimization-part2" target="_blank">http://www.infoq.com/cn/articles/front-end-engineering-and-performance-optimization-part2</a></td>
</tr>
<tr>
<td>HTTPS连接的前几毫秒发生了什么</td>
<td><a href="http://blog.jobbole.com/48369" target="_blank">http://blog.jobbole.com/48369</a></td>
</tr>
<tr>
<td>Yslow</td>
<td><a href="http://uicss.cn/yslow/#more-12319" target="_blank">http://uicss.cn/yslow/#more-12319</a></td>
</tr>
<tr>
<td>Essential Web Performance Metrics — A Primer, Part 1</td>
<td><a href="http://blog.smartbear.com/web-performance/essential-web-performance-metrics-a-primer-part-1" target="_blank">http://blog.smartbear.com/web-performance/essential-web-performance-metrics-a-primer-part-1</a></td>
</tr>
<tr>
<td>Essential Web Performance Metrics — Part 2</td>
<td><a href="http://blog.smartbear.com/performance/essential-web-performance-metrics-part-2" target="_blank">http://blog.smartbear.com/performance/essential-web-performance-metrics-part-2</a></td>
</tr>
<tr>
<td>YUISlide,针对移动设备的动画性能优化</td>
<td><a href="http://jayli.github.io/blog/data/2011/12/23/yuislide.html" target="_blank">http://jayli.github.io/blog/data/2011/12/23/yuislide.html</a></td>
</tr>
<tr>
<td>Improving Site Performance</td>
<td><a href="http://joelglovier.com/improving-site-performance" target="_blank">http://joelglovier.com/improving-site-performance</a></td>
</tr>
<tr>
<td>让网站提速的最佳前端实践</td>
<td><a href="http://segmentfault.com/a/1190000000367899" target="_blank">http://segmentfault.com/a/1190000000367899</a></td>
</tr>
<tr>
<td>Why Website Speed is Important</td>
<td><a href="http://sixrevisions.com/web-development/why-website-speed-is-important" target="_blank">http://sixrevisions.com/web-development/why-website-speed-is-important</a></td>
</tr>
<tr>
<td>Need for Speed – How to Improve your Website Performance</td>
<td><a href="https://www.devbridge.com/articles/need-for-speed-how-to-improve-your-website-performance" target="_blank">https://www.devbridge.com/articles/need-for-speed-how-to-improve-your-website-performance</a></td>
</tr>
<tr>
<td>阿里无线前端性能优化指南 (Pt.1 加载期优化</td>
<td><a href="https://github.com/amfe/article/issues/1" target="_blank">https://github.com/amfe/article/issues/1</a></td>
</tr>
</tbody>
</table>
<h3 id="优化工具">
<a name="t54"></a>优化工具</h3>
<table>
<thead><tr>
<th>优化工具</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>JavaScript 性能分析新工具 OneProfile</td>
<td><a href="http://www.html-js.com/article/3083" target="_blank">http://www.html-js.com/article/3083</a></td>
</tr>
<tr>
<td>JavaScript 堆内存分析新工具 OneHeap</td>
<td><a href="http://www.html-js.com/article/3091" target="_blank">http://www.html-js.com/article/3091</a></td>
</tr>
</tbody>
</table>
<h3 id="前端架构">
<a name="t55"></a>前端架构</h3>
<table>
<thead><tr>
<th>前端架构</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>技术架构</td>
<td><a href="http://www.zhihu.com/topic/19612641" target="_blank">http://www.zhihu.com/topic/19612641</a></td>
</tr>
<tr>
<td>前端架构</td>
<td><a href="http://saito.im/note/The-Architecture-of-F2E" target="_blank">http://saito.im/note/The-Architecture-of-F2E</a></td>
</tr>
<tr>
<td>如何成为前端架构师</td>
<td><a href="http://www.zhihu.com/question/24092572" target="_blank">http://www.zhihu.com/question/24092572</a></td>
</tr>
<tr>
<td>关于前端架构-张克军</td>
<td><a href="http://hikejun.com/sharing/2010webrebuild/?file=fe-infrastructure.html" target="_blank">http://hikejun.com/sharing/2010webrebuild/?file=fe-infrastructure.html</a></td>
</tr>
<tr>
<td>百度腾讯offer比较（腾讯游戏VS百度基础架构）</td>
<td><a href="http://www.zhihu.com/question/25583350" target="_blank">http://www.zhihu.com/question/25583350</a></td>
</tr>
</tbody>
</table>
<h3 id="推荐作品">
<a name="t56"></a>推荐作品</h3>
<table>
<thead><tr>
<th>推荐作品</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>winter代码片段需要墙</td>
<td><a href="https://gist.github.com/wintercn" target="_blank">https://gist.github.com/wintercn</a></td>
</tr>
<tr>
<td>fgm</td>
<td><a href="http://www.fgm.cc/learn" target="_blank">http://www.fgm.cc/learn</a></td>
</tr>
<tr>
<td>岑安作品集</td>
<td><a href="https://github.com/hongru/hongru.github.com" target="_blank">https://github.com/hongru/hongru.github.com</a></td>
</tr>
<tr>
<td>当耐特demo集合</td>
<td><a href="http://kmdjs.github.io" target="_blank">http://kmdjs.github.io</a></td>
</tr>
<tr>
<td>米空格 js作品</td>
<td><a href="http://www.laoshu133.com/Lab" target="_blank">http://www.laoshu133.com/Lab</a></td>
</tr>
<tr>
<td>myFocus</td>
<td><a href="http://koen301.github.io" target="_blank">http://koen301.github.io</a></td>
</tr>
<tr>
<td>SeaJS组件库</td>
<td><a href="http://panxuepeng.github.io/seajslib" target="_blank">http://panxuepeng.github.io/seajslib</a></td>
</tr>
<tr>
<td>颜海镜作品</td>
<td><a href="http://yanhaijing.com/myProject" target="_blank">http://yanhaijing.com/myProject</a></td>
</tr>
<tr>
<td>脚儿网作品</td>
<td><a href="http://jo2.org/category/myworks" target="_blank">http://jo2.org/category/myworks</a></td>
</tr>
<tr>
<td>javascript个人作品</td>
<td><a href="http://www.cnitblog.com/yemoo/category/3107.html" target="_blank">http://www.cnitblog.com/yemoo/category/3107.html</a></td>
</tr>
<tr>
<td>妙味的雷东升游戏作品</td>
<td><a href="http://bbs.miaov.com/forum.php?mod=viewthread&amp;tid=7790" target="_blank">http://bbs.miaov.com/forum.php?mod=viewthread&amp;tid=7790</a></td>
</tr>
<tr>
<td>javascript作品集</td>
<td><a href="http://bbs.csdn.net/topics/380227212" target="_blank">http://bbs.csdn.net/topics/380227212</a></td>
</tr>
<tr>
<td>云五笔，灰度产生生成工具</td>
<td><a href="https://github.com/TooBug/works" target="_blank">https://github.com/TooBug/works</a></td>
</tr>
<tr>
<td>项目主页</td>
<td><a href="http://koen301.github.io" target="_blank">http://koen301.github.io</a></td>
</tr>
<tr>
<td>个性的作品主页</td>
<td><a href="http://zaole.net" target="_blank">http://zaole.net</a></td>
</tr>
<tr>
<td>播放器</td>
<td><a href="http://static.tingall.com/v2/player" target="_blank">http://static.tingall.com/v2/player</a></td>
</tr>
<tr>
<td>ucren js demos 集</td>
<td><a href="http://ucren.com/blog/demos" target="_blank">http://ucren.com/blog/demos</a></td>
</tr>
<tr>
<td>智能社</td>
<td><a href="http://www.zhinengshe.com/works_list.html" target="_blank">http://www.zhinengshe.com/works_list.html</a></td>
</tr>
<tr>
<td>实例陈列架</td>
<td><a href="http://demos.shizuwu.cn" target="_blank">http://demos.shizuwu.cn</a></td>
</tr>
<tr>
<td>zoye demo</td>
<td><a href="http://zoye.sinaapp.com/demo" target="_blank">http://zoye.sinaapp.com/demo</a></td>
</tr>
<tr>
<td>王员外</td>
<td><a href="http://lab.yuanwai.wang" target="_blank">http://lab.yuanwai.wang</a></td>
</tr>
<tr>
<td>平凡</td>
<td><a href="http://pingfan1990.sinaapp.com" target="_blank">http://pingfan1990.sinaapp.com</a></td>
</tr>
<tr>
<td>jyg 游戏案例</td>
<td><a href="http://www.lovewebgames.com" target="_blank">http://www.lovewebgames.com</a></td>
</tr>
<tr>
<td>很多jquery插件</td>
<td><a href="http://www.helloweba.com/list.html" target="_blank">http://www.helloweba.com/list.html</a></td>
</tr>
<tr>
<td>不羁虫 - soJs 作品系列</td>
<td><a href="http://www.bujichong.com/sojs/api/index.html" target="_blank">http://www.bujichong.com/sojs/api/index.html</a></td>
</tr>
<tr>
<td>frozenui</td>
<td><a href="http://frozenui.github.io/case.html" target="_blank">http://frozenui.github.io/case.html</a></td>
</tr>
<tr>
<td>黑白棋</td>
<td><a href="http://js-game.github.io/othello" target="_blank">http://js-game.github.io/othello</a></td>
</tr>
<tr>
<td>fromone</td>
<td><a href="http://yansm.github.io/fromone/index.html" target="_blank">http://yansm.github.io/fromone/index.html</a></td>
</tr>
<tr>
<td>pazguille</td>
<td><a href="http://pazguille.me" target="_blank">http://pazguille.me</a></td>
</tr>
<tr>
<td>Html5 VideoPlayer</td>
<td><a href="https://github.com/zmmbreeze/DeadSimpleVideoPlayer" target="_blank">https://github.com/zmmbreeze/DeadSimpleVideoPlayer</a></td>
</tr>
<tr>
<td>Proton 烟花</td>
<td><a href="http://a-jie.github.io/Proton/#example" target="_blank">http://a-jie.github.io/Proton/#example</a></td>
</tr>
</tbody>
</table>
<h3 id="简历模板">
<a name="t57"></a>简历模板</h3>
<table>
<thead><tr>
<th>简历模板</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>简历</td>
<td><a href="http://hcy2367.github.io/resume" target="_blank">http://hcy2367.github.io/resume</a></td>
</tr>
<tr>
<td>张伦</td>
<td><a href="http://ncuey.sinaapp.com/CrispElite/" target="_blank">http://ncuey.sinaapp.com/CrispElite/</a></td>
</tr>
<tr>
<td>简历</td>
<td><a href="https://github.com/hacke2/ResumeSample" target="_blank">https://github.com/hacke2/ResumeSample</a></td>
</tr>
<tr>
<td>马斯特</td>
<td><a href="http://pinkyjie.com/resume" target="_blank">http://pinkyjie.com/resume</a></td>
</tr>
<tr>
<td>张秋怡</td>
<td><a href="https://joyeecheung.github.io/resume/" target="_blank">https://joyeecheung.github.io/resume/</a></td>
</tr>
<tr>
<td>翁天信</td>
<td><a href="http://blog.dandyweng.com/2013/07/how-my-website-was-created" target="_blank">http://blog.dandyweng.com/2013/07/how-my-website-was-created</a></td>
</tr>
<tr>
<td>动画方式的简历</td>
<td><a href="http://www.webhek.com/misc/interactive-resume" target="_blank">http://www.webhek.com/misc/interactive-resume</a></td>
</tr>
<tr>
<td>组件丰富简历</td>
<td><a href="http://www.linqing07.com/resume.html" target="_blank">http://www.linqing07.com/resume.html</a></td>
</tr>
<tr>
<td>haorooms博客</td>
<td><a href="http://www.haorooms.com/about" target="_blank">http://www.haorooms.com/about</a></td>
</tr>
</tbody>
</table>
<h3 id="面试题">
<a name="t58"></a>面试题</h3>
<table>
<thead><tr>
<th>面试题</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>那几个月在找工作（百度，网易游戏）</td>
<td><a href="http://www.nowcoder.com/discuss/3196" target="_blank">http://www.nowcoder.com/discuss/3196</a></td>
</tr>
<tr>
<td>2014最新面试题</td>
<td><a href="http://www.html-js.com/article/1743" target="_blank">http://www.html-js.com/article/1743</a></td>
</tr>
<tr>
<td>2016校招内推 — 阿里巴巴前端 — 三面面试经历</td>
<td><a href="http://www.cnblogs.com/imwtr/p/4685546.html" target="_blank">http://www.cnblogs.com/imwtr/p/4685546.html</a></td>
</tr>
<tr>
<td>年后跳槽那点事：乐视+金山+360面试之行</td>
<td><a href="http://www.cnblogs.com/lvdabao/p/3660707.html" target="_blank">http://www.cnblogs.com/lvdabao/p/3660707.html</a></td>
</tr>
<tr>
<td>Interviewing a front-end developer</td>
<td><a href="http://blog.sourcing.io/interview-questions" target="_blank">http://blog.sourcing.io/interview-questions</a></td>
</tr>
<tr>
<td>拉勾网js面试题</td>
<td><a href="http://www.cnblogs.com/52cik/p/js-question-lg.html" target="_blank">http://www.cnblogs.com/52cik/p/js-question-lg.html</a></td>
</tr>
<tr>
<td>前端面试</td>
<td><a href="http://www.cnblogs.com/allenxing/p/3724382.html" target="_blank">http://www.cnblogs.com/allenxing/p/3724382.html</a></td>
</tr>
<tr>
<td>Web开发笔试面试题 大全</td>
<td><a href="http://mianshiti.diandian.com" target="_blank">http://mianshiti.diandian.com</a></td>
</tr>
<tr>
<td>前端开发面试题</td>
<td><a href="http://segmentfault.com/a/1190000000465431" target="_blank">http://segmentfault.com/a/1190000000465431</a></td>
</tr>
<tr>
<td>2014最新前端面试题</td>
<td><a href="https://github.com/markyun/My-blog/tree/master/Front-end-Developer-Questions" target="_blank">https://github.com/markyun/My-blog/tree/master/Front-end-Developer-Questions</a></td>
</tr>
<tr>
<td>百度面试</td>
<td><a href="https://github.com/fex-team/interview-questions" target="_blank">https://github.com/fex-team/interview-questions</a></td>
</tr>
<tr>
<td>面试题</td>
<td><a href="http://www.w3cfuns.com/forum.php?mod=forumdisplay&amp;fid=51&amp;filter=typeid&amp;typeid=177" target="_blank">http://www.w3cfuns.com/forum.php?mod=forumdisplay&amp;fid=51&amp;filter=typeid&amp;typeid=177</a></td>
</tr>
<tr>
<td>前端工作面试问题</td>
<td><a href="https://github.com/darcyclarke/Front-end-Developer-Interview-Questions/tree/master/Chinese" target="_blank">https://github.com/darcyclarke/Front-end-Developer-Interview-Questions/tree/master/Chinese</a></td>
</tr>
<tr>
<td>前端开发面试题</td>
<td><a href="http://segmentfault.com/a/1190000000465431" target="_blank">http://segmentfault.com/a/1190000000465431</a></td>
</tr>
<tr>
<td>5个经典的前端面试问题</td>
<td><a href="http://ourjs.com/detail/5%E4%B8%AA%E7%BB%8F%E5%85%B8%E7%9A%84%E5%89%8D%E7%AB%AF%E9%9D%A2%E8%AF%95%E9%97%AE%E9%A2%98" target="_blank">http://ourjs.com/detail/5%E4%B8%AA%E7%BB%8F%E5%85%B8%E7%9A%84%E5%89%8D%E7%AB%AF%E9%9D%A2%E8%AF%95%E9%97%AE%E9%A2%98</a></td>
</tr>
<tr>
<td>最全前端面试问题及答案总结</td>
<td><a href="http://segmentfault.com/a/1190000002562454" target="_blank">http://segmentfault.com/a/1190000002562454</a></td>
</tr>
<tr>
<td>如何面试一名前端开发工程师？</td>
<td><a href="http://www.html-js.com/article/Large-search-front-team-column%202961" target="_blank">http://www.html-js.com/article/Large-search-front-team-column%202961</a></td>
</tr>
<tr>
<td>史上最全 前端开发面试问题及答案整理</td>
<td><a href="https://github.com/hawx1993/Front-end-Interview-questions" target="_blank">https://github.com/hawx1993/Front-end-Interview-questions</a></td>
</tr>
<tr>
<td>前端实习生面试总结</td>
<td><a href="http://www.cnblogs.com/xiaoruo/p/4665163.html" target="_blank">http://www.cnblogs.com/xiaoruo/p/4665163.html</a></td>
</tr>
<tr>
<td>史上最全 前端开发面试问题及答案整理</td>
<td><a href="https://github.com/hawx1993/Front-end-Interview-questions" target="_blank">https://github.com/hawx1993/Front-end-Interview-questions</a></td>
</tr>
<tr>
<td>BAT及各大互联网公司2014前端笔试面试题：JavaScript篇</td>
<td><a href="http://blog.jobbole.com/78738" target="_blank">http://blog.jobbole.com/78738</a></td>
</tr>
<tr>
<td>前端开发面试题大收集</td>
<td><a href="https://github.com/paddingme/Front-end-Web-Development-Interview-Question" target="_blank">https://github.com/paddingme/Front-end-Web-Development-Interview-Question</a></td>
</tr>
<tr>
<td>收集的前端面试题和答案</td>
<td><a href="https://github.com/qiu-deqing/FE-interview" target="_blank">https://github.com/qiu-deqing/FE-interview</a></td>
</tr>
<tr>
<td>如何面试前端工程师</td>
<td><a href="http://www.zhihu.com/question/19568008" target="_blank">http://www.zhihu.com/question/19568008</a></td>
</tr>
<tr>
<td>前端开发面试题</td>
<td><a href="https://github.com/markyun/My-blog/blob/master/Front-end-Developer-Questions/Questions-and-Answers/README.md" target="_blank">https://github.com/markyun/My-blog/blob/master/Front-end-Developer-Questions/Questions-and-Answers/README.md</a></td>
</tr>
<tr>
<td>牛客网-笔试面经</td>
<td><a href="http://www.nowcoder.com/discuss?type=2" target="_blank">http://www.nowcoder.com/discuss?type=2</a></td>
</tr>
</tbody>
</table>
<h3 id="iconfont">
<a name="t59"></a>iconfont</h3>
<table>
<thead><tr>
<th>iconfont</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>中文字体</td>
<td><a href="http://www.zhihu.com/question/21253343" target="_blank">http://www.zhihu.com/question/21253343</a></td>
</tr>
<tr>
<td>淘宝字库</td>
<td><a href="http://iconfont.cn" target="_blank">http://iconfont.cn</a></td>
</tr>
<tr>
<td>字体</td>
<td><a href="http://mux.alimama.com/fonts" target="_blank">http://mux.alimama.com/fonts</a></td>
</tr>
<tr>
<td>制作教程</td>
<td><a href="http://iconfont.cn/help/platform.html" target="_blank">http://iconfont.cn/help/platform.html</a></td>
</tr>
<tr>
<td>zhangxinxu-icommon</td>
<td><a href="http://www.zhangxinxu.com/wordpress/?s=icomoon" target="_blank">http://www.zhangxinxu.com/wordpress/?s=icomoon</a></td>
</tr>
<tr>
<td>icommon</td>
<td><a href="https://icomoon.io/app" target="_blank">https://icomoon.io/app</a></td>
</tr>
<tr>
<td>用字体在网页中画ICON图标(推荐教程</td>
<td><a href="http://imooc.com/learn/243" target="_blank">http://imooc.com/learn/243</a></td>
</tr>
<tr>
<td>字体压缩工具</td>
<td><a href="http://font-spider.org" target="_blank">http://font-spider.org</a></td>
</tr>
</tbody>
</table>
<h3 id="fiddler">
<a name="t60"></a>Fiddler</h3>
<table>
<thead><tr>
<th>Fiddler</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>Fiddler调式使用知多少(一深入研究</td>
<td><a href="http://www.cnblogs.com/tugenhua0707/p/4623317.html" target="_blank">http://www.cnblogs.com/tugenhua0707/p/4623317.html</a></td>
</tr>
<tr>
<td>微信fiddle</td>
<td><a href="http://www.cnblogs.com/strick/p/4570006.html" target="_blank">http://www.cnblogs.com/strick/p/4570006.html</a></td>
</tr>
<tr>
<td>微信fiddle</td>
<td><a href="http://gaoboy.com/article/26.html" target="_blank">http://gaoboy.com/article/26.html</a></td>
</tr>
</tbody>
</table>
<h3 id="chrome">
<a name="t61"></a>Chrome</h3>
<table>
<thead><tr>
<th>Chrome</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>Google Chrome 官方</td>
<td><a href="https://developer.chrome.com/devtools" target="_blank">https://developer.chrome.com/devtools</a></td>
</tr>
<tr>
<td>Chrome - 基础</td>
<td><a href="http://www.cnblogs.com/constantince/p/4565261.html" target="_blank">http://www.cnblogs.com/constantince/p/4565261.html</a></td>
</tr>
<tr>
<td>Chrome - 进阶</td>
<td><a href="http://www.cnblogs.com/constantince/p/4579121.html" target="_blank">http://www.cnblogs.com/constantince/p/4579121.html</a></td>
</tr>
<tr>
<td>Chrome - 性能</td>
<td><a href="http://www.cnblogs.com/constantince/p/4585983.html" target="_blank">http://www.cnblogs.com/constantince/p/4585983.html</a></td>
</tr>
<tr>
<td>Chrome - 性能进阶</td>
<td><a href="http://www.cnblogs.com/constantince/p/4607497.html" target="_blank">http://www.cnblogs.com/constantince/p/4607497.html</a></td>
</tr>
<tr>
<td>Chrome - 移动</td>
<td><a href="http://www.cnblogs.com/constantince/p/4624241.html" target="_blank">http://www.cnblogs.com/constantince/p/4624241.html</a></td>
</tr>
<tr>
<td>Chrome - 使用技巧</td>
<td><a href="http://www.cnblogs.com/liyunhua/p/4544738.html" target="_blank">http://www.cnblogs.com/liyunhua/p/4544738.html</a></td>
</tr>
<tr>
<td>Chrome - Console控制台不完全指南</td>
<td><a href="http://www.cnblogs.com/Wayou/p/chrome-console-tips-and-tricks.html" target="_blank">http://www.cnblogs.com/Wayou/p/chrome-console-tips-and-tricks.html</a></td>
</tr>
<tr>
<td>Chrome - Workspace使浏览器变成IDE</td>
<td><a href="http://c7sky.com/chrome-devtools-workspace.html" target="_blank">http://c7sky.com/chrome-devtools-workspace.html</a></td>
</tr>
<tr>
<td>network面板</td>
<td><a href="http://www.html-js.com/article/Nothing-blind%202975" target="_blank">http://www.html-js.com/article/Nothing-blind%202975</a></td>
</tr>
<tr>
<td>chrome开发工具快捷键</td>
<td><a href="http://anti-code.com/devtools-cheatsheet" target="_blank">http://anti-code.com/devtools-cheatsheet</a></td>
</tr>
<tr>
<td>chrome调试工具常用功能整理</td>
<td><a href="http://www.html-js.com/article/2327" target="_blank">http://www.html-js.com/article/2327</a></td>
</tr>
<tr>
<td>Chrome 开发工具 Workspace 使用</td>
<td><a href="http://www.iinterest.net/2014/05/09/chrome-dev-tool-workspace" target="_blank">http://www.iinterest.net/2014/05/09/chrome-dev-tool-workspace</a></td>
</tr>
<tr>
<td>Chrome神器Vimium快捷键学习记录</td>
<td><a href="http://www.cppblog.com/deercoder/archive/2011/10/22/158886.html" target="_blank">http://www.cppblog.com/deercoder/archive/2011/10/22/158886.html</a></td>
</tr>
<tr>
<td>sass调试-w3cplus</td>
<td><a href="http://www.w3cplus.com/sassguide/debug.html" target="_blank">http://www.w3cplus.com/sassguide/debug.html</a></td>
</tr>
<tr>
<td>如何更专业的使用Chrome开发者工具-w3cplus</td>
<td><a href="http://www.w3cplus.com/tools/how-to-use-chrome-devtools-like-a-pro.html" target="_blank">http://www.w3cplus.com/tools/how-to-use-chrome-devtools-like-a-pro.html</a></td>
</tr>
<tr>
<td>chrome调试canvas</td>
<td><a href="http://sentsin.com/web/253.html" target="_blank">http://sentsin.com/web/253.html</a></td>
</tr>
<tr>
<td>chrome profiles1</td>
<td><a href="https://developer.chrome.com/devtools/index" target="_blank">https://developer.chrome.com/devtools/index</a></td>
</tr>
<tr>
<td>chrome profiles2</td>
<td><a href="http://h5dev.uc.cn/article-25-1.html" target="_blank">http://h5dev.uc.cn/article-25-1.html</a></td>
</tr>
<tr>
<td>chrome profiles3</td>
<td><a href="http://www.oschina.net/translate/performance-optimisation-with-timeline-profiles" target="_blank">http://www.oschina.net/translate/performance-optimisation-with-timeline-profiles</a></td>
</tr>
<tr>
<td>chrome移动版调试</td>
<td><a href="https://developer.chrome.com/devtools/docs/mobile-emulation" target="_blank">https://developer.chrome.com/devtools/docs/mobile-emulation</a></td>
</tr>
<tr>
<td>chrome调试</td>
<td><a href="http://ued.taobao.org/blog/2012/06/debug-with-chrome-dev-tool" target="_blank">http://ued.taobao.org/blog/2012/06/debug-with-chrome-dev-tool</a></td>
</tr>
<tr>
<td>chrome的调试</td>
<td><a href="http://www.cnblogs.com/QLeelulu/archive/2011/08/28/2156402.html" target="_blank">http://www.cnblogs.com/QLeelulu/archive/2011/08/28/2156402.html</a></td>
</tr>
<tr>
<td>chrome console 命令详解</td>
<td><a href="https://developer.chrome.com/devtools/docs/commandline-api" target="_blank">https://developer.chrome.com/devtools/docs/commandline-api</a></td>
</tr>
<tr>
<td>查看事件绑定1</td>
<td><a href="http://www.cnblogs.com/leonkao/p/3809655.html" target="_blank">http://www.cnblogs.com/leonkao/p/3809655.html</a></td>
</tr>
<tr>
<td>查看事件绑定2</td>
<td><a href="http://www.cnblogs.com/xiaoyao2011/p/3447421.html" target="_blank">http://www.cnblogs.com/xiaoyao2011/p/3447421.html</a></td>
</tr>
<tr>
<td>神器——Chrome开发者工具(一)</td>
<td><a href="http://segmentfault.com/a/1190000000683599" target="_blank">http://segmentfault.com/a/1190000000683599</a></td>
</tr>
<tr>
<td>奇趣百科性能优化(Chrome DevTools 中的 Timeline Profils 等工具使用介绍</td>
<td><a href="https://xinranliu.me/2015-05-22-qiqu-performance" target="_blank">https://xinranliu.me/2015-05-22-qiqu-performance</a></td>
</tr>
<tr>
<td>chrome 开发者工具的 15 个小技巧</td>
<td><a href="http://frontenddev.org/link/15-tips-of-chrome-developer-tools.html" target="_blank">http://frontenddev.org/link/15-tips-of-chrome-developer-tools.html</a></td>
</tr>
<tr>
<td>Chrome开发者工具不完全指南</td>
<td><a href="http://1ke.co/course/361" target="_blank">http://1ke.co/course/361</a></td>
</tr>
<tr>
<td>Chrome 开发者工具使用技巧</td>
<td><a href="http://segmentfault.com/a/1190000003882567" target="_blank">http://segmentfault.com/a/1190000003882567</a></td>
</tr>
</tbody>
</table>
<h3 id="firebug">
<a name="t62"></a>Firebug</h3>
<table>
<thead><tr>
<th>Firebug</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>firebug视频教程</td>
<td><a href="http://www.imooc.com/learn/137" target="_blank">http://www.imooc.com/learn/137</a></td>
</tr>
<tr>
<td>firefox 模拟器</td>
<td><a href="https://developer.mozilla.org/zh-CN/docs/Tools/WebIDE" target="_blank">https://developer.mozilla.org/zh-CN/docs/Tools/WebIDE</a></td>
</tr>
<tr>
<td>console.log 命令详解</td>
<td><a href="http://www.cnblogs.com/ctriphire/p/4116207.html" target="_blank">http://www.cnblogs.com/ctriphire/p/4116207.html</a></td>
</tr>
<tr>
<td>Firebug入门指南</td>
<td><a href="http://www.ruanyifeng.com/blog/2008/06/firebug_tutorial.html" target="_blank">http://www.ruanyifeng.com/blog/2008/06/firebug_tutorial.html</a></td>
</tr>
<tr>
<td>Firebug控制台详解</td>
<td><a href="http://www.ruanyifeng.com/blog/2011/03/firebug_console_tutorial.html" target="_blank">http://www.ruanyifeng.com/blog/2011/03/firebug_console_tutorial.html</a></td>
</tr>
</tbody>
</table>
<h3 id="移动微信调试">
<a name="t63"></a>移动,微信调试</h3>
<table>
<thead><tr>
<th>移动,微信调试</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>浏览器端调试安卓</td>
<td><a href="https://openstf.github.io" target="_blank">https://openstf.github.io</a></td>
</tr>
<tr>
<td>移动端前端开发调试</td>
<td><a href="http://yujiangshui.com/multidevice-frontend-debug" target="_blank">http://yujiangshui.com/multidevice-frontend-debug</a></td>
</tr>
<tr>
<td>使用 Chrome 远程调试 Android 设备</td>
<td><a href="https://github.com/yujiangshui/CN-Chrome-DevTools/blob/remote-debugging/md/Use-Tools/remote-debugging.md" target="_blank">https://github.com/yujiangshui/CN-Chrome-DevTools/blob/remote-debugging/md/Use-Tools/remote-debugging.md</a></td>
</tr>
<tr>
<td>mac移动端调试</td>
<td><a href="http://plus.uc.cn/document/webapp/doc5.html" target="_blank">http://plus.uc.cn/document/webapp/doc5.html</a></td>
</tr>
<tr>
<td>mac移动端调试</td>
<td><a href="http://www.mihtool.com" target="_blank">http://www.mihtool.com</a></td>
</tr>
<tr>
<td>无线调试攻略</td>
<td><a href="http://thx.github.io/mobile/debugging-in-mobile" target="_blank">http://thx.github.io/mobile/debugging-in-mobile</a></td>
</tr>
<tr>
<td>无线调试攻略</td>
<td><a href="http://yanhaijing.com/mobile/2014/12/17/web-debug-for-mobile" target="_blank">http://yanhaijing.com/mobile/2014/12/17/web-debug-for-mobile</a></td>
</tr>
<tr>
<td>屌爆了,完美调试 微信webview(x5</td>
<td><a href="http://www.jianshu.com/p/ccf124f1f74b" target="_blank">http://www.jianshu.com/p/ccf124f1f74b</a></td>
</tr>
<tr>
<td>微信调试的那些事</td>
<td><a href="http://liyaodong.com/2015/07/06/%E5%BE%AE%E4%BF%A1%E8%B0%83%E8%AF%95%E7%9A%84%E9%82%A3%E4%BA%9B%E4%BA%8B" target="_blank">http://liyaodong.com/2015/07/06/%E5%BE%AE%E4%BF%A1%E8%B0%83%E8%AF%95%E7%9A%84%E9%82%A3%E4%BA%9B%E4%BA%8B</a></td>
</tr>
<tr>
<td>远程console</td>
<td><a href="http://jsconsole.com" target="_blank">http://jsconsole.com</a></td>
</tr>
<tr>
<td>微信调试工具</td>
<td><a href="http://blog.qqbrowser.cc" target="_blank">http://blog.qqbrowser.cc</a></td>
</tr>
<tr>
<td>各种真机远程调试方法汇总</td>
<td><a href="https://github.com/jieyou/remote_inspect_web_on_real_device" target="_blank">https://github.com/jieyou/remote_inspect_web_on_real_device</a></td>
</tr>
</tbody>
</table>
<h3 id="ios-simulator">
<a name="t64"></a>iOS Simulator</h3>
<table>
<thead><tr>
<th>iOS Simulator</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>Simulator</td>
<td><a href="https://developer.apple.com/library/ios/documentation/IDEs/Conceptual/iOS_Simulator_Guide/Introduction/Introduction.html" target="_blank">https://developer.apple.com/library/ios/documentation/IDEs/Conceptual/iOS_Simulator_Guide/Introduction/Introduction.html</a></td>
</tr>
<tr>
<td>iOS Simulator的介绍和使用心得</td>
<td><a href="http://www.crifan.com/intro_ios_simulator_in_xcode_and_usage_summary" target="_blank">http://www.crifan.com/intro_ios_simulator_in_xcode_and_usage_summary</a></td>
</tr>
</tbody>
</table>
<h3 id="image">
<a name="t65"></a>Image</h3>
<table>
<thead><tr>
<th>Image</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>loading img</td>
<td><a href="http://preloaders.net/en/circular" target="_blank">http://preloaders.net/en/circular</a></td>
</tr>
<tr>
<td>智图-图片优化平台</td>
<td><a href="http://zhitu.isux.us" target="_blank">http://zhitu.isux.us</a></td>
</tr>
<tr>
<td>在线png优化</td>
<td><a href="https://tinypng.com" target="_blank">https://tinypng.com</a></td>
</tr>
<tr>
<td>SM.MS(图床工具～简易好用)</td>
<td><a href="https://sm.ms/" target="_blank">https://sm.ms/</a></td>
</tr>
<tr>
<td>yutuku：极简图床</td>
<td><a href="http://yotuku.cn/" target="_blank">http://yotuku.cn/</a></td>
</tr>
<tr>
<td>Qchan图床</td>
<td><a href="http://tuchuang.org/" target="_blank">http://tuchuang.org/</a></td>
</tr>
</tbody>
</table>
<h3 id="浏览器同步">
<a name="t66"></a>浏览器同步</h3>
<table>
<thead><tr>
<th>浏览器同步</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>puer</td>
<td><a href="https://github.com/leeluolee/puer" target="_blank">https://github.com/leeluolee/puer</a></td>
</tr>
<tr>
<td>liveReload</td>
<td><a href="http://livereload.com" target="_blank">http://livereload.com</a></td>
</tr>
<tr>
<td>f5</td>
<td><a href="http://getf5.com" target="_blank">http://getf5.com</a></td>
</tr>
<tr>
<td>File Watchers</td>
<td><a href="http://geek100.com/2608" target="_blank">http://geek100.com/2608</a></td>
</tr>
</tbody>
</table>
<h3 id="在线ppt制作">
<a name="t67"></a>在线PPT制作</h3>
<table>
<thead><tr>
<th>在线PPT制作</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>nodePPT</td>
<td><a href="http://js8.in/2013/11/16/%E6%8E%A8%E8%8D%90nodeppt%EF%BC%9A%E4%BD%BF%E7%94%A8markdown%E8%AF%AD%E6%B3%95%E6%9D%A5%E5%86%99%E7%BD%91%E9%A1%B5ppt/" target="_blank">http://js8.in/2013/11/16/%E6%8E%A8%E8%8D%90nodeppt%EF%BC%9A%E4%BD%BF%E7%94%A8markdown%E8%AF%AD%E6%B3%95%E6%9D%A5%E5%86%99%E7%BD%91%E9%A1%B5ppt/</a></td>
</tr>
<tr>
<td>Cleaver快速制作网页PPT</td>
<td><a href="http://www.jeffjade.com/2015/10/15/2015-10-16-cleaver-make-ppt/" target="_blank">http://www.jeffjade.com/2015/10/15/2015-10-16-cleaver-make-ppt/</a></td>
</tr>
<tr>
<td>impress.js</td>
<td><a href="http://www.cnblogs.com/Darren_code/archive/2013/01/04/impressjs.html" target="_blank">http://www.cnblogs.com/Darren_code/archive/2013/01/04/impressjs.html</a></td>
</tr>
<tr>
<td>PPT</td>
<td><a href="https://github.com/ksky521/nodePPT" target="_blank">https://github.com/ksky521/nodePPT</a></td>
</tr>
<tr>
<td>reveal</td>
<td><a href="https://github.com/hakimel/reveal.js" target="_blank">https://github.com/hakimel/reveal.js</a></td>
</tr>
<tr>
<td>bespoke-fx</td>
<td><a href="https://github.com/ebow/bespoke-fx" target="_blank">https://github.com/ebow/bespoke-fx</a></td>
</tr>
<tr>
<td>slippy</td>
<td><a href="https://github.com/Seldaek/slippy" target="_blank">https://github.com/Seldaek/slippy</a></td>
</tr>
</tbody>
</table>
<h3 id="前端导航网站">
<a name="t68"></a>前端导航网站</h3>
<table>
<thead><tr>
<th>前端导航网站</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>界面清爽的前端导航</td>
<td><a href="http://uxbees.com/index.html" target="_blank">http://uxbees.com/index.html</a></td>
</tr>
<tr>
<td>前端导航</td>
<td><a href="http://whycss.com" target="_blank">http://whycss.com</a></td>
</tr>
<tr>
<td>前端网址导航</td>
<td><a href="http://www.daqianduan.com/nav" target="_blank">http://www.daqianduan.com/nav</a></td>
</tr>
<tr>
<td>前端名录</td>
<td><a href="http://sentsin.com/daohang" target="_blank">http://sentsin.com/daohang</a></td>
</tr>
<tr>
<td>前端导航</td>
<td><a href="http://123.jser.us" target="_blank">http://123.jser.us</a></td>
</tr>
<tr>
<td>前端开发资源</td>
<td><a href="http://www.css88.com/nav" target="_blank">http://www.css88.com/nav</a></td>
</tr>
<tr>
<td>网址导航</td>
<td><a href="http://www.haourl.cn" target="_blank">http://www.haourl.cn</a></td>
</tr>
<tr>
<td>前端开发仓库 - 众多效果的收集地</td>
<td><a href="http://code.ciaoca.com" target="_blank">http://code.ciaoca.com</a></td>
</tr>
<tr>
<td>前端资源导航</td>
<td><a href="https://github.com/jnoodle/f2e-collect" target="_blank">https://github.com/jnoodle/f2e-collect</a></td>
</tr>
<tr>
<td>F2E 前端导航</td>
<td><a href="http://f2e.im/static/pages/nav/index.html" target="_blank">http://f2e.im/static/pages/nav/index.html</a></td>
</tr>
</tbody>
</table>
<h3 id="常用cdn">
<a name="t69"></a>常用CDN</h3>
<table>
<thead><tr>
<th>常用CDN</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>新浪CDN</td>
<td><a href="http://lib.sinaapp.com" target="_blank">http://lib.sinaapp.com</a></td>
</tr>
<tr>
<td>百度静态资源公共库</td>
<td><a href="http://cdn.code.baidu.com" target="_blank">http://cdn.code.baidu.com</a></td>
</tr>
<tr>
<td>360网站卫士常用前端公共库CDN服务</td>
<td><a href="http://libs.useso.com" target="_blank">http://libs.useso.com</a></td>
</tr>
<tr>
<td>Bootstrap中文网开源项目免费 CDN 服务</td>
<td><a href="http://www.bootcdn.cn" target="_blank">http://www.bootcdn.cn</a></td>
</tr>
<tr>
<td>开放静态文件 CDN - 七牛</td>
<td><a href="http://staticfile.org" target="_blank">http://staticfile.org</a></td>
</tr>
<tr>
<td>CDN加速 - jq22</td>
<td><a href="http://www.jq22.com/cdn" target="_blank">http://www.jq22.com/cdn</a></td>
</tr>
<tr>
<td>jQuery CDN</td>
<td><a href="http://code.jquery.com" target="_blank">http://code.jquery.com</a></td>
</tr>
<tr>
<td>Google jQuery CDN</td>
<td><a href="http://www.google-jquery-cdn.com" target="_blank">http://www.google-jquery-cdn.com</a></td>
</tr>
<tr>
<td>微软CDN</td>
<td><a href="http://www.asp.net/ajax/cdn" target="_blank">http://www.asp.net/ajax/cdn</a></td>
</tr>
</tbody>
</table>
<h3 id="git">
<a name="t70"></a>Git</h3>
<table>
<thead><tr>
<th>Git</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>git-scm</td>
<td><a href="http://git-scm.com" target="_blank">http://git-scm.com</a></td>
</tr>
<tr>
<td>廖雪峰-Git教程</td>
<td><a href="http://www.liaoxuefeng.com/wiki/0013739516305929606dd18361248578c67b8067c8c017b000" target="_blank">http://www.liaoxuefeng.com/wiki/0013739516305929606dd18361248578c67b8067c8c017b000</a></td>
</tr>
<tr>
<td>git-for-windows</td>
<td><a href="https://git-for-windows.github.io" target="_blank">https://git-for-windows.github.io</a></td>
</tr>
<tr>
<td>GitHub 添加 SSH keys</td>
<td><a href="http://daemon369.github.io/git/2015/03/10/add-ssh-keys-for-github" target="_blank">http://daemon369.github.io/git/2015/03/10/add-ssh-keys-for-github</a></td>
</tr>
<tr>
<td>gogithub</td>
<td><a href="http://www.worldhello.net/gotgithub/index.html" target="_blank">http://www.worldhello.net/gotgithub/index.html</a></td>
</tr>
<tr>
<td>git常规命令练习</td>
<td><a href="http://pcottle.github.io/learnGitBranching" target="_blank">http://pcottle.github.io/learnGitBranching</a></td>
</tr>
<tr>
<td>git的资料整理</td>
<td><a href="https://github.com/xirong/my-git" target="_blank">https://github.com/xirong/my-git</a></td>
</tr>
<tr>
<td>我所记录的git命令（非常实用）</td>
<td><a href="http://www.cnblogs.com/fanfan259/p/4810517.html" target="_blank">http://www.cnblogs.com/fanfan259/p/4810517.html</a></td>
</tr>
<tr>
<td>企业开发git工作流模式探索部分休整</td>
<td><a href="https://github.com/xirong/my-git/blob/master/git-workflow-tutorial.md" target="_blank">https://github.com/xirong/my-git/blob/master/git-workflow-tutorial.md</a></td>
</tr>
<tr>
<td>GitHub 漫游指南</td>
<td><a href="https://github.com/phodal/github-roam" target="_blank">https://github.com/phodal/github-roam</a></td>
</tr>
<tr>
<td>GitHub秘籍</td>
<td><a href="https://github.com/tiimgreen/github-cheat-sheet/blob/master/README.zh-cn.md" target="_blank">https://github.com/tiimgreen/github-cheat-sheet/blob/master/README.zh-cn.md</a></td>
</tr>
<tr>
<td>使用git和github进行协同开发流程</td>
<td><a href="http://livoras.com/post/28" target="_blank">http://livoras.com/post/28</a></td>
</tr>
<tr>
<td>动画方式练习git</td>
<td><a href="http://onlywei.github.io/explain-git-with-d3" target="_blank">http://onlywei.github.io/explain-git-with-d3</a></td>
</tr>
</tbody>
</table>
<h3 id="各种日期日历">
<a name="t71"></a>各种日期日历</h3>
<table>
<thead><tr>
<th>各种日期日历</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>经典my97</td>
<td><a href="http://www.my97.net/dp/demo/index.htm" target="_blank">http://www.my97.net/dp/demo/index.htm</a></td>
</tr>
<tr>
<td>强大的独立日期选择器</td>
<td><a href="http://www.cnblogs.com/gbin1/archive/2012/04/16/2452105.html" target="_blank">http://www.cnblogs.com/gbin1/archive/2012/04/16/2452105.html</a></td>
</tr>
<tr>
<td>fullcalendar</td>
<td><a href="http://fullcalendar.io" target="_blank">http://fullcalendar.io</a></td>
</tr>
<tr>
<td>fullcalendar日历控件知识点集合</td>
<td><a href="http://blog.csdn.net/francislaw/article/details/7740630" target="_blank">http://blog.csdn.net/francislaw/article/details/7740630</a></td>
</tr>
<tr>
<td>中文api</td>
<td><a href="http://blog.sina.com.cn/s/blog_9475b1c101012c5f.html" target="_blank">http://blog.sina.com.cn/s/blog_9475b1c101012c5f.html</a></td>
</tr>
<tr>
<td>农历日历</td>
<td><a href="https://github.com/zzyss86/LunarCalendar" target="_blank">https://github.com/zzyss86/LunarCalendar</a></td>
</tr>
<tr>
<td>超酷的仿百度带节日日历老黄历控件</td>
<td><a href="http://www.sucaisj.com/jiaoben/date/201509/16856.html" target="_blank">http://www.sucaisj.com/jiaoben/date/201509/16856.html</a></td>
</tr>
<tr>
<td>日期格式化</td>
<td><a href="http://momentjs.com" target="_blank">http://momentjs.com</a></td>
</tr>
<tr>
<td>大牛日历控件</td>
<td><a href="https://github.com/Johnqing/QPAYCalendar" target="_blank">https://github.com/Johnqing/QPAYCalendar</a></td>
</tr>
<tr>
<td>我群某管理作品</td>
<td><a href="https://github.com/Iamlars/dateMarker" target="_blank">https://github.com/Iamlars/dateMarker</a></td>
</tr>
<tr>
<td>input按位替换-官网</td>
<td><a href="http://digitalbush.com/projects/masked-input-plugin" target="_blank">http://digitalbush.com/projects/masked-input-plugin</a></td>
</tr>
<tr>
<td>input按位替换-github</td>
<td><a href="https://github.com/digitalBush/jquery.maskedinput/tree/1.2.2" target="_blank">https://github.com/digitalBush/jquery.maskedinput/tree/1.2.2</a></td>
</tr>
<tr>
<td>bootstrap-daterangepicker</td>
<td><a href="https://github.com/dangrossman/bootstrap-daterangepicker" target="_blank">https://github.com/dangrossman/bootstrap-daterangepicker</a></td>
</tr>
<tr>
<td>国外30个插件集合</td>
<td><a href="http://www.vandelaydesign.com/30-best-free-jquery-plugins" target="_blank">http://www.vandelaydesign.com/30-best-free-jquery-plugins</a></td>
</tr>
<tr>
<td>JavaScript datepicker</td>
<td><a href="http://dbushell.com/2012/10/09/pikaday-javascript-datepicker" target="_blank">http://dbushell.com/2012/10/09/pikaday-javascript-datepicker</a></td>
</tr>
<tr>
<td>Datepair.js</td>
<td><a href="http://jonthornton.github.io/Datepair.js" target="_blank">http://jonthornton.github.io/Datepair.js</a></td>
</tr>
<tr>
<td>一个风格多样的日历</td>
<td><a href="https://github.com/glad/glDatePicker" target="_blank">https://github.com/glad/glDatePicker</a></td>
</tr>
<tr>
<td>弹出层式的全日历</td>
<td><a href="http://amsul.ca/pickadate.js/date" target="_blank">http://amsul.ca/pickadate.js/date</a></td>
</tr>
<tr>
<td>jquery双日历</td>
<td><a href="http://www.daterangepicker.com" target="_blank">http://www.daterangepicker.com</a></td>
</tr>
<tr>
<td>大气实用jQuery手机移动端日历日期选择插件</td>
<td><a href="http://www.frankdemo.cn/index.php?c=content&amp;a=show&amp;id=115" target="_blank">http://www.frankdemo.cn/index.php?c=content&amp;a=show&amp;id=115</a></td>
</tr>
<tr>
<td>jQuery Mobile 移动开发中的日期插件Mobiscroll</td>
<td><a href="https://mobiscroll.com" target="_blank">https://mobiscroll.com</a></td>
</tr>
</tbody>
</table>
<h3 id="date-library">
<a name="t72"></a>Date library</h3>
<table>
<thead><tr>
<th>Date library</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>Datejs</td>
<td><a href="https://github.com/datejs/Datejs" target="_blank">https://github.com/datejs/Datejs</a></td>
</tr>
<tr>
<td>sugarjs</td>
<td><a href="http://sugarjs.com/api/Date" target="_blank">http://sugarjs.com/api/Date</a></td>
</tr>
</tbody>
</table>
<h3 id="其它">
<a name="t73"></a>其它</h3>
<table>
<thead><tr>
<th>其它</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>Mock.js 是一款模拟数据生成器</td>
<td><a href="http://mockjs.com" target="_blank">http://mockjs.com</a></td>
</tr>
<tr>
<td>特色的HTML框架可以创建精美的iOS应用</td>
<td><a href="http://framework7.taobao.org" target="_blank">http://framework7.taobao.org</a></td>
</tr>
<tr>
<td>淘宝SUI</td>
<td><a href="http://m.sui.taobao.org" target="_blank">http://m.sui.taobao.org</a></td>
</tr>
<tr>
<td>avalonjs</td>
<td><a href="http://avalonjs.github.io" target="_blank">http://avalonjs.github.io</a></td>
</tr>
<tr>
<td>Avalon新一代UI库： OniUI</td>
<td><a href="http://ued.qunar.com/oniui/index.html" target="_blank">http://ued.qunar.com/oniui/index.html</a></td>
</tr>
<tr>
<td>avalon.oniui-基于avalon的组件库</td>
<td><a href="https://github.com/RubyLouvre/avalon.oniui" target="_blank">https://github.com/RubyLouvre/avalon.oniui</a></td>
</tr>
<tr>
<td>生成二维码(草料)</td>
<td><a href="http://cli.im" target="_blank">http://cli.im</a></td>
</tr>
</tbody>
</table>
<h3 id="效果类">
<a name="t74"></a>效果类</h3>
<table>
<thead><tr>
<th>效果类</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>弹出层</td>
<td><a href="http://www.imooc.com/learn/58" target="_blank">http://www.imooc.com/learn/58</a></td>
</tr>
<tr>
<td>焦点图轮播特效</td>
<td><a href="http://www.imooc.com/learn/18" target="_blank">http://www.imooc.com/learn/18</a></td>
</tr>
<tr>
<td>HTML5 有哪些让你惊艳的 demo？</td>
<td><a href="http://www.zhihu.com/question/24398907" target="_blank">http://www.zhihu.com/question/24398907</a></td>
</tr>
</tbody>
</table>
<h3 id="弹出层">
<a name="t75"></a>弹出层</h3>
<table>
<thead><tr>
<th>弹出层</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>artDialog 最新版</td>
<td><a href="https://github.com/aui/artDialog" target="_blank">https://github.com/aui/artDialog</a></td>
</tr>
<tr>
<td>artDialog 文档</td>
<td><a href="http://aui.github.io/artDialog/doc/index.html" target="_blank">http://aui.github.io/artDialog/doc/index.html</a></td>
</tr>
<tr>
<td>google code 下载地址</td>
<td><a href="https://code.google.com/p/artdialog/downloads/list" target="_blank">https://code.google.com/p/artdialog/downloads/list</a></td>
</tr>
<tr>
<td>贤心弹出层</td>
<td><a href="http://layer.layui.com" target="_blank">http://layer.layui.com</a></td>
</tr>
<tr>
<td>响应式用户交互组件库</td>
<td><a href="https://github.com/bh-lay/UI" target="_blank">https://github.com/bh-lay/UI</a></td>
</tr>
<tr>
<td>sweetalert-有css3动画弹出层</td>
<td><a href="http://t4t5.github.io/sweetalert" target="_blank">http://t4t5.github.io/sweetalert</a></td>
</tr>
</tbody>
</table>
<h3 id="优秀javascript项目">
<a name="t76"></a>优秀JavaScript项目</h3>
<table>
<thead><tr>
<th>优秀JavaScript项目</th>
<th>地址</th>
</tr></thead>
<tbody>
<tr>
<td>Angular和Webpack种子文件</td>
<td><a href="https://github.com/AngularClass/angular2-webpack-starter" target="_blank">https://github.com/AngularClass/angular2-webpack-starter</a></td>
</tr>
<tr>
<td>Fis3面向前端的工程构建系统</td>
<td><a href="https://github.com/fex-team/fis3" target="_blank">https://github.com/fex-team/fis3</a></td>
</tr>
<tr>
<td>Fis3 DEMO</td>
<td><a href="https://github.com/fex-team/fis3-demo" target="_blank">https://github.com/fex-team/fis3-demo</a></td>
</tr>
<tr>
<td>前端JQuery系列:源码剖析</td>
<td><a href="https://github.com/JsAaron/jQuery" target="_blank">https://github.com/JsAaron/jQuery</a></td>
</tr>
<tr>
<td>avalon框架</td>
<td><a href="https://github.com/RubyLouvre/avalon" target="_blank">https://github.com/RubyLouvre/avalon</a></td>
</tr>
<tr>
<td>Microsoft ChakraCore 微软的Chakra引擎</td>
<td><a href="https://github.com/Microsoft/ChakraCore" target="_blank">https://github.com/Microsoft/ChakraCore</a></td>
</tr>
<tr>
<td>Quintus HTML游戏引擎</td>
<td><a href="https://github.com/cykod/Quintus" target="_blank">https://github.com/cykod/Quintus</a></td>
</tr>
<tr>
<td>一个用node.js搭建的有趣博客</td>
<td><a href="https://github.com/STRML/strml.net" target="_blank">https://github.com/STRML/strml.net</a></td>
</tr>
<tr>
<td>Web前端助手—FeHelper（Chrome扩展）</td>
<td><a href="https://github.com/zxlie/FeHelper" target="_blank">https://github.com/zxlie/FeHelper</a></td>
</tr>
<tr>
<td>百度前端技术学院</td>
<td><a href="https://github.com/baidu-ife/ife" target="_blank">https://github.com/baidu-ife/ife</a></td>
</tr>
<tr>
<td>Cheerio（node.js中的jQuery）</td>
<td><a href="https://github.com/cheeriojs/cheerio" target="_blank">https://github.com/cheeriojs/cheerio</a></td>
</tr>
<tr>
<td>nodejs的一个聊天软件 类似微信</td>
<td><a href="https://github.com/BryanYang/freechat" target="_blank">https://github.com/BryanYang/freechat</a></td>
</tr>
<tr>
<td>使用html5和node.js构建的网易云音乐</td>
<td><a href="https://github.com/stkevintan/Cube" target="_blank">https://github.com/stkevintan/Cube</a></td>
</tr>
<tr>
<td>babel ES6转换为ES5</td>
<td><a href="https://github.com/babel/babel" target="_blank">https://github.com/babel/babel</a></td>
</tr>
<tr>
<td>一个JS富文本编辑器</td>
<td><a href="https://github.com/fex-team/ueditor" target="_blank">https://github.com/fex-team/ueditor</a></td>
</tr>
<tr>
<td>一个JS脑图可视化工具</td>
<td><a href="https://github.com/fex-team/kityminder-core" target="_blank">https://github.com/fex-team/kityminder-core</a></td>
</tr>
<tr>
<td>一个JS写的Flappy Bird Game</td>
<td><a href="https://github.com/ellisonleao/clumsy-bird" target="_blank">https://github.com/ellisonleao/clumsy-bird</a></td>
</tr>
<tr>
<td>一个JS写的GBA模拟器</td>
<td><a href="https://github.com/taisel/IodineGBA" target="_blank">https://github.com/taisel/IodineGBA</a></td>
</tr>
<tr>
<td>SegmentFault写的Markdown解析器</td>
<td><a href="https://github.com/SegmentFault/HyperDown.js" target="_blank">https://github.com/SegmentFault/HyperDown.js</a></td>
</tr>
<tr>
<td>基于node.js的Ghost博客</td>
<td><a href="https://github.com/TryGhost/Ghost" target="_blank">https://github.com/TryGhost/Ghost</a></td>
</tr>
<tr>
<td>学习react的demos</td>
<td><a href="https://github.com/ruanyf/react-demos" target="_blank">https://github.com/ruanyf/react-demos</a></td>
</tr>
</tbody>
</table>
</div>
</div>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<div id="article_content" class="article_content csdn-tracking-statistics tracking-click" style="overflow: hidden;">
<h2 class="zm-editable-content" style="margin: 10px 0px; padding: 0px; line-height: 1.5; font-size: 21px; font-family: verdana, Arial, Helvetica, sans-serif;">
<a name="t0"></a> 概述：</h2>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">　　<span style="margin: 0px; padding: 0px; line-height: 1.8; font-size: 15px;">有些日子没有正襟危坐写博客了，互联网飞速发展的时代，技术更新迭代的速度也在加快。看着Java、Js、Swift在各领域心花路放，也是煞是羡慕。寻了寻.net的消息，也是振奋人心，.net core 1，mono，xamarin等等，但大多都还在狂吼的阶段。其实一直以来对技术的理解是技术服务于业务和产品，产品又在不同程度的推进着技术的演进。</span></p>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;"> </p>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;"><span style="margin: 0px; padding: 0px; line-height: 1.8; font-size: 15px;">　　Web、无线、物联网、VR、PC从不同方向推进着技术的融合与微创新。程序员在不同业务场景下的角色互换。而随着node.js的出现语言的角色也在发生着转变，Js扮演了越来越重要的角色。也就有了茶余饭后也把了解到的知识整理一下。看过“你的知识需要管理”后，强烈的意识到杂乱且范范的知识储备远不如整理后条理清晰的知识带来好处多。所以，是的，我们需要时不时的回来对掌握的知识梳理归类，以备不时之需。</span></p>
<h2 class="zm-editable-content" style="margin: 10px 0px; padding: 0px; line-height: 1.5; font-size: 21px; font-family: verdana, Arial, Helvetica, sans-serif;">
<a name="t1"></a> 一、前端框架库：</h2>
<h3 class="zm-editable-content" style="margin: 10px 0px; padding: 0px; font-size: 16px; line-height: 1.5; font-family: verdana, Arial, Helvetica, sans-serif;">
<a name="t2"></a> 1.Zepto.js</h3>
<ul style="margin: 0px 0px 0px 30px; padding: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">地址：</span>http://www.css88.com/doc/zeptojs/</li>
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">描述：</span>Zepto是一个轻量级的针对现代高级浏览器的JavaScript库， 它与jquery有着类似的api。 如果你会用jquery，那么你也会用zepto。关于Zepto认知我也是通过与一位腾讯朋友聊天的时候知道的，只作了些基础的了解。</li>
</ul>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;"> </p>
<h3 style="margin: 10px 0px; padding: 0px; font-size: 16px; line-height: 1.5; font-family: verdana, Arial, Helvetica, sans-serif;">
<a name="t3"></a> 2.SUI Mobile</h3>
<ul style="margin: 0px 0px 0px 30px; padding: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">地址：</span>http://m.sui.taobao.org</li>
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">描述：</span>SUI Mobile 是一套基于 <a style="margin: 0px; padding: 0px; text-decoration: none; color: #000000; border-bottom-width: 1px; border-bottom-style: dotted; border-bottom-color: #333333;" href="http://framework7.taobao.org/" target="_blank">Framework7</a> 开发的UI库。它非常轻量、精美，只需要引入我们的CDN文件就可以使用，并且能兼容到 iOS 6.0+ 和 Android 4.0+，非常适合开发跨平台Web App。</li>
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">用途：</span>你也看到了，他是用于无线端的Web App的开发。</li>
</ul>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;"> </p>
<h3 style="margin: 10px 0px; padding: 0px; font-size: 16px; line-height: 1.5; font-family: verdana, Arial, Helvetica, sans-serif;">
<a name="t4"></a> 3.Node.Js</h3>
<ul style="margin: 0px 0px 0px 30px; padding: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">地址：</span>http://www.runoob.com/nodejs/nodejs-tutorial.html (中文网)</li>
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">描述：</span>Node.js是一个Javascript运行环境(runtime)。实际上它是对Google V8引擎进行了封装。V8引 擎执行Javascript的速度非常快，性能非常好。Node.js对一些特殊用例进行了优化，提供了替代的API，使得V8在非浏览器环境下运行得更好。</li>
</ul>
<div class="para" style="margin: 0px; padding: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">　　Node.js是一个基于Chrome JavaScript运行时建立的平台， 用于方便地搭建响应速度快、易于扩展的网络应用。Node.js 使用<a style="margin: 0px; padding: 0px; text-decoration: none; color: #000000; border-bottom-width: 1px; border-bottom-style: dotted; border-bottom-color: #333333;" href="http://baike.baidu.com/view/536048.htm" target="_blank">事件驱动</a>， 非阻塞<a style="margin: 0px; padding: 0px; text-decoration: none; color: #000000; border-bottom-width: 1px; border-bottom-style: dotted; border-bottom-color: #333333;" href="http://baike.baidu.com/subview/300881/11169495.htm" target="_blank">I/O</a> 模型而得以轻量和高效，非常适合在分布式设备上运行数据密集型的实时应用。</div>
<div class="para" style="margin: 0px; padding: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px;">　　简单的说 Node.js 就是运行在服务端的 JavaScript。</p>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px;">　　Node.js 是一个基于Chrome JavaScript 运行时建立的一个平台。</p>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px;">　　Node.js是一个事件驱动I/O服务端JavaScript环境，基于Google的V8引擎，V8引擎执行Javascript的速度非常快，性能非常好。</p>
</div>
<ul style="margin: 0px 0px 0px 30px; padding: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">
<li style="margin: 0px; padding: 0px;"><span style="margin: 0px; padding: 0px;">用途：</span></li>
</ul>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">　　1. RESTful API</p>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">　　这是NodeJS最理想的应用场景，可以处理数万条连接，本身没有太多的逻辑，只需要请求API，组织数据进行返回即可。它本质上只是从某个数据库中查找一些值并将它们组成一个响应。由于响应是少量文本，入站请求也是少量的文本，因此流量不高，一台机器甚至也可以处理最繁忙的公司的API需求。</p>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">　　2. 统一Web应用的UI层</p>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">　　目前MVC的架构，在某种意义上来说，Web开发有两个UI层，一个是在浏览器里面我们最终看到的，另一个在server端，负责生成和拼接页面。</p>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">不讨论这种架构是好是坏，但是有另外一种实践，面向服务的架构，更好的做前后端的依赖分离。如果所有的关键业务逻辑都封装成REST调用，就意味着在上层只需要考虑如何用这些REST接口构建具体的应用。那些后端程序员们根本不操心具体数据是如何从一个页面传递到另一个页面的，他们也不用管用户数据更新是通过Ajax异步获取的还是通过刷新页面。</p>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">　　3. 大量Ajax请求的应用</p>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">例如个性化应用，每个用户看到的页面都不一样，缓存失效，需要在页面加载的时候发起Ajax请求，NodeJS能响应大量的并发请求。　　总而言之，NodeJS适合运用在高并发、I/O密集、少量业务逻辑的场景。</p>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;"> </p>
<h3 style="margin: 10px 0px; padding: 0px; font-size: 16px; line-height: 1.5; font-family: verdana, Arial, Helvetica, sans-serif;">
<a name="t5"></a> 4.angular.Js</h3>
<ul style="margin: 0px 0px 0px 30px; padding: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">地址：</span>http://www.runoob.com/angularjs/angularjs-tutorial.html (中文网)</li>
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">描述：</span>AngularJS[1]  诞生于2009年，由Misko Hevery 等人创建，后为Google所收购。是一款优秀的前端JS框架，已经被用于Google的多款产品当中。AngularJS有着诸多特性，最为核心的是：MVVM、模块化、自动化双向数据绑定、语义化标签、依赖注入等等。</li>
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">用途：</span>通过描述我们应该就能很好的明白AngularJS的真实用途了，MVVM，模块化，自动化双向数据绑定等等。除了简单的dom操作外，更能体现Js编程的强大。当然应用应该视场合而定。</li>
</ul>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;"> </p>
<h3 style="margin: 10px 0px; padding: 0px; font-size: 16px; line-height: 1.5; font-family: verdana, Arial, Helvetica, sans-serif;">
<a name="t6"></a> <span style="margin: 0px; padding: 0px;">5.JQuery Mobile</span>
</h3>
<ul style="margin: 0px 0px 0px 30px; padding: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">地址：</span>http://www.w3school.com.cn/jquerymobile/    (中文网)</li>
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">描述：</span>Query Mobile是<a style="margin: 0px; padding: 0px; text-decoration: none; color: #000000; border-bottom-width: 1px; border-bottom-style: dotted; border-bottom-color: #333333;" href="http://baike.baidu.com/view/1020297.htm" target="_blank">jQuery</a> 在手机上和平板设备上的版本。jQuery Mobile 不仅会给主流移动平台带来jQuery核心库，而且会发布一个完整统一的jQuery移动UI框架。支持全球主流的移动平台。jQuery Mobile开发团队说：能开发这个项目，我们非常兴奋。移动Web太需要一个跨浏览器的框架，让开发人员开发出真正的移动Web网站。</li>
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">用途：</span>jQuery Mobile 是创建移动 web 应用程序的框架。</li>
</ul>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">　　　　　　jQuery Mobile 适用于所有流行的智能手机和平板电脑。</p>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">　　　　　　jQuery Mobile 使用 HTML5 和 CSS3 通过尽可能少的脚本对页面进行布局。</p>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;"> </p>
<h3 style="margin: 10px 0px; padding: 0px; font-size: 16px; line-height: 1.5; font-family: verdana, Arial, Helvetica, sans-serif;">
<a name="t7"></a> <span style="margin: 0px; padding: 0px;">6.requirejs</span>
</h3>
<ul style="margin: 0px 0px 0px 30px; padding: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">地址：</span>http://www.requirejs.cn/</li>
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">描述：</span>RequireJS的目标是鼓励代码的模块化，它使用了不同于传统&lt;script&gt;标签的脚本加载步骤。可以用它来加速、优化代码，但其主要目的还是为了代码的模块化。它鼓励在使用脚本时以module ID替代URL地址。</li>
</ul>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">RequireJS以一个相对于<a style="margin: 0px; padding: 0px; text-decoration: none; color: #000000; border-bottom-width: 1px; border-bottom-style: dotted; border-bottom-color: #333333;" href="http://makingmobile.org/docs/tools/requirejs-api-zh/#config-baseUrl" target="_blank">baseUrl</a>的地址来加载所有的代码。 页面顶层&lt;script&gt;标签含有一个特殊的属性data-main，require.js使用它来启动脚本加载过程，而baseUrl一般设置到与该属性相一致的目录。</p>
<ul style="margin: 0px 0px 0px 30px; padding: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">用途：</span>模块化动态加载。</li>
</ul>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;"> </p>
<h3 style="margin: 10px 0px; padding: 0px; font-size: 16px; line-height: 1.5; font-family: verdana, Arial, Helvetica, sans-serif;">
<a name="t8"></a> <span style="margin: 0px; padding: 0px;">7.Vue.js</span>
</h3>
<ul style="margin: 0px 0px 0px 30px; padding: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">地址：</span>http://cn.vuejs.org/</li>
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">描述：</span>Vue.js 是用于构建交互式的 Web  界面的库。它提供了 <a style="margin: 0px; padding: 0px; text-decoration: none; color: #000000; border-bottom-width: 1px; border-bottom-style: dotted; border-bottom-color: #333333;" href="http://www.yyyweb.com/" target="_blank">MVVM</a> 数据绑定和一个可组合的组件系统，具有简单、灵活的 API。从技术上讲， Vue.js 集中在 <a style="margin: 0px; padding: 0px; text-decoration: none; color: #000000; border-bottom-width: 1px; border-bottom-style: dotted; border-bottom-color: #333333;" href="http://www.yyyweb.com/" target="_blank">MVVM</a> 模式上的视图模型层，并通过双向数据绑定连接视图和模型。实际的 DOM 操作和输出格式被抽象出来成指令和过滤器。相比其它的 MVVM 框架，Vue.js 更容易上手。</li>
</ul>
<h3 style="margin: 10px 0px; padding: 0px; font-size: 16px; line-height: 1.5; font-family: verdana, Arial, Helvetica, sans-serif;">
<a name="t9"></a>  </h3>
<h3 style="margin: 10px 0px; padding: 0px; font-size: 16px; line-height: 1.5; font-family: verdana, Arial, Helvetica, sans-serif;">
<a name="t10"></a> 8.backbone.js</h3>
<ul style="margin: 0px 0px 0px 30px; padding: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">地址：</span>http://www.css88.com/doc/backbone/</li>
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">描述：</span><a style="margin: 0px; padding: 0px; text-decoration: none; color: #000000; border-bottom-width: 1px; border-bottom-style: dotted; border-bottom-color: #333333;" href="http://baike.baidu.com/view/342697.htm" target="_blank">Backbone</a> 为复杂Javascript应用程序提供模型(models)、集合(collections)、视图(views)的结构。其中模型用于绑定键值数据和自定义事件；集合附有可枚举函数的丰富API； 视图可以声明事件处理函数，并通过RESTful JSON接口连接到应用程序。</li>
</ul>
<h3 style="margin: 10px 0px; padding: 0px; font-size: 16px; line-height: 1.5; font-family: verdana, Arial, Helvetica, sans-serif;">
<a name="t11"></a>  </h3>
<h3 style="margin: 10px 0px; padding: 0px; font-size: 16px; line-height: 1.5; font-family: verdana, Arial, Helvetica, sans-serif;">
<a name="t12"></a> 9.React</h3>
<ul style="margin: 0px 0px 0px 30px; padding: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">地址：</span>http://reactjs.cn/react/docs/why-react.html</li>
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">描述：</span>React 是一个 Facebook 和 Instagram 用来创建用户界面的 JavaScript 库。很多人认为 React 是 <span style="margin: 0px; padding: 0px;"><a style="margin: 0px; padding: 0px; text-decoration: none; color: #000000; border-bottom-width: 1px; border-bottom-style: dotted; border-bottom-color: #333333;" href="http://en.wikipedia.org/wiki/Model%E2%80%93view%E2%80%93controller" target="_blank">MVC</a></span> 中的 <span style="margin: 0px; padding: 0px;">V</span>（视图）。我们创造 React 是为了解决一个问题：<span style="margin: 0px; padding: 0px;">构建随着时间数据不断变化的大规模应用程序</span>。为了达到这个目标，React 采用下面两个主要的思想。</li>
</ul>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;"> </p>
<h3 style="margin: 10px 0px; padding: 0px; font-size: 16px; line-height: 1.5; font-family: verdana, Arial, Helvetica, sans-serif;">
<a name="t13"></a> 10.Ionic </h3>
<ul style="margin: 0px 0px 0px 30px; padding: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">地址：</span>http://www.ionic.wang/js_doc-index.html</li>
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">描述：</span>Ionic既是一个CSS框架也是一个Javascript UI库。许多组件需要Javascript才能产生神奇的效果，尽管通常组件不需要编码，通过框架扩展可以很容易地使用，比如我们的AngularIonic扩展。
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px;">Ionic遵循视图控制模式，通俗的理解和 Cocoa 触摸框架相似。在视图控制模式中，我们将界面的不同部分分为子视图或包含其他视图的子视图控制器。然后视图控制器“驱动”内部视图来提供交互和UI功能。一个很好的例子就是标签栏（Tab Bar）视图控制器处理点击标签栏在一系列可视化面板间切换。</p>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px;">浏览我们的API文档来了解视图控制器和Ionic中可用的Javascript实用工具。</p>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px;">Ionic 是目前最有潜力的一款 HTML5 手机应用开发框架。通过 SASS 构建应用程序，它 提供了很多 UI 组件来帮助开发者开发强大的应用。 它使用 JavaScript MVVM 框架和 AngularJS 来增强应用。提供数据的双向绑定，使用它成为 Web 和移动开发者的共同选择。</p>
</li>
</ul>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;"> </p>
<h2 style="margin: 10px 0px; padding: 0px; line-height: 1.5; font-size: 21px; font-family: verdana, Arial, Helvetica, sans-serif;">
<a name="t14"></a> 二、前端UI框架</h2>
<h3 style="margin: 10px 0px; padding: 0px; font-size: 16px; line-height: 1.5; font-family: verdana, Arial, Helvetica, sans-serif;">
<a name="t15"></a> 1.Pure</h3>
<ul style="margin: 0px 0px 0px 30px; padding: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">地址：</span>http://purecss.org/layouts/</li>
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">描述：</span>Pure精心设计，只为可以在任何Web项目中使用。为了例证这一点，我们制作了如下几个模板。这些模板都是响应式的，并且没有使用任何JavaScript。</li>
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">用途：</span>真的是很精美的一个样式框架，便于我们快事构建一些个人产品，当然也可以服务于工作中的一些项目。</li>
</ul>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;"> </p>
<h3 style="margin: 10px 0px; padding: 0px; font-size: 16px; line-height: 1.5; font-family: verdana, Arial, Helvetica, sans-serif;">
<a name="t16"></a> 2.bootstrap</h3>
<ul style="margin: 0px 0px 0px 30px; padding: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">地址：</span>http://www.bootcss.com/</li>
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">描述：</span>简洁、直观、强悍的前端开发框架，让web开发更迅速、简单。</li>
</ul>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;"> </p>
<h3 style="margin: 10px 0px; padding: 0px; font-size: 16px; line-height: 1.5; font-family: verdana, Arial, Helvetica, sans-serif;">
<a name="t17"></a> <span style="margin: 0px; padding: 0px;">3.EasyUI</span>
</h3>
<ul style="margin: 0px 0px 0px 30px; padding: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">地址：</span>http://www.jeasyui.net/  (中文网)</li>
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">描述：</span>easyui是一种基于jQuery的用户界面插件集合。</li>
</ul>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">　　　　　　easyui为创建现代化，互动，JavaScript应用程序，提供必要的功能。</p>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">　　　　　　使用easyui你不需要写很多代码，你只需要通过编写一些简单HTML标记，就可以定义用户界面。</p>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">　　　　　　easyui是个完美支持HTML5网页的完整框架。</p>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">　　　　　　easyui节省您网页开发的时间和规模。</p>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">　　　　　　easyui很简单但功能强大的。</p>
<h3 style="margin: 10px 0px; padding: 0px; font-size: 16px; line-height: 1.5; font-family: verdana, Arial, Helvetica, sans-serif;">
<a name="t18"></a>  4.Ant Design</h3>
<ul style="margin: 0px 0px 0px 30px; padding: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">地址：</span>http://ant.design/</li>
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">描述：</span>一个 UI 设计语言，一套提炼和应用于企业级后台产品的交互语言和视觉体系</li>
</ul>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;"> </p>
<h2 style="margin: 10px 0px; padding: 0px; line-height: 1.5; font-size: 21px; font-family: verdana, Arial, Helvetica, sans-serif;">
<a name="t19"></a> 三、可视化组件</h2>
<h3 style="margin: 10px 0px; padding: 0px; font-size: 16px; line-height: 1.5; font-family: verdana, Arial, Helvetica, sans-serif;">
<a name="t20"></a> 1.Echarts</h3>
<ul style="margin: 0px 0px 0px 30px; padding: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">地址：</span>http://echarts.baidu.com/</li>
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">描述：</span>ECharts，一个纯 Javascript 的图表库，可以流畅的运行在 PC 和移动设备上，兼容当前绝大部分浏览器（IE8/9/10/11，Chrome，Firefox，Safari等），底层依赖轻量级的 Canvas 类库<a style="margin: 0px; padding: 0px; text-decoration: none; color: #000000; border-bottom-width: 1px; border-bottom-style: dotted; border-bottom-color: #333333;" href="https://github.com/ecomfe/zrender" target="_blank">ZRender</a>，提供直观，生动，可交互，可高度个性化定制的数据可视化图表。</li>
</ul>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;"> </p>
<h3 style="margin: 10px 0px; padding: 0px; font-size: 16px; line-height: 1.5; font-family: verdana, Arial, Helvetica, sans-serif;">
<a name="t21"></a> 2.tableau(收费)</h3>
<ul style="margin: 0px 0px 0px 30px; padding: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">地址：</span>http://www.yuandingit.com/special/tableau/index.html</li>
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">描述：</span>Tableau 是桌面系统中最简单的商业智能工具软件，Tableau 没有强迫用户编写自定义代码，新的控制台也可完全自定义配置。在控制台上，不仅能够监测信息，而且还提供完整的分析能力。Tableau控制台灵活，具有高度的动态性。</li>
</ul>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;"> </p>
<h2 style="margin: 10px 0px; padding: 0px; line-height: 1.5; font-size: 21px; font-family: verdana, Arial, Helvetica, sans-serif;">
<a name="t22"></a> <span style="margin: 0px; padding: 0px;">四、前端构建工具</span>
</h2>
<h3 style="margin: 10px 0px; padding: 0px; font-size: 16px; line-height: 1.5; font-family: verdana, Arial, Helvetica, sans-serif;">
<a name="t23"></a> 1.gulp</h3>
<ul style="margin: 0px 0px 0px 30px; padding: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">地址：</span>http://www.gulpjs.com.cn/</li>
<li style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">描述</span>：<span style="margin: 0px; padding: 0px;"><span style="margin: 0px; padding: 0px; line-height: 1.8; font-family: '宋体'; font-size: 15px;">易于使用</span></span>
</li>
</ul>
<div class="row" style="margin: 0px; padding: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">
<div class="col-md-6" style="margin: 0px; padding: 0px;"><span style="margin: 0px; padding: 0px; line-height: 1.8; font-family: '宋体'; font-size: 15px;">　　　　　　通过代码优于配置的策略，Gulp 让简单的任务简单，复杂的任务可管理。</span></div>
<div class="col-md-6" style="margin: 0px; padding: 0px;">
<h2 style="margin: 10px 0px; padding: 0px; color: #000000; line-height: 1.5; font-size: 21px;">
<a name="t24"></a> <span style="margin: 0px; padding: 0px; line-height: 1.8; font-family: '宋体'; font-size: 15px;">　　　　　　构建快速</span>
</h2>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px;"><span style="margin: 0px; padding: 0px; line-height: 1.8; font-family: '宋体'; font-size: 15px;">　　　　　　利用 Node.js 流的威力，你可以快速构建项目并减少频繁的 IO 操作。</span></p>
</div>
</div>
<div class="row" style="margin: 0px; padding: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">
<div class="col-md-6" style="margin: 0px; padding: 0px;">
<h2 style="margin: 10px 0px; padding: 0px; color: #000000; line-height: 1.5; font-size: 21px;">
<a name="t25"></a> <span style="margin: 0px; padding: 0px; line-height: 1.8; font-family: '宋体'; font-size: 15px;">　　　　　　插件高质</span>
</h2>
<span style="margin: 0px; padding: 0px; line-height: 1.8; font-family: '宋体'; font-size: 15px;">　　　　　　Gulp 严格的插件指南确保插件如你期望的那样简洁高质得工作。</span>
</div>
<div class="col-md-6" style="margin: 0px; padding: 0px;">
<h2 style="margin: 10px 0px; padding: 0px; color: #000000; line-height: 1.5; font-size: 21px;">
<a name="t26"></a> <span style="margin: 0px; padding: 0px; line-height: 1.8; font-family: '宋体'; font-size: 15px;">　　　　　　易于学习</span>
</h2>
<span style="margin: 0px; padding: 0px; line-height: 1.8; font-family: '宋体'; font-size: 15px;">　　　　　　通过最少的 API，掌握 Gulp 毫不费力，构建工作尽在掌握：如同一系列流管道。</span>
</div>
<div class="col-md-6" style="margin: 0px; padding: 0px;"> </div>
<h2 class="col-md-6" style="margin: 10px 0px; padding: 0px; color: #000000; line-height: 1.5; font-size: 21px;">
<a name="t27"></a> 五、博客搭建 </h2>
<h3 style="margin: 10px 0px; padding: 0px; color: #000000; font-size: 16px; line-height: 1.5;">
<a name="t28"></a> 1.技术组合</h3>
<p class="title" style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px;">　　HEXO+Github,搭建属于自己的博客。</p>
<p class="title" style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px;"><span style="margin: 0px; padding: 0px;">　　站点：</span>http://www.jianshu.com/p/465830080ea9</p>
<div class="col-md-6" style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">　　HEXO介绍：</span>Hexo是一个开源的静态博客生成器,用node.js开发,作者是台湾大学生tommy351</div>
<div class="col-md-6" style="margin: 0px; padding: 0px;">
<span style="margin: 0px; padding: 0px;">　　准备：</span>git  + node.js + markdown编辑 + gitcafe + 域名</div>
<div class="col-md-6" style="margin: 0px; padding: 0px;"> </div>
<div class="col-md-6" style="margin: 0px; padding: 0px;"> </div>
</div>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;"><span style="margin: 0px; padding: 0px;">小结：</span>本文做为知识梳理或者说资料梳理类文章，一方面用于自身知识的管理，同时也可以用做一个资料库备查。将持续更新。 </p>
<p style="margin: 10px auto; padding-top: 0px; padding-bottom: 0px; color: #333333; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 25.2px;">感谢小光同学的支持，Pure的提供很不错。 </p>
</div>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<div id="article_content" class="article_content csdn-tracking-statistics tracking-click" style="overflow: hidden;">
<div class="markdown_views">
<h2 id="1前言">
<a name="t0"></a>1.前言</h2>
<hr>
<p>最近有很多朋友问我有没有相关的书籍推荐，希望能够自学一下前端。</p>
<p>正好最近在查阅文章的时候，发现有朋友已经进行过总结。</p>
<p>经过沟通和“行贿”??，终于取得转载权利，在此感谢<a href="http://www.jianshu.com/u/9aae3d8f4c3d" target="_blank">晚晴幽草</a>的大力帮助。</p>
<p>作者将原素材文章进行了新内容的添加和重新排列，但是因为文章链接过多，难免会出现原始内容失效等问题，请大家海涵。</p>
<p>好了，那我接下来就开始正文咯。</p>
<h2 id="2-目录">
<a name="t1"></a>2. 目录</h2>
<hr>
<p>首先我们先来看一下文章的分区，以方便我们进行检索。</p>
<p>PS: 内容超长，请注意！</p>
<p> </p>
<div class="toc">
<ul>
<li>
<ul>
<li><a href="#1%E5%89%8D%E8%A8%80" target="">前言</a></li>
<li><a href="#2-%E7%9B%AE%E5%BD%95" target="">目录</a></li>
<li><a href="#3-%E5%85%A5%E9%97%A8%E7%B1%BB" target="">入门类</a></li>
<li><a href="#4-html-5-%E9%83%A8%E5%88%86" target="">HTML 5 部分</a></li>
<li><a href="#5-css-3-%E9%83%A8%E5%88%86" target="">CSS 3 部分</a></li>
<li><a href="#6-jquery" target="">JQuery</a></li>
<li><a href="#7-angular-js" target="">Angular JS</a></li>
<li><a href="#8-react" target="">React</a></li>
<li><a href="#9-vue" target="">Vue</a></li>
<li><a href="#10-node-js" target="">Node JS</a></li>
<li><a href="#11-js-template" target="">JS Template</a></li>
<li><a href="#12-%E7%A7%BB%E5%8A%A8%E7%AB%AF" target="">移动端</a></li>
<li><a href="#13-%E7%A7%BB%E5%8A%A8%E7%AB%AF-api" target="">移动端 API</a></li>
<li><a href="#14-%E7%BB%BC%E5%90%88-api" target="">综合 API</a></li>
<li><a href="#15-%E5%85%B6%E4%BB%96-api" target="">其他 API</a></li>
<li><a href="#16-%E7%BB%BC%E5%90%88%E7%B1%BB" target="">综合类</a></li>
<li><a href="#17-%E5%B7%A5%E5%85%B7%E7%B1%BB" target="">工具类</a></li>
<li><a href="#18-%E7%BB%BC%E5%90%88%E6%95%88%E6%9E%9C%E6%90%9C%E7%B4%A2%E5%B9%B3%E5%8F%B0" target="">综合效果搜索平台</a></li>
<li><a href="#19-%E5%9B%A2%E9%98%9F-blog" target="">团队 BLOG</a></li>
<li><a href="#20-%E5%BC%80%E5%8F%91%E4%B8%AD%E5%BF%83" target="">开发中心</a></li>
<li><a href="#21-ecmascript" target="">ECMAScript</a></li>
<li><a href="#22-d3" target="">D3</a></li>
<li><a href="#23-requriejs" target="">RequrieJS</a></li>
<li><a href="#24-seajs" target="">SeaJS</a></li>
<li><a href="#25-less-sass" target="">Less Sass</a></li>
<li><a href="#26-markdown" target="">Markdown</a></li>
<li><a href="#27-%E5%85%BC%E5%AE%B9%E6%80%A7" target="">兼容性</a></li>
<li><a href="#28-ui%E7%9B%B8%E5%85%B3" target="">UI相关</a></li>
<li><a href="#29-%E5%9B%BE%E8%A1%A8%E7%B1%BB" target="">图表类</a></li>
<li><a href="#30-%E6%AD%A3%E5%88%99%E8%A1%A8%E8%BE%BE%E5%BC%8F" target="">正则表达式</a></li>
<li><a href="#31-%E5%89%8D%E7%AB%AF%E8%A7%84%E8%8C%83" target="">前端规范</a></li>
<li><a href="#32-php" target="">PHP</a></li>
<li><a href="#33-%E5%90%84%E5%A4%A7%E5%85%AC%E5%8F%B8%E5%BC%80%E6%BA%90%E9%A1%B9%E7%9B%AE" target="">各大公司开源项目</a></li>
<li><a href="#34-%E5%B8%B8%E7%94%A8" target="">常用</a></li>
<li><a href="#35-%E7%AE%97%E6%B3%95" target="">算法</a></li>
<li><a href="#36-json" target="">JSON</a></li>
<li><a href="#37-ext-easyui-j-ui-%E5%8F%8A%E5%85%B6%E5%AE%83%E5%90%84%E7%A7%8Dui%E6%96%B9%E6%A1%88" target="">Ext EasyUI J-UI 及其它各种UI方案</a></li>
<li><a href="#38-%E9%A1%B5%E9%9D%A2-%E7%A4%BE%E4%BC%9A%E5%8C%96-%E5%88%86%E4%BA%AB%E5%8A%9F%E8%83%BD" target="">页面 社会化 分享功能</a></li>
<li><a href="#39-%E5%AF%8C%E6%96%87%E6%9C%AC%E7%BC%96%E8%BE%91%E5%99%A8" target="">富文本编辑器</a></li>
<li><a href="#40-%E5%89%8D%E7%AB%AF%E6%A6%82%E8%BF%B0" target="">前端概述</a></li>
<li><a href="#41-gulp" target="">Gulp</a></li>
<li><a href="#42-grunt" target="">Grunt</a></li>
<li><a href="#43-fis" target="">Fis</a></li>
<li><a href="#44-pc%E5%9B%BE%E8%BD%AE" target="">pc图轮</a></li>
<li><a href="#45-%E7%A7%BB%E5%8A%A8%E7%AB%AF%E5%9B%BE%E8%BD%AE" target="">移动端图轮</a></li>
<li><a href="#46-%E6%96%87%E4%BB%B6%E4%B8%8A%E4%BC%A0" target="">文件上传</a></li>
<li><a href="#47-%E6%A8%A1%E6%8B%9Fselect" target="">模拟select</a></li>
<li><a href="#48-%E5%8F%96%E8%89%B2%E6%8F%92%E4%BB%B6" target="">取色插件</a></li>
<li><a href="#49-%E5%9F%8E%E5%B8%82%E8%81%94%E5%8A%A8" target="">城市联动</a></li>
<li><a href="#50-%E5%89%AA%E8%B4%B4%E6%9D%BF" target="">剪贴板</a></li>
<li><a href="#51-%E7%AE%80%E7%B9%81%E8%BD%AC%E6%8D%A2" target="">简繁转换</a></li>
<li><a href="#52-%E8%A1%A8%E6%A0%BC-grid" target="">表格 Grid</a></li>
<li><a href="#53-%E5%9C%A8%E7%BA%BF%E6%BC%94%E7%A4%BA" target="">在线演示</a></li>
<li><a href="#54-%E5%B8%B8%E8%A7%84%E4%BC%98%E5%8C%96" target="">常规优化</a></li>
<li><a href="#55-%E4%BC%98%E5%8C%96%E5%B7%A5%E5%85%B7" target="">优化工具</a></li>
<li><a href="#56-%E5%9C%A8%E7%BA%BF%E5%B7%A5%E5%85%B7" target="">在线工具</a></li>
<li><a href="#57-%E5%89%8D%E7%AB%AF%E6%9E%B6%E6%9E%84" target="">前端架构</a></li>
<li><a href="#58-%E6%8E%A8%E8%8D%90%E4%BD%9C%E5%93%81" target="">推荐作品</a></li>
<li><a href="#59-%E7%AE%80%E5%8E%86%E6%A8%A1%E6%9D%BF" target="">简历模板</a></li>
<li><a href="#60-%E6%B1%82%E8%81%8C" target="">求职</a></li>
<li><a href="#61-%E9%9D%A2%E8%AF%95%E9%A2%98" target="">面试题</a></li>
<li><a href="#62-iconfont" target="">iconfont</a></li>
<li><a href="#63-fiddler" target="">Fiddler</a></li>
<li><a href="#64-chrome" target="">Chrome</a></li>
<li><a href="#65-firebug" target="">Firebug</a></li>
<li><a href="#66-%E7%A7%BB%E5%8A%A8%E5%BE%AE%E4%BF%A1%E8%B0%83%E8%AF%95" target="">移动微信调试</a></li>
<li><a href="#67-ios-simulator" target="">iOS Simulator</a></li>
<li><a href="#68-image" target="">Image</a></li>
<li><a href="#69-%E6%B5%8F%E8%A7%88%E5%99%A8%E5%90%8C%E6%AD%A5" target="">浏览器同步</a></li>
<li><a href="#70-%E5%9C%A8%E7%BA%BFppt%E5%88%B6%E4%BD%9C" target="">在线PPT制作</a></li>
<li><a href="#71-%E5%89%8D%E7%AB%AF%E5%AF%BC%E8%88%AA%E7%BD%91%E7%AB%99" target="">前端导航网站</a></li>
<li><a href="#72-%E5%B8%B8%E7%94%A8cdn" target="">常用CDN</a></li>
<li><a href="#73-git" target="">Git</a></li>
<li><a href="#74-%E5%90%84%E7%A7%8D%E6%97%A5%E6%9C%9F%E6%97%A5%E5%8E%86" target="">各种日期日历</a></li>
<li><a href="#75-date-library" target="">Date library</a></li>
<li><a href="#76-%E5%85%B6%E5%AE%83" target="">其它</a></li>
<li><a href="#77-%E6%95%88%E6%9E%9C%E7%B1%BB" target="">效果类</a></li>
<li><a href="#78-%E5%BC%B9%E5%87%BA%E5%B1%82" target="">弹出层</a></li>
<li><a href="#79-%E4%BC%98%E7%A7%80javascript%E9%A1%B9%E7%9B%AE" target="">优秀JavaScript项目</a></li>
<li><a href="#80-%E5%85%B6%E4%BB%96%E4%B8%80%E4%BA%9B%E6%8E%A8%E8%8D%90" target="">其他一些推荐</a></li>
</ul>
</li>
</ul>
</div>
<p> </p>
<h2 id="3-入门类">
<a name="t2"></a>3. 入门类</h2>
<hr>
<ul>
<li><a href="http://www.cnblogs.com/jikey/p/3613082.html" target="_blank">前端入门教程</a></li>
<li><a href="http://www.liaoxuefeng.com/wiki/001434446689867b27157e896e74d51a89c25cc8b43bdb3000" target="_blank">瘳雪峰的Javascript教程</a></li>
<li><a href="http://www.imooc.com/view/506" target="_blank">前端工程师必备的PS技能——切图篇</a></li>
<li><a href="https://github.com/qiu-deqing/FE-learning" target="_blank">结合个人经历总结的前端入门方法</a></li>
<li><a href="http://www.jianshu.com/u/5a2fd0b8fb30" target="_blank">作者的简书地址</a></li>
<li><a href="http://blog.csdn.net/mr_lp?viewmode=contents" target="_blank">作者的CSDN地址</a></li>
<li><a href="http://www.jianshu.com/p/08c7eb2669f7" target="_blank">HTML 修真录——初识”异界”</a></li>
<li><a href="http://www.jianshu.com/p/100bda3f045e" target="_blank">HTML 修真录——”深渊三君王”</a></li>
<li><a href="http://www.jianshu.com/p/bec0e2df1b52" target="_blank">HTML 基础入门</a></li>
<li><a href="http://www.jianshu.com/p/f624b2999a1d" target="_blank">HTML 基础提升</a></li>
<li><a href="http://www.jianshu.com/p/715a9013871f" target="_blank">CSS 基础入门</a></li>
<li><a href="http://www.jianshu.com/p/54376ba7c28a" target="_blank">CSS 盒模型</a></li>
<li><a href="http://www.jianshu.com/p/e358d77373c3" target="_blank">CSS 浮动</a></li>
<li><a href="http://www.jianshu.com/p/d465583a9ebe" target="_blank">CSS 定位</a></li>
</ul>
<h2 id="4-html-5-部分">
<a name="t3"></a>4. HTML 5 部分</h2>
<hr>
<ul>
<li><a href="https://segmentfault.com/a/1190000002695791" target="_blank">深入理解HTML5标签</a></li>
<li><a href="https://segmentfault.com/a/1190000002680822" target="_blank">如何写出高效率的HTML</a></li>
<li><a href="https://segmentfault.com/a/1190000004279791" target="_blank">HTML meta标签总结与属性使用介绍</a></li>
<li><a href="http://www.cnblogs.com/dojo-lzz/p/5059316.html" target="_blank">戏说HTML5</a></li>
<li><a href="http://www.jianshu.com/p/6f6c64abab2a" target="_blank">编写高质量的 HTML 代码</a></li>
<li><a href="http://www.jianshu.com/p/796de6ac0943" target="_blank">如何解决 img 标签上下出现的间隙</a></li>
<li><a href="http://www.jianshu.com/p/d9ec1ef9c1e8" target="_blank">五分钟学会 Canvas 基础（一）</a></li>
<li><a href="http://www.jianshu.com/p/2f79c3d8f9d0" target="_blank">五分钟学会 Canvas 基础（二）</a></li>
<li><a href="http://www.jianshu.com/p/d4a1d4acf68a" target="_blank">模仿 LED 灯的滚动文字效果</a></li>
<li><a href="http://www.jianshu.com/p/597da90a6c89" target="_blank">关于 Canvas 的兄弟 SVG 的基础教程</a></li>
<li><a href="http://www.jianshu.com/p/f4da2e878874" target="_blank">HTML 5 动态效果制作方法整理</a></li>
<li><a href="http://www.jianshu.com/p/322c7188cbbd" target="_blank">Canvas 效果实例</a></li>
<li><a href="http://www.jianshu.com/p/3a0ff7ac34a0" target="_blank">细数前端中的一些黑科技</a></li>
<li><a href="http://www.jianshu.com/p/850d2a209ba8" target="_blank">前端 Meta 用法大汇总</a></li>
<li><a href="http://www.jianshu.com/p/830321c3666d" target="_blank">HTML5新特性</a></li>
</ul>
<h2 id="5-css-3-部分">
<a name="t4"></a>5. CSS 3 部分</h2>
<hr>
<ul>
<li><a href="http://tympanus.net/codrops/css_reference" target="_blank">CSS 语法参考</a></li>
<li><a href="https://github.com/chadluo/CSS-Guidelines/blob/master/README.md" target="_blank">如何编写可维护的CSS</a></li>
<li><a href="http://isux.tencent.com/css3/index.html" target="_blank">CSS3动画手册</a></li>
<li><a href="http://isux.tencent.com/css3/tools.html" target="_blank">腾讯css3动画制作工具</a></li>
<li><a href="http://linxz.github.io/tianyizone" target="_blank">志爷css小工具集合</a></li>
<li><a href="http://www.note12.com/category/blog/2014-6-5/538fe0a9f786f1b7019a4dfb" target="_blank">css3 js 移动大杂烩</a></li>
<li><a href="http://bouncejs.com" target="_blank">bouncejs 触摸库</a></li>
<li><a href="http://daneden.github.io/animate.css" target="_blank">animate.css</a></li>
<li><a href="http://www.alloyteam.com/2015/10/8536" target="_blank">全局CSS的终结</a></li>
<li><a href="http://browserhacks.com" target="_blank">browserhacks</a></li>
<li><a href="http://www.jianshu.com/p/d19bd3a34edd" target="_blank">CSS3其他属性</a></li>
<li><a href="http://www.jianshu.com/p/74525dbe7f33" target="_blank">弹性盒模型详解</a></li>
<li><a href="http://www.jianshu.com/p/57ba5da7f9f6" target="_blank">CSS3动画</a></li>
<li><a href="http://www.jianshu.com/p/1ea95cdba9df" target="_blank">2D变形&amp;3D变形</a></li>
<li><a href="http://www.jianshu.com/p/88d62bbdaaf5" target="_blank">蒙版mask</a></li>
</ul>
<h2 id="6-jquery">
<a name="t5"></a>6. JQuery</h2>
<hr>
<ul>
<li><a href="http://youmightnotneedjquery.com/" target="_blank">YOU MIGHT NOT NEED JQUERY</a></li>
<li><a href="http://www.jquery123.com" target="_blank">jQuery API 中文文档</a></li>
<li><a href="http://hemin.cn/jq" target="_blank">hemin 在线版</a></li>
<li><a href="http://www.css88.com/jqapi-1.9/on" target="_blank">css88 jq api</a></li>
<li><a href="http://www.css88.com/jquery-ui-api" target="_blank">css88 jqui api</a></li>
<li><a href="http://learn.jquery.com" target="_blank">学习jquery</a></li>
<li><a href="http://james.padolsey.com/jquery" target="_blank">jquery 源码查找</a></li>
<li><a href="http://www.cnblogs.com/jihua/p/webfront.html" target="_blank">Web前端资源汇总(jQuery,Js,Css3等)</a></li>
</ul>
<h2 id="7-angular-js">
<a name="t6"></a>7. Angular JS</h2>
<hr>
<ul>
<li><a href="https://github.com/dolymood/AngularLearning" target="_blank">Angular.js 的一些学习资源</a></li>
<li><a href="http://angularjs.cn" target="_blank">angularjs中文社区</a></li>
<li><a href="http://www.cnblogs.com/xuwenmin888/p/3739096.html" target="_blank">Angularjs源码学习</a></li>
<li><a href="http://www.ifeenan.com/?c=AngularJS" target="_blank">Angularjs源码学习</a></li>
<li><a href="http://angular-ui.github.io/bootstrap" target="_blank">angular对bootstrap的封装</a></li>
<li><a href="https://cnodejs.org/topic/51404e0f069911196d2e3923" target="_blank">angularjs + nodejs</a></li>
<li><a href="http://www.cnblogs.com/lvdabao/tag/AngularJs" target="_blank">吕大豹 Angularjs</a></li>
<li><a href="http://www.infoq.com/cn/news/2013/02/angular-web-app" target="_blank">AngularJS 最佳实践</a></li>
<li><a href="http://www.lovelucy.info/angularjs-best-practices.html" target="_blank">Angular的一些扩展指令</a></li>
<li><a href="https://github.com/Pasvaz/bindonce" target="_blank">Angular数据绑定原理</a></li>
<li><a href="https://github.com/angular-ui" target="_blank">一些扩展Angular UI组件</a></li>
<li><a href="http://voidcanvas.com/emberjs-vs-angularjs-performance-testing" target="_blank">Ember和AngularJS的性能测试</a></li>
<li><a href="http://www.cnblogs.com/powertoolsteam/p/angularjs-introdection.html" target="_blank">带你走近AngularJS - 基本功能介绍</a></li>
<li><a href="http://angular.duapp.com/docs/guide" target="_blank">Angularjs开发指南</a></li>
<li><a href="http://www.cnblogs.com/amosli/p/3710648.html" target="_blank">Angularjs学习</a></li>
<li><a href="http://www.rainweb.cn/article/angularjs-jquery.html" target="_blank">不要带着jQuery的思维去学习AngularJS</a></li>
<li><a href="http://wangjiatao.diandian.com/?tag=angularjs" target="_blank">angularjs 学习笔记</a></li>
<li><a href="http://www.angularjs.cn/T008" target="_blank">angularjs 开发指南</a></li>
<li><a href="https://github.com/jmcunningham/AngularJS-Learning" target="_blank">angularjs 英文资料</a></li>
<li><a href="http://angular-ui.github.io/bootstrap" target="_blank">angular bootstrap</a></li>
<li><a href="https://github.com/opitzconsulting/jquery-mobile-angular-adapter" target="_blank">angular jq mobile</a></li>
<li><a href="http://mgcrea.github.io/angular-strap" target="_blank">angular ui</a></li>
<li><a href="http://www.tuicool.com/articles/7ZZVr2" target="_blank">整合jQuery Mobile+AngularJS经验谈</a></li>
<li><a href="http://blog.jobbole.com/46589/" target="_blank">有jQuery背景，该如何用AngularJS编程思想</a></li>
<li><a href="http://each.sinaapp.com/angular" target="_blank">AngularJS在线教程</a></li>
<li><a href="http://www.zouyesheng.com/angular.html" target="_blank">angular学习笔记</a></li>
</ul>
<h2 id="8-react">
<a name="t7"></a>8. React</h2>
<hr>
<ul>
<li><a href="http://www.react-china.org" target="_blank">react.js中文论坛</a></li>
<li><a href="https://facebook.github.io/react/index.html" target="_blank">react.js官方网址</a></li>
<li><a href="https://facebook.github.io/react/docs/getting-started.html" target="_blank">react.js官方文档</a></li>
<li><a href="http://material-ui.com/" target="_blank">react.jsmaterialUI</a></li>
<li><a href="http://touchstonejs.io" target="_blank">react.jsTouchstoneJSUI</a></li>
<li><a href="http://amazeui.org/react" target="_blank">react.jsamazeuiUI</a></li>
<li><a href="http://www.ruanyifeng.com/blog/2015/03/react.html" target="_blank">React入门实例教程-阮一峰</a></li>
<li><a href="http://wiki.jikexueyuan.com/project/react-native" target="_blank">ReactNative中文版</a></li>
<li><a href="http://www.html-js.com/article/Fakefish%203053" target="_blank">Webpack和React小书-前端乱炖</a></li>
<li><a href="https://fakefish.github.io/react-webpack-cookbook" target="_blank">Webpack和React小书-gitbook</a></li>
<li><a href="https://github.com/webpack/webpack" target="_blank">webpack</a></li>
<li><a href="http://html-js.com/article/3009" target="_blank">Webpack，101入门体验</a></li>
<li><a href="http://html-js.com/article/3113" target="_blank">webpack入门教程</a></li>
<li><a href="http://segmentfault.com/a/1190000003499526" target="_blank">基于webpack搭建前端工程解决方案探索</a></li>
</ul>
<h2 id="9-vue">
<a name="t8"></a>9. Vue</h2>
<hr>
<ul>
<li><a href="https://vuefe.cn/" target="_blank">Vue2.0</a></li>
<li><a href="http://cn.vuejs.org" target="_blank">Vue</a></li>
<li><a href="https://router.vuejs.org/" target="_blank">Vue Router</a></li>
<li><a href="https://vuex.vuejs.org/" target="_blank">Vuex</a></li>
<li><a href="https://github.com/vuejs/vue-cli" target="_blank">Vue-Cli</a></li>
<li><a href="http://forum.vuejs.org" target="_blank">Vue 论坛</a></li>
<li><a href="https://gitter.im/vuejs/vue" target="_blank">Vue 聊天室</a></li>
<li><a href="http://www.cnblogs.com/aaronjs/p/3660102.html" target="_blank">Vue 入门指南</a></li>
<li><a href="http://segmentfault.com/a/1190000000411057" target="_blank">Vue 的一些资源索引</a></li>
<li><a href="https://github.com/vuejs/awesome-vue" target="_blank">awesome-vue</a></li>
<li><a href="https://github.com/vuejs/vue-syntax-highlight" target="_blank">vue-syntax-highlight</a></li>
</ul>
<h2 id="10-node-js">
<a name="t9"></a>10. Node JS</h2>
<hr>
<ul>
<li><a href="https://github.com/alsotang/node-lessons" target="_blank">Node.js 包教不包会</a></li>
<li><a href="http://60sky.com" target="_blank">一个nodejs博客</a></li>
<li><a href="http://www.cnblogs.com/yexiaochai/p/3536547.html" target="_blank">【NodeJS 学习笔记04】新闻发布系统</a></li>
<li><a href="http://www.cnblogs.com/qqloving/p/3541099.html" target="_blank">过年7天乐，学nodejs 也快乐</a></li>
<li><a href="https://github.com/nqdeng/7-days-nodejs" target="_blank">七天学会NodeJS</a></li>
<li><a href="http://www.cnblogs.com/zhongweiv/p/nodejs_events.html" target="_blank">Nodejs学习笔记（二）— 事件模块</a></li>
<li><a href="http://www.cnblogs.com/liusuqi/p/3735491.html" target="_blank">nodejs入门</a></li>
<li><a href="https://github.com/zensh/jsgen" target="_blank">angularjs nodejs</a></li>
<li><a href="http://blog.fens.me/series-nodejs" target="_blank">从零开始nodejs系列文章</a></li>
<li><a href="http://debuggable.com/posts/understanding-node-js:4bd98440-45e4-4a9a-8ef7-0f7ecbdd56cb" target="_blank">理解nodejs</a></li>
<li><a href="http://blog.mixu.net/2011/02/01/understanding-the-node-js-event-loop" target="_blank">nodejs事件轮询</a></li>
<li><a href="http://www.nodebeginner.org/index-zh-cn.html" target="_blank">node入门</a></li>
<li><a href="http://ourjs.com/detail/53e1f281c5910a9806000001" target="_blank">nodejs cms</a></li>
<li><a href="http://ourjs.com/detail/529ca5950cb6498814000005" target="_blank">Node初学者入门，一本全面的NodeJS教程</a></li>
<li><a href="http://www.barretlee.com/blog/2015/10/07/debug-nodejs-in-command-line" target="_blank">NodeJS的代码调试和性能调优</a></li>
</ul>
<h2 id="11-js-template">
<a name="t10"></a>11. <strong>JS Template</strong>
</h2>
<hr>
<ul>
<li><a href="http://garann.github.io/template-chooser" target="_blank">template-chooser</a></li>
<li><a href="https://github.com/aui/artTemplate" target="_blank">artTemplate</a></li>
<li><a href="https://github.com/aui/tmodjs/blob/master/README.md" target="_blank">tomdjs</a></li>
<li><a href="http://juicer.name/docs/docs_zh_cn.html" target="_blank">淘宝模板juicer模板</a></li>
<li><a href="http://koen301.github.io/fxtpl" target="_blank">Fxtpl v1.0 繁星前端模板引擎</a></li>
<li><a href="http://laytpl.layui.com" target="_blank">laytpl</a></li>
<li><a href="https://github.com/mozilla/nunjucks" target="_blank">mozilla - nunjucks</a></li>
<li><a href="https://github.com/PaulGuo/Juicer" target="_blank">Juicer</a></li>
<li><a href="http://akdubya.github.io/dustjs" target="_blank">dustjs</a></li>
<li><a href="http://ecomfe.github.io/etpl" target="_blank">etpl</a></li>
</ul>
<h2 id="12-移动端">
<a name="t11"></a>12. 移动端</h2>
<hr>
<ul>
<li><a href="https://github.com/ftlabs/fastclick" target="_blank">fastclick</a></li>
<li><a href="https://github.com/mmastrac/jquery-noclickdelay" target="_blank">no-click-delay</a></li>
<li><a href="http://www.cnblogs.com/lcw/p/3619181.html" target="_blank">【敏捷开发】Android团队开发规范</a></li>
<li><a href="http://www.jianshu.com/p/4390f4fe19b3" target="_blank">Android 开发规范与应用</a></li>
<li><a href="https://github.com/ychow/ionic-guide" target="_blank">ionic</a></li>
</ul>
<h2 id="13-移动端-api">
<a name="t12"></a>13. 移动端 API</h2>
<hr>
<ul>
<li><a href="https://github.com/jtyjty99999/mobileTech" target="_blank">99移动端知识集合</a></li>
<li><a href="https://github.com/AlloyTeam/Mars" target="_blank">移动端前端开发知识库</a></li>
<li><a href="http://caibaojian.com/mobile-web-bug.html" target="_blank">移动前端的一些坑和解决方法（外观表现）</a></li>
<li><a href="http://www.cnblogs.com/PeunZhang/p/3407453.html" target="_blank">【原】移动web资源整理</a></li>
<li><a href="http://mweb.baidu.com/zeptoapi" target="_blank">zepto 1.0 中文手册</a></li>
<li><a href="http://www.html-5.cn/Manual/Zepto" target="_blank">zepto 1.0 中文手册</a></li>
<li><a href="http://www.css88.com/doc/zeptojs_api" target="_blank">zepto 1.1.2</a></li>
<li><a href="http://www.cnblogs.com/sky000/archive/2013/03/29/2988952.html" target="_blank">zepto 中文注释</a></li>
<li><a href="http://app-framework-software.intel.com/api.php" target="_blank">jqmobile 手册</a></li>
<li><a href="https://github.com/maxzhang/maxzhang.github.com/issues" target="_blank">移动浏览器开发集合</a></li>
<li><a href="https://github.com/hoosin/mobile-web-favorites" target="_blank">移动开发大杂烩</a></li>
</ul>
<h2 id="14-综合-api">
<a name="t13"></a>14. 综合 API</h2>
<hr>
<ul>
<li><a href="http://www.javascripting.com" target="_blank">javascripting</a></li>
<li><a href="http://microjs.com" target="_blank">各种流行库搜索</a></li>
<li><a href="http://www.runoob.com" target="_blank">runoob.com-包含各种API集合</a></li>
<li><a href="http://tool.oschina.net/apidocs" target="_blank">开源中国在线API文档合集</a></li>
<li><a href="http://devdocs.io" target="_blank">devdocs(英文综合API网站)</a></li>
</ul>
<h2 id="15-其他-api">
<a name="t14"></a>15. 其他 API</h2>
<hr>
<ul>
<li><a href="http://segmentfault.com/bookmark/1230000002521721" target="_blank">HTTP API 设计指南</a></li>
<li><a href="/admin/blogs/javascriptoo" target="_blank">javascript流行库汇总</a></li>
<li><a href="http://niceue.com/validator/demo/index.php" target="_blank">验证api</a></li>
<li><a href="http://www.css88.com/doc/underscore" target="_blank">underscore 中文手册</a></li>
<li><a href="http://www.html-js.com/article/Underscorejs-source-code-analysis-of-underscorejs-source-code-analysis%203031" target="_blank">underscore源码分析</a></li>
<li><a href="http://yalishizhude.github.io/tags/underscore" target="_blank">underscore源码分析-亚里士朱德的博客</a></li>
<li><a href="http://underscorejs.org" target="_blank">underscrejs en api</a></li>
<li><a href="https://lodash.com" target="_blank">lodash - underscore的代替品</a></li>
<li><a href="http://extjs-doc-cn.github.io/ext4api" target="_blank">ext4api</a></li>
<li><a href="http://dev.qwrap.com/resource/js/_docs/_youa/#/qw/base/loadJs_.htm" target="_blank">qwrap手册</a></li>
<li><a href="http://easings.net/zh-cn" target="_blank">缓动函数</a></li>
<li><a href="http://www.w3school.com.cn/svg/svg_reference.asp" target="_blank">svg 中文参考</a></li>
<li><a href="https://developer.mozilla.org/en-US/docs/Web/SVG" target="_blank">svg mdn参考</a></li>
<li><a href="https://github.com/gabelerner/canvg" target="_blank">svg 导出 canvas</a></li>
<li><a href="https://github.com/exupero/saveSvgAsPng" target="_blank">svg 导出 png</a></li>
<li><a href="http://www.zamzar.com/convert/ai-to-svg" target="_blank">ai-to-svg</a></li>
<li><a href="https://github.com/machao/localStorage" target="_blank">localStorage 库</a></li>
</ul>
<h2 id="16-综合类">
<a name="t15"></a>16. <strong>综合类</strong>
</h2>
<hr>
<ul>
<li><a href="http://www.cnblogs.com/sb19871023/p/3894452.html" target="_blank">前端知识体系</a></li>
<li><a href="https://github.com/JacksonTian/fks" target="_blank">前端知识结构</a></li>
<li><a href="https://github.com/unruledboy/WebFrontEndStack" target="_blank">Web前端开发大系概览</a></li>
<li><a href="http://www.cnblogs.com/unruledboy/p/WebFrontEndStack.html" target="_blank">Web前端开发大系概览-中文版</a></li>
<li>[Web Front-end Stack v2.2](Web Front-end Stack v2.2)</li>
<li><a href="https://github.com/justjavac/free-programming-books-zh_CN" target="_blank">免费的编程中文书籍索引</a></li>
<li><a href="https://github.com/dypsilon/frontend-dev-bookmarks" target="_blank">前端书籍</a></li>
<li><a href="https://github.com/vhf/free-programming-books" target="_blank">前端免费书籍大全</a></li>
<li><a href="http://www.cnblogs.com/sb19871023/p/3894452.html" target="_blank">前端知识体系</a></li>
<li><a href="https://github.com/justjavac/free-programming-books-zh_CN" target="_blank">免费的编程中文书籍索引</a></li>
<li><a href="http://study.163.com/course/introduction/224014.htm" target="_blank">智能社 - 精通JavaScript开发</a></li>
<li><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/A_re-introduction_to_JavaScript" target="_blank">重新介绍 JavaScript（JS 教程）</a></li>
<li><a href="http://v.163.com/special/opencourse/bianchengdaolun.html" target="_blank">麻省理工学院公开课：计算机科学及编程导论</a></li>
<li><a href="http://segmentfault.com/a/1190000002640298" target="_blank">JavaScript中的this陷阱的最全收集–没有之一</a></li>
<li><a href="https://llh911001.gitbooks.io/mostly-adequate-guide-chinese/content/ch1.html" target="_blank">JS函数式编程指南</a></li>
<li><a href="http://liubin.github.io/promises-book" target="_blank">JavaScript Promise迷你书（中文版）</a></li>
<li><a href="https://github.com/AlloyTeam/Mars" target="_blank">腾讯移动Web前端知识库</a></li>
<li><a href="https://github.com/Front-End-Developers-Hunan/Front-End-Develop-Guide" target="_blank">Front-End-Develop-Guide 前端开发指南</a></li>
<li><a href="https://li-xinyang.gitbooks.io/frontend-notebook/content" target="_blank">前端开发笔记本</a></li>
<li><a href="https://github.com/nieweidong/fetool" target="_blank">大前端工具集 - 聂微东</a></li>
<li><a href="https://dwqs.gitbooks.io/frontenddevhandbook/content" target="_blank">前端开发者手册</a></li>
</ul>
<h2 id="17-工具类">
<a name="t16"></a>17. 工具类</h2>
<hr>
<ul>
<li>[前端人的俱乐部](<a href="http://f2er.club/" target="_blank">http://f2er.club/</a> 真可以解放你的收藏夹)</li>
<li><a href="http://www.jeffjade.com/2015/12/15/2015-04-17-toss-sublime-text/" target="_blank">如何优雅地使用Sublime Text</a></li>
<li><a href="http://www.jeffjade.com/2016/03/03/2016-03-02-how-to-use-atom/" target="_blank">新编码神器Atom使用纪要</a></li>
<li><a href="http://www.imooc.com/learn/93" target="_blank">css sprite 雪碧图制作</a></li>
<li><a href="http://www.imooc.com/learn/390" target="_blank">版本控制入门 – 搬进 Github</a></li>
<li><a href="http://www.imooc.com/learn/30" target="_blank">Grunt-beginner前端自动化工具</a></li>
<li><a href="https://github.com/judasn/IntelliJ-IDEA-Tutorial" target="_blank">IntelliJ IDEA 简体中文专题教程</a></li>
<li><a href="https://github.com/jikeytang/sublime-text" target="_blank">SublimeText</a></li>
<li><a href="https://atom.io" target="_blank">Atom</a></li>
<li><a href="https://code.visualstudio.com" target="_blank">visual studio code</a></li>
</ul>
<h2 id="18-综合效果搜索平台">
<a name="t17"></a>18. 综合效果搜索平台</h2>
<hr>
<ul>
<li><a href="https://github.com/jobbole/awesome-javascript-cn" target="_blank">JavaScript 资源大全中文版</a></li>
<li><a href="https://xituqu.com/170.html" target="_blank">100+ 超全的web开发工具和资源</a></li>
<li><a href="http://hao.uisdc.com/" target="_blank">设计师网址导航</a></li>
<li><a href="http://so.chongbuluo.com/" target="_blank">快搜</a></li>
<li><a href="http://www.iconfont.cn/" target="_blank">阿里iconfont</a></li>
<li>[zoommyapp.com](<a href="http://zoommyapp.com/" target="_blank">http://zoommyapp.com/</a> 高质量图库)</li>
<li>[unsplash.com](<a href="https://unsplash.com/" target="_blank">https://unsplash.com/</a> 高质量图库)</li>
<li>[www.pinterest.com](<a href="https://www.pinterest.com/" target="_blank">https://www.pinterest.com/</a> 图库)</li>
<li>[New Old Stock](<a href="http://nos.twnsnd.co" target="_blank">http://nos.twnsnd.co</a> 复古风图库)</li>
<li>[500px.com](<a href="https://500px.com/" target="_blank">https://500px.com/</a> 唯美照片)</li>
<li><a href="http://www.jq22.com" target="_blank">效果网</a></li>
<li><a href="http://huaban.com/" target="_blank">花瓣网</a></li>
<li><a href="http://www.topit.me/" target="_blank">优美图</a></li>
<li><a href="http://codepen.io/" target="_blank">codepen</a></li>
<li><a href="http://699pic.com/" target="_blank">摄图网</a></li>
<li><a href="http://microjs.com" target="_blank">常用的JavaScript代码片段</a></li>
</ul>
<h2 id="19-团队-blog">
<a name="t18"></a>19. 团队 BLOG</h2>
<hr>
<ul>
<li><a href="http://isux.tencent.com" target="_blank">腾讯ISUX</a></li>
<li><a href="http://old.75team.com/weekly/" target="_blank">奇舞周刊</a></li>
<li><a href="http://taobaofed.org" target="_blank">淘宝前端团队（FED）</a></li>
<li><a href="http://weekly.manong.io" target="_blank">码农周刊</a></li>
<li><a href="http://www.css88.com" target="_blank">WEB前端开发</a></li>
<li><a href="http://www.jstips.co" target="_blank">A JS tip per day!</a></li>
<li><a href="http://www.alloyteam.com/webdevelop/" target="_blank">腾讯全端 AlloyTeam</a></li>
<li><a href="http://www.aliued.cn" target="_blank">阿里巴巴-U一点</a></li>
<li><a href="http://fex.baidu.com" target="_blank">百度WEB前端研发部</a></li>
<li><a href="http://ued.ctrip.com/blog/" target="_blank">携程设计委员会</a></li>
<li><a href="https://github.com/PaicHyperionDev/MobileDevWeekly" target="_blank">平安科技移动开发二队技术周报</a></li>
</ul>
<h2 id="20-开发中心">
<a name="t19"></a>20. 开发中心</h2>
<hr>
<ul>
<li><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript" target="_blank">mozilla js参考</a></li>
<li><a href="https://developer.chrome.com/extensions/api_index.html" target="_blank">chrome开发中心（chrome的内核已转向blink）</a></li>
<li><a href="https://developer.apple.com/library/safari/navigation" target="_blank">safari开发中心</a></li>
<li><a href="https://msdn.microsoft.com/zh-cn/library/d1et7k7cv=vs.94.aspx" target="_blank">microsoft js参考</a></li>
<li><a href="http://sanshi.me/articles/JavaScript-Garden-CN/html/index.html" target="_blank">js秘花园</a></li>
<li><a href="http://bonsaiden.github.io/JavaScript-Garden/zh" target="_blank">js秘密园</a></li>
<li><a href="http://www.w3help.org" target="_blank">w3help(综合Bug集合网站)</a></li>
</ul>
<h2 id="21-ecmascript">
<a name="t20"></a>21. ECMAScript</h2>
<hr>
<ul>
<li><a href="https://leanpub.com/understandinges6/read" target="_blank">Understanding ECMAScript 6 - Nicholas C. Zakas</a></li>
<li><a href="https://leanpub.com/exploring-es6/read" target="_blank">exploring-es6</a></li>
<li><a href="https://github.com/es6-org/exploring-es6" target="_blank">exploring-es6翻译</a></li>
<li><a href="http://es6-org.github.io/exploring-es6" target="_blank">exploring-es6翻译后预览</a></li>
<li><a href="http://es6.ruanyifeng.com" target="_blank">阮一峰 es6</a></li>
<li><a href="http://javascript.ruanyifeng.com" target="_blank">阮一峰 Javascript</a></li>
<li><a href="http://yanhaijing.com/es5" target="_blank">ECMA-262，第 5 版</a></li>
<li><a href="http://es5.github.io" target="_blank">es5</a></li>
</ul>
<h2 id="22-d3">
<a name="t21"></a>22. D3</h2>
<hr>
<ul>
<li><a href="https://github.com/mbostock/d3/wiki/Tutorials" target="_blank">d3 Tutorials</a></li>
<li><a href="https://github.com/mbostock/d3/wiki/Gallery" target="_blank">Gallery</a></li>
<li><a href="http://datavisual.lofter.com/post/40cf3a_188e535" target="_blank">lofter</a></li>
<li><a href="http://alanland.iteye.com/blog/1878595" target="_blank">iteye</a></li>
<li><a href="http://javascript.ruanyifeng.com/library/d3.html" target="_blank">ruanyifeng</a></li>
</ul>
<h2 id="23-requriejs">
<a name="t22"></a>23. <strong>RequrieJS</strong>
</h2>
<hr>
<ul>
<li><a href="http://www.ruanyifeng.com/blog/2012/10/javascript_module.html" target="_blank">Javascript模块化编程（一）：模块的写法</a></li>
<li><a href="http://www.ruanyifeng.com/blog/2012/10/asynchronous_module_definition.html" target="_blank">Javascript模块化编程（二）：AMD规范</a></li>
<li><a href="http://www.ruanyifeng.com/blog/2012/11/require_js.html" target="_blank">Javascript模块化编程（三）：require.js的用法</a></li>
<li><a href="http://www.cnblogs.com/snandy/archive/2012/05/22/2513652.html" target="_blank">RequireJS入门（一）</a></li>
<li><a href="http://www.cnblogs.com/snandy/archive/2012/05/23/2513712.html" target="_blank">RequireJS入门（二）</a></li>
<li><a href="http://www.cnblogs.com/snandy/archive/2012/06/08/2538001.html" target="_blank">RequireJS进阶（三）</a></li>
<li><a href="http://www.cnblogs.com/yexiaochai/p/3632580.html" target="_blank">requrie源码学习</a></li>
<li><a href="http://www.oschina.net/translate/getting-started-with-the-requirejs-library" target="_blank">requrie 入门指南</a></li>
<li><a href="http://www.cnblogs.com/yexiaochai/p/3214926.html" target="_blank">requrieJS 学习笔记</a></li>
<li><a href="http://cyj.me/why-seajs/requirejs/" target="_blank">requriejs 其一</a></li>
<li><a href="http://www.cnblogs.com/yexiaochai/p/3221081.html" target="_blank">require backbone结合</a></li>
</ul>
<h2 id="24-seajs">
<a name="t23"></a>24. <strong>SeaJS</strong>
</h2>
<hr>
<ul>
<li><a href="http://seajs.org" target="_blank">seajs</a></li>
<li><a href="http://cyj.me/why-seajs/zh" target="_blank">seajs 中文手册</a></li>
</ul>
<h2 id="25-less-sass">
<a name="t24"></a>25. <strong>Less &amp; Sass</strong>
</h2>
<hr>
<ul>
<li><a href="http://www.w3cplus.com/sassguide" target="_blank">sass</a></li>
<li><a href="http://www.sass.hk" target="_blank">sass教程-sass中国</a></li>
<li><a href="http://sass.bootcss.com" target="_blank">Sass 中文文档</a></li>
<li><a href="http://less.bootcss.com" target="_blank">less</a></li>
</ul>
<h2 id="26-markdown">
<a name="t25"></a>26. <strong>Markdown</strong>
</h2>
<hr>
<ul>
<li><a href="http://wowubuntu.com/markdown" target="_blank">Markdown 语法说明 (简体中文版)</a></li>
<li><a href="https://github.com/LearnShare/Learning-Markdown/blob/master/README.md" target="_blank">markdown入门参考</a></li>
<li>[gitbook](<a href="https://www.gitbook.com" target="_blank">https://www.gitbook.com</a> 国外的在线markdown可编辑成书)</li>
<li>[mdeditor](<a href="https://www.zybuluo.com/mdeditor" target="_blank">https://www.zybuluo.com/mdeditor</a> 一款国内的在线markdown编辑器)</li>
<li>[stackedit](<a href="https://stackedit.io" target="_blank">https://stackedit.io</a> 国外的在线markdown编辑器，功能强大，同步云盘)</li>
<li>[mditor](<a href="http://bh-lay.github.io/mditor" target="_blank">http://bh-lay.github.io/mditor</a> 一款轻量级的markdown编辑器)</li>
<li><a href="https://github.com/lepture/editor" target="_blank">lepture-editor</a></li>
<li><a href="https://github.com/jbt/markdown-editor" target="_blank">markdown-editor</a></li>
<li><a href="https://www.zybuluo.com" target="_blank">作业部落</a></li>
</ul>
<h2 id="27-兼容性">
<a name="t26"></a>27. <strong>兼容性</strong>
</h2>
<hr>
<ul>
<li><a href="http://kangax.github.io/compat-table/es6" target="_blank">esma 兼容列表</a></li>
<li><a href="http://jigsaw.w3.org/css-validator/validator.html.zh-cn" target="_blank">W3C CSS验证服务</a></li>
<li><a href="http://caniuse.com/#index" target="_blank">caniuse</a></li>
<li><a href="http://csscreator.com/properties" target="_blank">csscreator</a></li>
<li><a href="https://msdn.microsoft.com/zh-cn/library/cc351024v=vs.85.aspx" target="_blank">microsoft</a></li>
<li><a href="http://www.responsinator.com" target="_blank">在线测兼容-移动端</a></li>
<li><a href="https://www.manymo.com/emulators" target="_blank">emulators</a></li>
</ul>
<h2 id="28-ui相关">
<a name="t27"></a>28. <strong>UI相关</strong>
</h2>
<hr>
<ul>
<li><a href="http://v3.bootcss.com" target="_blank">bootcss</a></li>
<li>[ANT DESIGN](<a href="http://ant.design" target="_blank">http://ant.design</a> 一个 UI 设计语言)</li>
<li><a href="http://www.w3cplus.com/MetroUICSS" target="_blank">MetroUICSS</a></li>
<li><a href="http://semantic-ui.com" target="_blank">semantic</a></li>
<li><a href="http://alexwolfe.github.io/Buttons" target="_blank">Buttons</a></li>
<li><a href="http://hiloki.github.io/kitecss" target="_blank">kitecss</a></li>
<li><a href="http://www.pintuer.com" target="_blank">pintuer</a></li>
<li><a href="http://amazeui.org" target="_blank">amazeui</a></li>
<li><a href="http://www.worldhello.net/gotgithub/index.html" target="_blank">worldhello</a></li>
<li><a href="http://igit.linuxtoy.org/contents.html" target="_blank">linuxtoy</a></li>
<li><a href="http://www-cs-students.stanford.edu/~blynn/gitmagic/intl/zh_cn" target="_blank">gitmagic</a></li>
<li><a href="http://rogerdudler.github.io/git-guide/index.zh.html" target="_blank">rogerdudler</a></li>
<li><a href="http://gitref.justjavac.com" target="_blank">gitref</a></li>
<li><a href="http://git-scm.com/book/zh" target="_blank">book</a></li>
<li><a href="http://gogojimmy.net/2012/01/17/how-to-use-git-1-git-basic" target="_blank">gogojimmy</a></li>
</ul>
<h2 id="29-图表类">
<a name="t28"></a>29. <strong>图表类</strong>
</h2>
<hr>
<ul>
<li><a href="http://www.hcharts.cn/api/index.php" target="_blank">Highcharts 中文API</a></li>
<li><a href="http://api.highcharts.com/highcharts" target="_blank">Highcharts 英文API</a></li>
<li><a href="http://echarts.baidu.com/" target="_blank">ECharts 百度的图表软件</a></li>
<li><a href="http://lbs.amap.com/api" target="_blank">高德地图</a></li>
<li><a href="http://paperjs.org" target="_blank">开源的矢量图脚本框架</a></li>
<li><a href="http://jvectormap.com" target="_blank">svg 地图</a></li>
</ul>
<h2 id="30-正则表达式">
<a name="t29"></a>30. 正则表达式</h2>
<hr>
<ul>
<li><a href="http://segmentfault.com/a/1190000002471140" target="_blank">JS正则表达式元字符</a></li>
<li><a href="http://deerchao.net/tutorials/regex/regex.htm" target="_blank">正则表达式30分钟入门教程</a></li>
<li><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Regular_Expressions" target="_blank">MDN-正则表达式</a></li>
<li><a href="http://javascript.ruanyifeng.com/stdlib/regexp.html" target="_blank">ruanyifeng - RegExp对象</a></li>
<li><a href="http://div.io/topic/764?page=1" target="_blank">小胡子哥 - 进阶正则表达式</a></li>
<li><a href="https://github.com/Cedriking/is.js/blob/master/is.js" target="_blank">is.js</a></li>
<li><a href="http://regexper.com" target="_blank">正则在线测试</a></li>
</ul>
<h2 id="31-前端规范">
<a name="t30"></a>31. <strong>前端规范</strong>
</h2>
<hr>
<ul>
<li><a href="http://alloyteam.github.io/CodeGuide" target="_blank">通过分析github代码库总结出来的工程师代码书写习惯</a></li>
<li><a href="http://codeguide.bootcss.com" target="_blank">HTML&amp;CSS编码规范 by @mdo</a></li>
<li><a href="http://www.alloyteam.com/2011/10/css-on-team-naming/" target="_blank">团队合作的css命名规范-腾讯AlloyTeam前端团队</a></li>
<li><a href="http://yuwenhui.github.io" target="_blank">前端编码规范之js - by yuwenhui</a></li>
<li><a href="http://www.cnblogs.com/hustskyking/p/javascript-spec.html" target="_blank">前端编码规范之js - by 李靖</a></li>
<li><a href="http://zhibimo.com/read/Ashu/front-end-style-guide" target="_blank">前端开发规范手册</a></li>
<li><a href="https://github.com/yuche/javascript#table-of-contents" target="_blank">Airbnb JavaScript 编码规范（简体中文版）</a></li>
<li><a href="http://www.zhihu.com/question/20351507" target="_blank">AMD与CMD规范的区别</a></li>
<li><a href="http://www.cnblogs.com/tugenhua0707/p/3507957.html" target="_blank">AMD与CMD规范的区别</a></li>
<li><a href="http://docs.kissyui.com/1.4/docs/html/tutorials/style-guide/kissy-source-style.html" target="_blank">KISSY 源码规范</a></li>
<li><a href="http://codeguide.bootcss.com" target="_blank">bt编码规范</a></li>
<li><a href="https://github.com/Suxiaogang/Code_Guide" target="_blank">规范加强版</a></li>
<li><a href="http://blog.jobbole.com/79075" target="_blank">前端代码规范 及 最佳实践</a></li>
<li><a href="http://coderlmn.github.io/code-standards" target="_blank">百度前端规范</a></li>
<li><a href="http://isobar-idev.github.io/code-standards" target="_blank">百度前端规范</a></li>
<li><a href="http://zhuanlan.zhihu.com/fuyun/19884834" target="_blank">百度前端规范</a></li>
<li><a href="https://github.com/gf-rd/es6-coding-style" target="_blank">ECMAScript6 编码规范–广发证券前端团队</a></li>
<li><a href="http://blog.jobbole.com/79484" target="_blank">JavaScript 风格指南/编码规范（Airbnb公司版）</a></li>
<li><a href="http://nec.netease.com/standard" target="_blank">网易前端开发规范</a></li>
<li><a href="http://www.75team.com/archives/1049" target="_blank">css模块</a></li>
<li><a href="https://github.com/ecomfe/spec" target="_blank">前端规范资源列表</a></li>
</ul>
<h2 id="32-php">
<a name="t31"></a>32. <strong>PHP</strong>
</h2>
<hr>
<ul>
<li><a href="http://segmentfault.com/a/1190000000443795" target="_blank">最流行的PHP 代码规范</a></li>
<li><a href="https://github.com/hfcorriez/fig-standards/blob/zh_CN/%E6%8E%A5%E5%8F%97/PSR-2-coding-style-guide.md" target="_blank">最流行的PHP 代码规范</a></li>
</ul>
<h2 id="33-各大公司开源项目">
<a name="t32"></a>33. <strong>各大公司开源项目</strong>
</h2>
<hr>
<ul>
<li><a href="https://code.facebook.com/projects/web" target="_blank">Facebook Projects</a></li>
<li><a href="http://fex.baidu.com" target="_blank">百度web前端研发部</a></li>
<li><a href="http://efe.baidu.com" target="_blank">百度EFE</a></li>
<li><a href="https://github.com/fex-team" target="_blank">百度github</a></li>
<li><a href="http://www.alloyteam.com" target="_blank">alloyteam</a></li>
<li><a href="http://alloyteam.github.io" target="_blank">alloyteam-github</a></li>
<li><a href="https://github.com/AlloyTeam/AlloyGameEngine" target="_blank">alloyteam-AlloyGameEngine</a></li>
<li><a href="http://alloyteam.github.io/AlloyDesigner" target="_blank">AlloyDesigner(即时修改，即时保存，设计稿较正，其它开发辅助工具)</a></li>
<li><a href="http://www.alloyteam.com/2015/06/h5-jiao-hu-ye-bian-ji-qi-aeditor-jie-shao" target="_blank">H5交互页编辑器AEditor介绍</a></li>
<li><a href="http://aeditor.alloyteam.com" target="_blank">AEditor</a></li>
<li><a href="https://github.com/fenbility/weekly-feed" target="_blank">值得订阅的weekly</a></li>
<li><a href="http://75team.github.io" target="_blank">奇舞团开源项目</a></li>
<li><a href="http://ued.qunar.com" target="_blank">Qunar UED</a></li>
<li><a href="http://scrat.io" target="_blank">Scrat</a></li>
</ul>
<h2 id="34-常用">
<a name="t33"></a>34. <strong>常用</strong>
</h2>
<hr>
<ul>
<li><a href="http://www.zhangxinxu.com/wordpress/2013/12/iebetter-js-make-ie6-ie8-like-modern-browser-ie9-chrome" target="_blank">ieBetter.js(让IE6-IE8拥有IE9+,Chrome等浏览器特性)</a></li>
<li><a href="http://mottie.github.io/Keyboard" target="_blank">模拟键盘</a></li>
<li><a href="https://github.com/hotoo/pinyin" target="_blank">拼音</a></li>
<li><a href="https://github.com/mc-zone/IDValidator" target="_blank">中国个人身份证号验证</a></li>
</ul>
<h2 id="35-算法">
<a name="t34"></a>35. <strong>算法</strong>
</h2>
<hr>
<ul>
<li><a href="https://github.com/Ralph-Wang/algorithm.in.js" target="_blank">数据结构与算法 JavaScript</a></li>
<li><a href="https://github.com/twobin/twobinSort" target="_blank">常见排序算法（JS版）</a></li>
<li><a href="https://github.com/luofei2011/jsAgm/blob/master/js/sort.js" target="_blank">经典排序</a></li>
<li><a href="https://github.com/hechangmin/jssort" target="_blank">常见排序算法-js版本</a></li>
<li><a href="https://github.com/lightningtgc/JavaScript-Algorithms" target="_blank">JavaScript 算法与数据结构 精华集</a></li>
<li><a href="http://www.nowcoder.com/live/courses" target="_blank">面试常考算法题精讲</a></li>
</ul>
<h2 id="36-json">
<a name="t35"></a>36. <strong>JSON</strong>
</h2>
<hr>
<ul>
<li><a href="http://beta.json-generator.com/" target="_blank">模拟生成JSON数据</a></li>
</ul>
<h2 id="37-ext-easyui-j-ui-及其它各种ui方案">
<a name="t36"></a>37. <strong>Ext, EasyUI, J-UI 及其它各种UI方案</strong>
</h2>
<hr>
<ul>
<li><a href="https://www.sencha.com/products/extjs" target="_blank">extjs</a></li>
<li><a href="http://docs.sencha.com/extjs/4.0.7" target="_blank">ext4英文api</a></li>
<li><a href="http://extjs-doc-cn.github.io/ext4api" target="_blank">ext4中文api</a></li>
<li><a href="http://jquery-easyui.googlecode.com/svn/trunk/src" target="_blank">jquery easyui 未压缩源代码</a></li>
<li><a href="http://jui.org" target="_blank">J-UI</a></li>
<li><a href="http://dcloudio.github.io/mui" target="_blank">MUI-最接近原生APP体验的高性能前端框架</a></li>
<li><a href="http://amazeui.org" target="_blank">Amaze UI(中国首个开源 HTML5 跨屏前端框架)</a></li>
<li><a href="http://m.sui.taobao.org" target="_blank">淘宝 HTML5 前端框架</a></li>
<li><a href="http://docs.kissyui.com" target="_blank">KISSY - 阿里前端JavaScript库</a></li>
<li><a href="http://nej.netease.com" target="_blank">网易Nej - Nice Easy Javascript</a></li>
<li><a href="http://demos.telerik.com/kendo-ui/mvvm/index" target="_blank">Kendo UI MVVM Demo</a></li>
<li><a href="http://www.bootcss.com" target="_blank">Bootstrap</a></li>
<li><a href="http://foundation.zurb.com" target="_blank">Foundation</a></li>
<li><a href="http://smartui.chinamzz.com" target="_blank">Smart UI</a></li>
<li><a href="http://developer.yahoo.com/yui/grids" target="_blank">雅虎UI - CSS UI</a></li>
</ul>
<h2 id="38-页面-社会化-分享功能">
<a name="t37"></a>38. <strong>页面 社会化 分享功能</strong>
</h2>
<hr>
<ul>
<li><a href="http://share.baidu.com" target="_blank">(pc端)百度分享</a></li>
<li><a href="http://jiathis.com" target="_blank">(pc端)JiaThis</a></li>
<li><a href="http://developer.baidu.com/soc/share" target="_blank">(移动端)社会化分享组件</a></li>
<li><a href="http://www.mob.com/#/index" target="_blank">(移动端)ShareSDK 轻松实现社会化功能</a></li>
<li><a href="http://dev.umeng.com/social/android/quick-integration" target="_blank">(移动端)友盟分享</a></li>
</ul>
<h2 id="39-富文本编辑器">
<a name="t38"></a>39. <strong>富文本编辑器</strong>
</h2>
<hr>
<ul>
<li><a href="https://www.tinymce.com" target="_blank">功能齐全 tinymce</a></li>
<li><a href="http://ueditor.baidu.com/website" target="_blank">百度 ueditor</a></li>
<li><a href="http://ckeditor.com" target="_blank">经典的ckeditor</a></li>
<li><a href="http://kindeditor.net" target="_blank">经典的kindeditor</a></li>
<li><a href="http://www.bootcss.com/p/bootstrap-wysiwyg" target="_blank">wysiwyg</a></li>
<li><a href="http://integ.github.io/BachEditor" target="_blank">一个有情怀的编辑器。Bach’s Editor</a></li>
<li><a href="https://github.com/mycolorway/simditor" target="_blank">tower用的编辑器</a></li>
<li><a href="https://github.com/summernote/summernote" target="_blank">summernote 编辑器</a></li>
<li><a href="http://neilj.github.io/Squire" target="_blank">html5编辑器</a></li>
<li><a href="http://quilljs.com" target="_blank">Quilljs编辑器</a></li>
<li><a href="https://github.com/wangfupeng1988/wangEditor" target="_blank">wangEditor</a></li>
</ul>
<h2 id="40-前端概述">
<a name="t39"></a>40. <strong>前端概述</strong>
</h2>
<hr>
<ul>
<li><a href="http://www.awesomes.cn" target="_blank">前端工具大全</a></li>
<li><a href="https://github.com/fouber/blog/issues/10?from=timeline&amp;isappinstalled=0" target="_blank">什么是前端工程化</a></li>
<li><a href="https://segmentfault.com/a/1190000005174755" target="_blank">[译] 前端攻略-从路人甲到英雄无敌</a></li>
</ul>
<h2 id="41-gulp">
<a name="t40"></a>41. <strong>Gulp</strong>
</h2>
<hr>
<ul>
<li><a href="http://gulpjs.com" target="_blank">Gulp官网</a></li>
<li><a href="http://www.gulpjs.com.cn" target="_blank">Gulp中文网</a></li>
<li><a href="https://github.com/Platform-CUF/use-gulp" target="_blank">gulp资料收集</a></li>
<li><a href="http://javascript.ruanyifeng.com/tool/gulp.html" target="_blank">Gulp：任务自动管理工具 - ruanyifeng</a></li>
<li><a href="http://gulpjs.com/plugins" target="_blank">Gulp插件</a></li>
<li><a href="http://www.jeffjade.com/2015/11/25/2015-11-25-toss-gulp/" target="_blank">Gulp探究折腾之路(I)</a></li>
<li><a href="http://www.jeffjade.com/2016/01/19/2016-01-19-toss-gulp/" target="_blank">Gulp折腾之路(II)</a></li>
<li><a href="http://www.ido321.com/1622.html" target="_blank">Gulp不完全入门教程</a></li>
<li><a href="https://github.com/hjzheng/CUF_meeting_knowledge_share/issues/33" target="_blank">为什么使用gulp?</a></li>
<li><a href="http://www.dbpoo.com/getting-started-with-gulp" target="_blank">Gulp安装及配合组件构建前端开发一体化</a></li>
<li><a href="https://github.com/nimojs/gulp-book" target="_blank">Gulp 入门指南</a></li>
<li><a href="https://github.com/nimojs/blog/issues/19" target="_blank">Gulp 入门指南 - nimojs</a></li>
<li><a href="http://www.imooc.com/video/5692" target="_blank">Gulp in Action</a></li>
<li><a href="http://www.w3ctech.com/topic/134" target="_blank">Gulp开发教程（翻译）</a></li>
<li><a href="http://www.cnblogs.com/2050/p/4198792.html" target="_blank">前端构建工具gulpjs的使用介绍及技巧</a></li>
</ul>
<h2 id="42-grunt">
<a name="t41"></a>42. <strong>Grunt</strong>
</h2>
<hr>
<ul>
<li><a href="http://gruntjs.com" target="_blank">gruntjs</a></li>
<li><a href="http://www.gruntjs.net" target="_blank">Grunt中文网</a></li>
</ul>
<h2 id="43-fis">
<a name="t42"></a>43. <strong>Fis</strong>
</h2>
<hr>
<ul>
<li><a href="http://fex-team.github.io/fis-site/index.html" target="_blank">fis 官网</a></li>
<li><a href="http://fis.baidu.com" target="_blank">fis</a></li>
</ul>
<h2 id="44-pc图轮">
<a name="t43"></a>44. <strong>pc图轮</strong>
</h2>
<hr>
<ul>
<li><a href="https://github.com/qusiba/vue-slider" target="_blank">Vue 的图片轮播组件:vue-slider</a></li>
<li><a href="http://bxslider.com/examples/carousel-demystified" target="_blank">左右按钮多图切换</a></li>
<li><a href="https://github.com/alvarotrigo/fullPage.js" target="_blank">fullpage全屏轮播</a></li>
</ul>
<h2 id="45-移动端图轮">
<a name="t44"></a>45. <strong>移动端图轮</strong>
</h2>
<hr>
<ul>
<li><a href="http://www.idangero.us/swiper" target="_blank">滑屏效果</a></li>
<li><a href="https://github.com/peunzhang/fullpage" target="_blank">全屏fullpage</a></li>
<li><a href="https://github.com/qiqiboy/touchslider" target="_blank">单个图片切换</a></li>
<li><a href="https://github.com/peunzhang/slip.js" target="_blank">单个全屏切换</a></li>
<li><a href="http://touch.code.baidu.com/examples.html?qq-pf-to=pcqq.group" target="_blank">百度的切换库</a></li>
<li><a href="https://github.com/peunzhang/iSlider" target="_blank">单个全屏切换</a></li>
<li><a href="https://github.com/saw/touch-interfaces" target="_blank">滑屏效果</a></li>
<li><a href="http://baijs.com/tinycircleslider" target="_blank">旋转拖动设置</a></li>
<li><a href="http://touchslider.com" target="_blank">类似于swipe切换</a></li>
<li><a href="http://www.swiper.com.cn/demo/index.html" target="_blank">支持多种形式的触摸滑动</a></li>
<li><a href="https://github.com/joker-ye/main/blob/master/wap/index.html" target="_blank">滑屏效果</a></li>
<li><a href="http://www.superslide2.com" target="_blank">大话席pc移动图片轮换</a></li>
<li><a href="https://github.com/hahnzhu/parallax.js" target="_blank">滑屏效果</a></li>
<li><a href="https://github.com/yanhaijing/zepto.fullpage" target="_blank">基于zepto的fullpage</a></li>
<li><a href="http://www.cnblogs.com/plums/archive/2013/01/10/WebApp-fixed-width-layout-of-multi-terminal-adapter-since.html" target="_blank">WebApp定宽网页设计下，固定宽度布局开发WebApp并实现多终端下WebApp布局自适应</a></li>
<li><a href="http://loo2k.com/blog/detecting-wechat-client" target="_blank">判断微信客户端的那些坑</a></li>
<li><a href="https://github.com/JefferyWang/nativeShare.js" target="_blank">可以通过javascript直接调用原生分享的工具</a></li>
<li><a href="http://www.jiathis.com/help/html/weixin-share-code" target="_blank">JiaThis 分享到微信代码</a></li>
<li><a href="http://fex.baidu.com/blog/2015/05/cross-mobile" target="_blank">聊聊移动端跨平台开发的各种技术</a></li>
<li><a href="http://www.zhihu.com/question/29922082" target="_blank">前端自动化测试</a></li>
<li><a href="http://ajccom.github.io/niceslider" target="_blank">多种轮换图片</a></li>
<li><a href="https://mango.github.io/slideout" target="_blank">滑动侧边栏</a></li>
</ul>
<h2 id="46-文件上传">
<a name="t45"></a>46. <strong>文件上传</strong>
</h2>
<hr>
<ul>
<li><a href="http://fex.baidu.com/webuploader" target="_blank">百度上传组件</a></li>
<li><a href="https://blueimp.github.io/jQuery-File-Upload" target="_blank">上传</a></li>
<li><a href="http://www.hdfu.net" target="_blank">flash 头像上传</a></li>
<li><a href="http://www.dropzonejs.com" target="_blank">图片上传预览</a></li>
<li><a href="http://elemefe.github.io/image-cropper" target="_blank">图片裁剪</a></li>
<li><a href="http://www.shearphoto.com" target="_blank">图片裁剪-shearphoto</a></li>
<li><a href="http://www.oschina.net/project/tag/284/jquery-image-tools?lang=0&amp;os=0&amp;sort=view&amp;p=2" target="_blank">jQuery图片处理</a></li>
</ul>
<h2 id="47-模拟select">
<a name="t46"></a>47. <strong>模拟select</strong>
</h2>
<hr>
<ul>
<li><a href="http://aui.github.io/popupjs/doc/selectbox.html" target="_blank">糖饼 select</a></li>
<li><a href="https://github.com/rmm5t/jquery-flexselect" target="_blank">flexselect</a></li>
<li><a href="http://loudev.com" target="_blank">双select</a></li>
<li><a href="http://select2.github.io" target="_blank">select2</a></li>
</ul>
<h2 id="48-取色插件">
<a name="t47"></a>48. <strong>取色插件</strong>
</h2>
<hr>
<ul>
<li><a href="http://www.jq22.com/plugin/367" target="_blank">类似 Photoshop 的界面取色插件</a></li>
<li><a href="https://github.com/jquery/jquery-color" target="_blank">jquery color</a></li>
<li><a href="http://www.oschina.net/project/tag/287/color-picker" target="_blank">取色插件集合</a></li>
<li><a href="https://github.com/mattfarina/farbtastic" target="_blank">farbtastic 圆环＋正方形</a></li>
</ul>
<h2 id="49-城市联动">
<a name="t48"></a>49. <strong>城市联动</strong>
</h2>
<hr>
<ul>
<li><a href="http://www.ijquery.cn/?p=360" target="_blank">jquery.cityselect.js基于jQuery+JSON的省市或自定义联动效果</a></li>
</ul>
<h2 id="50-剪贴板">
<a name="t49"></a>50. <strong>剪贴板</strong>
</h2>
<hr>
<ul>
<li><a href="https://github.com/zeroclipboard/zeroclipboard" target="_blank">剪贴板</a></li>
<li><a href="http://zenorocha.github.io/clipboard.js" target="_blank">clipboard 最新的剪切方案</a></li>
<li><a href="https://github.com/zenorocha/clipboard.js" target="_blank">不是Flash的剪贴板</a></li>
</ul>
<h2 id="51-简繁转换">
<a name="t50"></a>51. <strong>简繁转换</strong>
</h2>
<hr>
<ul>
<li><a href="https://github.com/BYVoid/OpenCC" target="_blank">简繁转换</a></li>
</ul>
<h2 id="52-表格-grid">
<a name="t51"></a>52. <strong>表格 Grid</strong>
</h2>
<hr>
<ul>
<li><a href="http://facebook.github.io/fixed-data-table" target="_blank">facebook表格</a></li>
<li><a href="http://handsontable.com" target="_blank">类似于Excel编辑表格-handsontable</a></li>
<li><a href="http://bootstrap-table.wenzhixin.net.cn" target="_blank">bootstrap-table插件</a></li>
<li><a href="https://www.datatables.net" target="_blank">datatables</a></li>
</ul>
<h2 id="53-在线演示">
<a name="t52"></a>53. <strong>在线演示</strong>
</h2>
<hr>
<ul>
<li><a href="http://runjs.cn" target="_blank">js 在线编辑 - runjs</a></li>
<li><a href="http://jsbin.com" target="_blank">js 在线编辑 - jsbin</a></li>
<li><a href="http://codepen.io" target="_blank">js 在线编辑 - codepen</a></li>
<li><a href="http://jsfiddle.net" target="_blank">js 在线编辑 - jsfiddle</a></li>
<li><a href="http://ideone.com" target="_blank">java 在线编辑 - runjs</a></li>
<li><a href="http://code.hcharts.cn" target="_blank">js 在线编辑 - hcharts</a></li>
<li><a href="http://jsdm.com" target="_blank">js 在线编辑 - jsdm</a></li>
<li><a href="http://sqlfiddle.com" target="_blank">sql 在线编辑 - sqlfiddle</a></li>
<li><a href="https://thimble.mozilla.org" target="_blank">mozilla 在线编辑器</a></li>
</ul>
<h2 id="54-常规优化">
<a name="t53"></a>54. <strong>常规优化</strong>
</h2>
<hr>
<ul>
<li><a href="http://www.infoq.com/cn/articles/javascript-high-performance-animation-and-page-rendering" target="_blank">Javascript高性能动画与页面渲染</a></li>
<li><a href="http://isux.tencent.com/h5-performance.html" target="_blank">移动H5前端性能优化指南</a></li>
<li><a href="http://ued.5173.com/?p=1731" target="_blank">5173首页前端性能优化实践</a></li>
<li><a href="http://www.uisdc.com/front-end-performance-for-web-designers-and-front-end-developers" target="_blank">给网页设计师和前端开发者看的前端性能优化</a></li>
<li><a href="http://www.orzpoint.com/profiling-css-and-optimization-notes" target="_blank">复杂应用的 CSS 性能分析和优化建议</a></li>
<li><a href="http://www.zhangxinxu.com/wordpress/tag/%E5%89%8D%E7%AB%AF%E6%80%A7%E8%83%BD/" target="_blank">张鑫旭——前端性能</a></li>
<li><a href="http://www.xiaoqiang.org/javascript/font-end-performance-monitor.html" target="_blank">前端性能监控总结</a></li>
<li><a href="http://www.aliued.cn/2013/01/20/web%E5%89%8D%E7%AB%AF%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96%E8%BF%9B%E9%98%B6%E8%B7%AF.html" target="_blank">web前端性能优化进阶路</a></li>
<li><a href="http://my.eoe.cn/tuwandou/archive/4544.html" target="_blank">前端技术：网站性能优化之CSS无图片技术</a></li>
<li><a href="http://www.baiduux.com/blog/2011/02/15/browser-loading" target="_blank">浏览器的加载与页面性能优化</a></li>
<li><a href="http://www.w3ctech.com/p/1503" target="_blank">页面加载中的图片性能优化</a></li>
<li><a href="http://www.feelcss.com/tag/%E5%89%8D%E7%AB%AF%E6%80%A7%E8%83%BD" target="_blank">Hey——前端性能</a></li>
<li><a href="http://www.cnblogs.com/yslow" target="_blank">YSLOW中文介绍</a></li>
<li><a href="http://www.360ito.com/article/40.html" target="_blank">转一篇Yahoo关于网站性能优化的文章，兼谈本站要做的优化</a></li>
<li><a href="http://www.360doc.com/content/10/0928/09/2588264_56971287.shtml" target="_blank">Yahoo!团队实践分享：网站性能</a></li>
<li><a href="http://blog.jiasule.com/i/153" target="_blank">网站性能优化指南：什么使我们的网站变慢？</a></li>
<li><a href="http://www.powereasy.net/helpyou/knowledge/ecommerce/9593.html" target="_blank">网站性能优化实践，减少加载时间，提高用户体验</a></li>
<li><a href="http://www.umtry.com/archives/747.html" target="_blank">浅谈网站性能优化 前端篇</a></li>
<li><a href="http://www.adinnet.cn/blog/designview/2012-7-12/678.html" target="_blank">前端重构实践之如何对网站性能优化？</a></li>
<li><a href="http://www.gbin1.com/technology/javascript/20130708-front-end-performance-optimization-9" target="_blank">前端性能优化：使用媒体查询加载指定大小的背景图片</a></li>
<li><a href="http://www.mykuer.com/post/factors-that-affect-the-speed-of-web-site-open.html" target="_blank">网站性能系列博文</a></li>
<li><a href="http://tgideas.qq.com/webplat/info/news_version3/804/808/811/m579/201109/41355.shtml" target="_blank">加载，不只是少一点点</a></li>
<li><a href="http://mzhou.me/article/95310" target="_blank">前端性能的测试与优化</a></li>
<li><a href="http://www.gbin1.com/technology/html/20130217-tips-for-speed-up-page-loading" target="_blank">分享网页加载速度优化的一些技巧？</a></li>
<li><a href="http://www.tcreator.info/webSchool/website/Front-end-Opt-Yslow.html" target="_blank">web前端优化(基于Yslow</a></li>
<li><a href="https://www.qianduan.net/website-performance-optimization-tool.html" target="_blank">网站性能优化工具大全</a></li>
<li><a href="http://www.alloyteam.com/2012/10/high-performance-html" target="_blank">【高性能前端1】高性能HTML</a></li>
<li><a href="http://www.alloyteam.com/2012/10/high-performance-css" target="_blank">【高性能前端2】高性能CSS</a></li>
<li><a href="http://coolshell.cn/articles/6470.html" target="_blank">由12306谈谈网站前端性能和后端性能优化</a></li>
<li><a href="http://www.cnblogs.com/developersupport/p/3248695.html" target="_blank">毫秒必争，前端网页性能最佳实践</a></li>
<li><a href="http://blog.sina.com.cn/s/blog_6e9d2e0701017kvu.html" target="_blank">网站性能工具Yslow的使用方法</a></li>
<li><a href="http://www.infoq.com/cn/articles/front-end-engineering-and-performance-optimization-part1" target="_blank">前端工程与性能优化（上）：静态资源版本更新与缓存</a></li>
<li><a href="http://www.infoq.com/cn/articles/front-end-engineering-and-performance-optimization-part2" target="_blank">前端工程与性能优化（下）：静态资源管理与模板框架</a></li>
<li><a href="http://blog.jobbole.com/48369" target="_blank">HTTPS连接的前几毫秒发生了什么</a></li>
<li><a href="http://uicss.cn/yslow/#more-12319" target="_blank">Yslow</a></li>
<li><a href="http://blog.smartbear.com/web-performance/essential-web-performance-metrics-a-primer-part-1" target="_blank">Essential Web Performance Metrics — A Primer, Part 1</a></li>
<li><a href="http://blog.smartbear.com/performance/essential-web-performance-metrics-part-2" target="_blank">Essential Web Performance Metrics — Part 2</a></li>
<li><a href="http://jayli.github.io/blog/data/2011/12/23/yuislide.html" target="_blank">YUISlide,针对移动设备的动画性能优化</a></li>
<li><a href="http://joelglovier.com/improving-site-performance" target="_blank">Improving Site Performance</a></li>
<li><a href="http://segmentfault.com/a/1190000000367899" target="_blank">让网站提速的最佳前端实践</a></li>
<li><a href="http://sixrevisions.com/web-development/why-website-speed-is-important" target="_blank">Why Website Speed is Important</a></li>
<li><a href="https://www.devbridge.com/articles/need-for-speed-how-to-improve-your-website-performance" target="_blank">Need for Speed – How to Improve your Website Performance</a></li>
<li><a href="https://github.com/amfe/article/issues/1" target="_blank">阿里无线前端性能优化指南 (Pt.1 加载期优化</a></li>
</ul>
<h2 id="55-优化工具">
<a name="t54"></a>55. <strong>优化工具</strong>
</h2>
<hr>
<ul>
<li><a href="http://www.html-js.com/article/3083" target="_blank">JavaScript 性能分析新工具 OneProfile</a></li>
<li><a href="http://www.html-js.com/article/3091" target="_blank">JavaScript 堆内存分析新工具 OneHeap</a></li>
</ul>
<h2 id="56-在线工具">
<a name="t55"></a>56. <strong>在线工具</strong>
</h2>
<hr>
<ul>
<li><a href="https://developers.google.com/speed/pagespeed/insights" target="_blank">google在线工具</a></li>
<li><a href="http://itest.aliyun.com" target="_blank">阿里-免费测试服务</a></li>
<li><a href="https://github.com/alibaba/f2etest" target="_blank">阿里-F2etest多浏览器兼容性测试解决方案</a></li>
<li><a href="http://jsperf.com" target="_blank">js性能测试</a></li>
</ul>
<h2 id="57-前端架构">
<a name="t56"></a>57. <strong>前端架构</strong>
</h2>
<hr>
<ul>
<li><a href="http://www.zhihu.com/topic/19612641" target="_blank">技术架构</a></li>
<li><a href="http://saito.im/note/The-Architecture-of-F2E" target="_blank">前端架构</a></li>
<li><a href="http://www.zhihu.com/question/24092572" target="_blank">如何成为前端架构师</a></li>
<li><a href="http://hikejun.com/sharing/2010webrebuild/?file=fe-infrastructure.html" target="_blank">关于前端架构-张克军</a></li>
<li><a href="http://www.zhihu.com/question/25583350" target="_blank">百度腾讯offer比较（腾讯游戏VS百度基础架构）</a></li>
</ul>
<h2 id="58-推荐作品">
<a name="t57"></a>58. <strong>推荐作品</strong>
</h2>
<hr>
<ul>
<li><a href="https://gist.github.com/wintercn" target="_blank">winter代码片段需要墙</a></li>
<li><a href="http://www.fgm.cc/learn" target="_blank">fgm</a></li>
<li><a href="https://github.com/hongru/hongru.github.com" target="_blank">岑安作品集</a></li>
<li><a href="http://kmdjs.github.io" target="_blank">当耐特demo集合</a></li>
<li><a href="http://www.laoshu133.com/Lab" target="_blank">米空格 js作品</a></li>
<li><a href="http://koen301.github.io" target="_blank">myFocus</a></li>
<li><a href="http://panxuepeng.github.io/seajslib" target="_blank">SeaJS组件库</a></li>
<li><a href="http://yanhaijing.com/myProject" target="_blank">颜海镜作品</a></li>
<li><a href="http://jo2.org/category/myworks" target="_blank">脚儿网作品</a></li>
<li><a href="http://www.cnitblog.com/yemoo/category/3107.html" target="_blank">javascript个人作品</a></li>
<li><a href="http://bbs.miaov.com/forum.php?mod=viewthread&amp;tid=7790" target="_blank">妙味的雷东升游戏作品</a></li>
<li><a href="http://bbs.csdn.net/topics/380227212" target="_blank">javascript作品集</a></li>
<li><a href="https://github.com/TooBug/works" target="_blank">云五笔，灰度产生生成工具</a></li>
<li><a href="http://koen301.github.io" target="_blank">项目主页</a></li>
<li><a href="http://zaole.net" target="_blank">个性的作品主页</a></li>
<li><a href="http://ucren.com/blog/demos" target="_blank">ucren js demos 集</a></li>
<li><a href="http://www.zhinengshe.com/works_list.html" target="_blank">智能社</a></li>
<li><a href="http://demos.shizuwu.cn" target="_blank">实例陈列架</a></li>
<li><a href="http://zoye.sinaapp.com/demo" target="_blank">zoye demo</a></li>
<li><a href="http://lab.yuanwai.wang" target="_blank">王员外</a></li>
<li><a href="http://pingfan1990.sinaapp.com" target="_blank">平凡</a></li>
<li><a href="http://www.lovewebgames.com" target="_blank">jyg 游戏案例</a></li>
<li><a href="http://www.helloweba.com/list.html" target="_blank">很多jquery插件</a></li>
<li><a href="http://www.bujichong.com/sojs/api/index.html" target="_blank">不羁虫 - soJs 作品系列</a></li>
<li><a href="http://frozenui.github.io/case.html" target="_blank">frozenui</a></li>
<li><a href="http://js-game.github.io/othello" target="_blank">黑白棋</a></li>
<li><a href="http://yansm.github.io/fromone/index.html" target="_blank">fromone</a></li>
<li><a href="http://pazguille.me" target="_blank">pazguille</a></li>
<li><a href="https://github.com/zmmbreeze/DeadSimpleVideoPlayer" target="_blank">Html5 VideoPlayer</a></li>
<li><a href="http://a-jie.github.io/Proton/#example" target="_blank">Proton 烟花</a></li>
</ul>
<h2 id="59-简历模板">
<a name="t58"></a>59. <strong>简历模板</strong>
</h2>
<hr>
<ul>
<li><a href="http://hcy2367.github.io/resume" target="_blank">简历</a></li>
<li><a href="http://ncuey.sinaapp.com/CrispElite/" target="_blank">张伦</a></li>
<li><a href="https://github.com/hacke2/ResumeSample" target="_blank">简历</a></li>
<li><a href="http://pinkyjie.com/resume" target="_blank">马斯特</a></li>
<li><a href="https://joyeecheung.github.io/resume/" target="_blank">张秋怡</a></li>
<li><a href="http://blog.dandyweng.com/2013/07/how-my-website-was-created" target="_blank">翁天信</a></li>
<li><a href="http://www.webhek.com/misc/interactive-resume" target="_blank">动画方式的简历</a></li>
<li><a href="http://www.linqing07.com/resume.html" target="_blank">组件丰富简历</a></li>
<li><a href="http://www.haorooms.com/about" target="_blank">haorooms博客</a></li>
</ul>
<h2 id="60-求职">
<a name="t59"></a>60. 求职</h2>
<hr>
<ul>
<li><a href="http://www.jianshu.com/p/84b0dd277f13" target="_blank">面试你之前，我希望在简历上看到这些！</a></li>
</ul>
<h2 id="61-面试题">
<a name="t60"></a>61. <strong>面试题</strong>
</h2>
<hr>
<ul>
<li><a href="http://www.nowcoder.com/discuss/3196" target="_blank">那几个月在找工作（百度，网易游戏）</a></li>
<li><a href="http://www.html-js.com/article/1743" target="_blank">2014最新面试题</a></li>
<li><a href="http://www.cnblogs.com/imwtr/p/4685546.html" target="_blank">2016校招内推 – 阿里巴巴前端 – 三面面试经历</a></li>
<li><a href="http://www.cnblogs.com/lvdabao/p/3660707.html" target="_blank">年后跳槽那点事：乐视+金山+360面试之行</a></li>
<li><a href="http://blog.sourcing.io/interview-questions" target="_blank">Interviewing a front-end developer</a></li>
<li><a href="http://www.cnblogs.com/52cik/p/js-question-lg.html" target="_blank">拉勾网js面试题</a></li>
<li><a href="http://www.cnblogs.com/allenxing/p/3724382.html" target="_blank">前端面试</a></li>
<li><a href="http://mianshiti.diandian.com" target="_blank">Web开发笔试面试题 大全</a></li>
<li><a href="http://segmentfault.com/a/1190000000465431" target="_blank">前端开发面试题</a></li>
<li><a href="https://github.com/markyun/My-blog/tree/master/Front-end-Developer-Questions" target="_blank">2014最新前端面试题</a></li>
<li><a href="https://github.com/fex-team/interview-questions" target="_blank">百度面试</a></li>
<li><a href="https://github.com/darcyclarke/Front-end-Developer-Interview-Questions/tree/master/Chinese" target="_blank">前端工作面试问题</a></li>
<li><a href="http://segmentfault.com/a/1190000000465431" target="_blank">前端开发面试题</a></li>
<li><a href="/admin/blogs/5%E4%B8%AA%E7%BB%8F%E5%85%B8%E7%9A%84%E5%89%8D%E7%AB%AF%E9%9D%A2%E8%AF%95%E9%97%AE%E9%A2%98" target="_blank">5个经典的前端面试问题</a></li>
<li><a href="http://segmentfault.com/a/1190000002562454" target="_blank">最全前端面试问题及答案总结</a></li>
<li><a href="http://www.html-js.com/article/Large-search-front-team-column%202961" target="_blank">如何面试一名前端开发工程师？</a></li>
<li><a href="https://github.com/hawx1993/Front-end-Interview-questions" target="_blank">史上最全 前端开发面试问题及答案整理</a></li>
<li><a href="http://www.cnblogs.com/xiaoruo/p/4665163.html" target="_blank">前端实习生面试总结</a></li>
<li><a href="https://github.com/hawx1993/Front-end-Interview-questions" target="_blank">史上最全 前端开发面试问题及答案整理</a></li>
<li><a href="http://blog.jobbole.com/78738" target="_blank">BAT及各大互联网公司2014前端笔试面试题：JavaScript篇</a></li>
<li><a href="https://github.com/paddingme/Front-end-Web-Development-Interview-Question" target="_blank">前端开发面试题大收集</a></li>
<li><a href="https://github.com/qiu-deqing/FE-interview" target="_blank">收集的前端面试题和答案</a></li>
<li><a href="http://www.zhihu.com/question/19568008" target="_blank">如何面试前端工程师</a></li>
<li><a href="https://github.com/markyun/My-blog/blob/master/Front-end-Developer-Questions/Questions-and-Answers/README.md" target="_blank">前端开发面试题</a></li>
<li><a href="http://www.nowcoder.com/discuss?type=2" target="_blank">牛客网-笔试面经</a></li>
</ul>
<h2 id="62-iconfont">
<a name="t61"></a>62. <strong>iconfont</strong>
</h2>
<hr>
<ul>
<li><a href="http://www.zhihu.com/question/21253343" target="_blank">中文字体</a></li>
<li><a href="http://iconfont.cn" target="_blank">淘宝字库</a></li>
<li><a href="http://mux.alimama.com/fonts" target="_blank">字体</a></li>
<li><a href="http://iconfont.cn/help/platform.html" target="_blank">制作教程</a></li>
<li><a href="http://www.zhangxinxu.com/wordpress/?s=icomoon" target="_blank">zhangxinxu-icommon</a></li>
<li><a href="https://icomoon.io/app" target="_blank">icommon</a></li>
<li><a href="http://imooc.com/learn/243" target="_blank">用字体在网页中画ICON图标(推荐教程</a></li>
<li><a href="http://font-spider.org" target="_blank">字体压缩工具</a></li>
</ul>
<h2 id="63-fiddler">
<a name="t62"></a>63. <strong>Fiddler</strong>
</h2>
<hr>
<ul>
<li><a href="http://www.cnblogs.com/tugenhua0707/p/4623317.html" target="_blank">Fiddler调式使用知多少(一深入研究)</a></li>
<li><a href="http://www.cnblogs.com/strick/p/4570006.html" target="_blank">微信fiddle</a></li>
<li><a href="http://gaoboy.com/article/26.html" target="_blank">微信fiddle</a></li>
</ul>
<h2 id="64-chrome">
<a name="t63"></a>64. <strong>Chrome</strong>
</h2>
<hr>
<ul>
<li><a href="https://developer.chrome.com/devtools" target="_blank">Google Chrome 官方</a></li>
<li><a href="http://www.cnblogs.com/constantince/p/4565261.html" target="_blank">Chrome - 基础</a></li>
<li><a href="http://www.cnblogs.com/constantince/p/4579121.html" target="_blank">Chrome - 进阶</a></li>
<li><a href="http://www.cnblogs.com/constantince/p/4585983.html" target="_blank">Chrome - 性能</a></li>
<li><a href="http://www.cnblogs.com/constantince/p/4607497.html" target="_blank">Chrome - 性能进阶</a></li>
<li><a href="http://www.cnblogs.com/constantince/p/4624241.html" target="_blank">Chrome - 移动</a></li>
<li><a href="http://www.cnblogs.com/liyunhua/p/4544738.html" target="_blank">Chrome - 使用技巧</a></li>
<li><a href="http://www.cnblogs.com/Wayou/p/chrome-console-tips-and-tricks.html" target="_blank">Chrome - Console控制台不完全指南</a></li>
<li><a href="http://c7sky.com/chrome-devtools-workspace.html" target="_blank">Chrome - Workspace使浏览器变成IDE</a></li>
<li><a href="http://www.html-js.com/article/Nothing-blind%202975" target="_blank">network面板</a></li>
<li><a href="http://anti-code.com/devtools-cheatsheet" target="_blank">chrome开发工具快捷键</a></li>
<li><a href="http://www.html-js.com/article/2327" target="_blank">chrome调试工具常用功能整理</a></li>
<li><a href="http://www.iinterest.net/2014/05/09/chrome-dev-tool-workspace" target="_blank">Chrome 开发工具 Workspace 使用</a></li>
<li><a href="http://www.cppblog.com/deercoder/archive/2011/10/22/158886.html" target="_blank">Chrome神器Vimium快捷键学习记录</a></li>
<li><a href="http://www.w3cplus.com/sassguide/debug.html" target="_blank">sass调试-w3cplus</a></li>
<li><a href="http://www.w3cplus.com/tools/how-to-use-chrome-devtools-like-a-pro.html" target="_blank">如何更专业的使用Chrome开发者工具-w3cplus</a></li>
<li><a href="http://sentsin.com/web/253.html" target="_blank">chrome调试canvas</a></li>
<li><a href="https://developer.chrome.com/devtools/index" target="_blank">chrome profiles1</a></li>
<li><a href="http://www.oschina.net/translate/performance-optimisation-with-timeline-profiles" target="_blank">chrome profiles3</a></li>
<li><a href="https://developer.chrome.com/devtools/docs/mobile-emulation" target="_blank">chrome移动版调试</a></li>
<li><a href="http://ued.taobao.org/blog/2012/06/debug-with-chrome-dev-tool" target="_blank">chrome调试</a></li>
<li><a href="http://www.cnblogs.com/QLeelulu/archive/2011/08/28/2156402.html" target="_blank">chrome的调试</a></li>
<li><a href="https://developer.chrome.com/devtools/docs/commandline-api" target="_blank">chrome console 命令详解</a></li>
<li><a href="http://www.cnblogs.com/leonkao/p/3809655.html" target="_blank">查看事件绑定1</a></li>
<li><a href="http://www.cnblogs.com/xiaoyao2011/p/3447421.html" target="_blank">查看事件绑定2</a></li>
<li><a href="http://segmentfault.com/a/1190000000683599" target="_blank">神器——Chrome开发者工具(一</a></li>
<li><a href="https://xinranliu.me/2015-05-22-qiqu-performance" target="_blank">奇趣百科性能优化(Chrome DevTools 中的 Timeline Profils 等工具使用介绍</a></li>
<li><a href="http://frontenddev.org/link/15-tips-of-chrome-developer-tools.html" target="_blank">chrome 开发者工具的 15 个小技巧</a></li>
<li><a href="http://1ke.co/course/361" target="_blank">Chrome开发者工具不完全指南</a></li>
<li><a href="http://segmentfault.com/a/1190000003882567" target="_blank">Chrome 开发者工具使用技巧</a></li>
</ul>
<h2 id="65-firebug">
<a name="t64"></a>65. <strong>Firebug</strong>
</h2>
<hr>
<ul>
<li><a href="http://www.imooc.com/learn/137" target="_blank">firebug视频教程</a></li>
<li><a href="https://developer.mozilla.org/zh-CN/docs/Tools/WebIDE" target="_blank">firefox 模拟器</a></li>
<li><a href="http://www.cnblogs.com/ctriphire/p/4116207.html" target="_blank">console.log 命令详解</a></li>
<li><a href="http://www.ruanyifeng.com/blog/2008/06/firebug_tutorial.html" target="_blank">Firebug入门指南</a></li>
<li><a href="http://www.ruanyifeng.com/blog/2011/03/firebug_console_tutorial.html" target="_blank">Firebug控制台详解</a></li>
</ul>
<h2 id="66-移动微信调试">
<a name="t65"></a>66. <strong>移动,微信调试</strong>
</h2>
<hr>
<ul>
<li><a href="https://openstf.github.io" target="_blank">浏览器端调试安卓</a></li>
<li><a href="http://yujiangshui.com/multidevice-frontend-debug" target="_blank">移动端前端开发调试</a></li>
<li><a href="https://github.com/yujiangshui/CN-Chrome-DevTools/blob/remote-debugging/md/Use-Tools/remote-debugging.md" target="_blank">使用 Chrome 远程调试 Android 设备</a></li>
<li><a href="http://plus.uc.cn/document/webapp/doc5.html" target="_blank">mac移动端调试</a></li>
<li><a href="http://www.mihtool.com" target="_blank">mac移动端调试</a></li>
<li><a href="http://thx.github.io/mobile/debugging-in-mobile" target="_blank">无线调试攻略</a></li>
<li><a href="http://yanhaijing.com/mobile/2014/12/17/web-debug-for-mobile" target="_blank">无线调试攻略</a></li>
<li><a href="http://www.jianshu.com/p/ccf124f1f74b" target="_blank">屌爆了,完美调试 微信webview(x5</a></li>
<li><a href="/admin/blogs/%E5%BE%AE%E4%BF%A1%E8%B0%83%E8%AF%95%E7%9A%84%E9%82%A3%E4%BA%9B%E4%BA%8B" target="_blank">微信调试的那些事</a></li>
<li><a href="http://jsconsole.com" target="_blank">远程console</a></li>
<li><a href="http://blog.qqbrowser.cc" target="_blank">微信调试工具</a></li>
<li><a href="https://github.com/jieyou/remote_inspect_web_on_real_device" target="_blank">各种真机远程调试方法汇总</a></li>
</ul>
<h2 id="67-ios-simulator">
<a name="t66"></a>67. <strong>iOS Simulator</strong>
</h2>
<hr>
<ul>
<li><a href="https://developer.apple.com/library/ios/documentation/IDEs/Conceptual/iOS_Simulator_Guide/Introduction/Introduction.html" target="_blank">Simulator</a></li>
<li><a href="http://www.crifan.com/intro_ios_simulator_in_xcode_and_usage_summary" target="_blank">iOS Simulator的介绍和使用心得</a></li>
</ul>
<h2 id="68-image">
<a name="t67"></a>68. <strong>Image</strong>
</h2>
<hr>
<ul>
<li><a href="http://preloaders.net/en/circular" target="_blank">loading img</a></li>
<li><a href="http://zhitu.isux.us" target="_blank">智图-图片优化平台</a></li>
<li><a href="https://tinypng.com" target="_blank">在线png优化</a></li>
<li><a href="https://sm.ms/" target="_blank">SM.MS(图床工具～简易好用)</a></li>
<li><a href="http://yotuku.cn/" target="_blank">yutuku：极简图床</a></li>
<li><a href="http://tuchuang.org/" target="_blank">Qchan图床</a></li>
</ul>
<h2 id="69-浏览器同步">
<a name="t68"></a>69. <strong>浏览器同步</strong>
</h2>
<hr>
<ul>
<li><a href="https://github.com/leeluolee/puer" target="_blank">puer</a></li>
<li><a href="http://livereload.com" target="_blank">liveReload</a></li>
<li><a href="http://getf5.com" target="_blank">f5</a></li>
<li><a href="http://geek100.com/2608" target="_blank">File Watchers</a></li>
</ul>
<h2 id="70-在线ppt制作">
<a name="t69"></a>70. <strong>在线PPT制作</strong>
</h2>
<hr>
<ul>
<li><a href="http://js8.in/2013/11/16/%E6%8E%A8%E8%8D%90nodeppt%EF%BC%9A%E4%BD%BF%E7%94%A8markdown%E8%AF%AD%E6%B3%95%E6%9D%A5%E5%86%99%E7%BD%91%E9%A1%B5ppt/" target="_blank">nodePPT</a></li>
<li><a href="http://www.jeffjade.com/2015/10/15/2015-10-16-cleaver-make-ppt/" target="_blank">Cleaver快速制作网页PPT</a></li>
<li><a href="http://www.cnblogs.com/Darren_code/archive/2013/01/04/impressjs.html" target="_blank">impress.js</a></li>
<li><a href="https://github.com/ksky521/nodePPT" target="_blank">PPT</a></li>
<li><a href="https://github.com/hakimel/reveal.js" target="_blank">reveal</a></li>
<li><a href="https://github.com/ebow/bespoke-fx" target="_blank">bespoke-fx</a></li>
<li><a href="https://github.com/Seldaek/slippy" target="_blank">slippy</a></li>
</ul>
<h2 id="71-前端导航网站">
<a name="t70"></a>71. <strong>前端导航网站</strong>
</h2>
<hr>
<ul>
<li><a href="http://uxbees.com/index.html" target="_blank">界面清爽的前端导航</a></li>
<li><a href="http://whycss.com" target="_blank">前端导航</a></li>
<li><a href="http://www.daqianduan.com/nav" target="_blank">前端网址导航</a></li>
<li><a href="http://sentsin.com/daohang" target="_blank">前端名录</a></li>
<li><a href="http://123.jser.us" target="_blank">前端导航</a></li>
<li><a href="http://www.css88.com/nav" target="_blank">前端开发资源</a></li>
<li><a href="http://code.ciaoca.com" target="_blank">前端开发仓库 - 众多效果的收集地</a></li>
<li><a href="https://github.com/jnoodle/f2e-collect" target="_blank">前端资源导航</a></li>
<li><a href="http://f2e.im/static/pages/nav/index.html" target="_blank">F2E 前端导航</a></li>
</ul>
<h2 id="72-常用cdn">
<a name="t71"></a>72. <strong>常用CDN</strong>
</h2>
<hr>
<ul>
<li><a href="http://lib.sinaapp.com" target="_blank">新浪CDN</a></li>
<li><a href="http://cdn.code.baidu.com" target="_blank">百度静态资源公共库</a></li>
<li><a href="http://libs.useso.com" target="_blank">360网站卫士常用前端公共库CDN服务</a></li>
<li><a href="http://www.bootcdn.cn" target="_blank">Bootstrap中文网开源项目免费 CDN 服务</a></li>
<li><a href="http://staticfile.org" target="_blank">开放静态文件 CDN - 七牛</a></li>
<li><a href="http://www.jq22.com/cdn" target="_blank">CDN加速 - jq22</a></li>
<li><a href="http://code.jquery.com" target="_blank">jQuery CDN</a></li>
<li><a href="http://www.asp.net/ajax/cdn" target="_blank">微软CDN</a></li>
</ul>
<h2 id="73-git">
<a name="t72"></a>73. <strong>Git</strong>
</h2>
<hr>
<ul>
<li><a href="http://git-scm.com" target="_blank">git-scm</a></li>
<li><a href="/admin/blogs/%E5%BB%96%E9%9B%AA%E5%B3%B0-Git%E6%95%99%E7%A8%8B" target="_blank">廖雪峰-Git教程</a></li>
<li><a href="https://git-for-windows.github.io" target="_blank">git-for-windows</a></li>
<li><a href="http://daemon369.github.io/git/2015/03/10/add-ssh-keys-for-github" target="_blank">GitHub 添加 SSH keys</a></li>
<li><a href="http://www.worldhello.net/gotgithub/index.html" target="_blank">gogithub</a></li>
<li><a href="http://pcottle.github.io/learnGitBranching" target="_blank">git常规命令练习</a></li>
<li><a href="https://github.com/xirong/my-git" target="_blank">git的资料整理</a></li>
<li><a href="http://www.cnblogs.com/fanfan259/p/4810517.html" target="_blank">我所记录的git命令（非常实用）</a></li>
<li><a href="https://github.com/xirong/my-git/blob/master/git-workflow-tutorial.md" target="_blank">企业开发git工作流模式探索部分休整</a></li>
<li><a href="https://github.com/phodal/github-roam" target="_blank">GitHub 漫游指南</a></li>
<li><a href="https://github.com/tiimgreen/github-cheat-sheet/blob/master/README.zh-cn.md" target="_blank">GitHub秘籍</a></li>
<li><a href="http://livoras.com/post/28" target="_blank">使用git和github进行协同开发流程</a></li>
<li><a href="http://onlywei.github.io/explain-git-with-d3" target="_blank">动画方式练习git</a></li>
</ul>
<h2 id="74-各种日期日历">
<a name="t73"></a>74. <strong>各种日期日历</strong>
</h2>
<hr>
<ul>
<li><a href="http://www.my97.net/dp/demo/index.htm" target="_blank">经典my97</a></li>
<li><a href="http://www.cnblogs.com/gbin1/archive/2012/04/16/2452105.html" target="_blank">强大的独立日期选择器</a></li>
<li><a href="http://fullcalendar.io" target="_blank">fullcalendar</a></li>
<li><a href="http://blog.csdn.net/francislaw/article/details/7740630" target="_blank">fullcalendar日历控件知识点集合</a></li>
<li><a href="http://blog.sina.com.cn/s/blog_9475b1c101012c5f.html" target="_blank">中文api</a></li>
<li><a href="https://github.com/zzyss86/LunarCalendar" target="_blank">农历日历</a></li>
<li><a href="http://www.sucaisj.com/jiaoben/date/201509/16856.html" target="_blank">超酷的仿百度带节日日历老黄历控件</a></li>
<li><a href="http://momentjs.com" target="_blank">日期格式化</a></li>
<li><a href="https://github.com/Johnqing/QPAYCalendar" target="_blank">大牛日历控件</a></li>
<li><a href="https://github.com/Iamlars/dateMarker" target="_blank">我群某管理作品</a></li>
<li><a href="http://digitalbush.com/projects/masked-input-plugin" target="_blank">input按位替换-官网</a></li>
<li><a href="https://github.com/digitalBush/jquery.maskedinput/tree/1.2.2" target="_blank">input按位替换-github</a></li>
<li><a href="https://github.com/dangrossman/bootstrap-daterangepicker" target="_blank">bootstrap-daterangepicker</a></li>
<li><a href="http://www.vandelaydesign.com/30-best-free-jquery-plugins" target="_blank">国外30个插件集合</a></li>
<li><a href="http://dbushell.com/2012/10/09/pikaday-javascript-datepicker" target="_blank">JavaScript datepicker</a></li>
<li><a href="http://jonthornton.github.io/Datepair.js" target="_blank">Datepair.js</a></li>
<li><a href="https://github.com/glad/glDatePicker" target="_blank">一个风格多样的日历</a></li>
<li><a href="http://amsul.ca/pickadate.js/date" target="_blank">弹出层式的全日历</a></li>
<li><a href="http://www.daterangepicker.com" target="_blank">jquery双日历</a></li>
<li><a href="http://www.frankdemo.cn/index.php?c=content&amp;a=show&amp;id=115" target="_blank">大气实用jQuery手机移动端日历日期选择插件</a></li>
<li><a href="https://mobiscroll.com" target="_blank">jQuery Mobile 移动开发中的日期插件Mobiscroll</a></li>
</ul>
<h2 id="75-date-library">
<a name="t74"></a>75. <strong>Date library</strong>
</h2>
<hr>
<ul>
<li><a href="https://github.com/datejs/Datejs" target="_blank">Datejs</a></li>
<li><a href="http://sugarjs.com/api/Date" target="_blank">sugarjs</a></li>
</ul>
<h2 id="76-其它">
<a name="t75"></a>76. <strong>其它</strong>
</h2>
<hr>
<ul>
<li><a href="http://mockjs.com" target="_blank">Mock.js 是一款模拟数据生成器</a></li>
<li><a href="http://framework7.taobao.org" target="_blank">特色的HTML框架可以创建精美的iOS应用</a></li>
<li><a href="http://m.sui.taobao.org" target="_blank">淘宝SUI</a></li>
<li><a href="http://avalonjs.github.io" target="_blank">avalonjs</a></li>
<li><a href="http://ued.qunar.com/oniui/index.html" target="_blank">Avalon新一代UI库： OniUI</a></li>
<li><a href="https://github.com/RubyLouvre/avalon.oniui" target="_blank">avalon.oniui-基于avalon的组件库</a></li>
<li><a href="http://cli.im" target="_blank">生成二维码(草料)</a></li>
</ul>
<h2 id="77-效果类">
<a name="t76"></a>77. <strong>效果类</strong>
</h2>
<hr>
<ul>
<li><a href="http://www.imooc.com/learn/58" target="_blank">弹出层</a></li>
<li><a href="http://www.imooc.com/learn/18" target="_blank">焦点图轮播特效</a></li>
<li><a href="http://www.zhihu.com/question/24398907" target="_blank">HTML5 有哪些让你惊艳的 demo？</a></li>
</ul>
<h2 id="78-弹出层">
<a name="t77"></a>78. <strong>弹出层</strong>
</h2>
<hr>
<ul>
<li><a href="https://github.com/aui/artDialog" target="_blank">artDialog 最新版</a></li>
<li><a href="http://aui.github.io/artDialog/doc/index.html" target="_blank">artDialog 文档</a></li>
<li><a href="https://code.google.com/p/artdialog/downloads/list" target="_blank">google code 下载地址</a></li>
<li><a href="http://layer.layui.com" target="_blank">贤心弹出层</a></li>
<li><a href="https://github.com/bh-lay/UI" target="_blank">响应式用户交互组件库</a></li>
<li><a href="http://t4t5.github.io/sweetalert" target="_blank">sweetalert-有css3动画弹出层</a></li>
</ul>
<h2 id="79-优秀javascript项目">
<a name="t78"></a>79. <strong>优秀JavaScript项目</strong>
</h2>
<hr>
<ul>
<li><a href="https://github.com/AngularClass/angular2-webpack-starter" target="_blank">Angular和Webpack种子文件</a></li>
<li><a href="https://github.com/fex-team/fis3" target="_blank">Fis3面向前端的工程构建系统</a></li>
<li><a href="https://github.com/fex-team/fis3-demo" target="_blank">Fis3 DEMO</a></li>
<li><a href="https://github.com/JsAaron/jQuery" target="_blank">前端JQuery系列:源码剖析</a></li>
<li><a href="https://github.com/RubyLouvre/avalon" target="_blank">avalon框架</a></li>
<li><a href="https://github.com/Microsoft/ChakraCore" target="_blank">Microsoft ChakraCore 微软的Chakra引擎</a></li>
<li><a href="https://github.com/cykod/Quintus" target="_blank">Quintus HTML游戏引擎</a></li>
<li><a href="https://github.com/STRML/strml.net" target="_blank">一个用node.js搭建的有趣博客</a></li>
<li><a href="https://github.com/zxlie/FeHelper" target="_blank">Web前端助手–FeHelper（Chrome扩展）</a></li>
<li><a href="https://github.com/baidu-ife/ife" target="_blank">百度前端技术学院</a></li>
<li><a href="https://github.com/cheeriojs/cheerio" target="_blank">Cheerio（node.js中的jQuery）</a></li>
<li><a href="https://github.com/BryanYang/freechat" target="_blank">nodejs的一个聊天软件 类似微信</a></li>
<li><a href="https://github.com/stkevintan/Cube" target="_blank">使用html5和node.js构建的网易云音乐</a></li>
<li><a href="https://github.com/babel/babel" target="_blank">babel ES6转换为ES5</a></li>
<li><a href="https://github.com/fex-team/ueditor" target="_blank">一个JS富文本编辑器</a></li>
<li><a href="https://github.com/fex-team/kityminder-core" target="_blank">一个JS脑图可视化工具</a></li>
<li><a href="https://github.com/ellisonleao/clumsy-bird" target="_blank">一个JS写的Flappy Bird Game</a></li>
<li><a href="https://github.com/taisel/IodineGBA" target="_blank">一个JS写的GBA模拟器</a></li>
<li><a href="https://github.com/SegmentFault/HyperDown.js" target="_blank">SegmentFault写的Markdown解析器</a></li>
<li><a href="https://github.com/TryGhost/Ghost" target="_blank">基于node.js的Ghost博客</a></li>
<li><a href="https://github.com/ruanyf/react-demos" target="_blank">学习react的demos</a></li>
</ul>
<h2 id="80-其他一些推荐">
<a name="t79"></a>80. 其他一些推荐</h2>
<ul>
<li><a href="http://www.jeffjade.com/2016/03/17/2016-03-17-jade-tools/" target="_blank">那些所倚靠的利器记载</a></li>
<li><a href="http://www.jeffjade.com/2015/12/15/2015-04-17-toss-sublime-text/" target="_blank">如何优雅地使用Sublime Text</a></li>
<li><a href="http://www.cnblogs.com/jadeboy/p/4165449.html" target="_blank">sublime text 下的Markdown写作</a></li>
<li><a href="http://www.jeffjade.com/2016/03/03/2016-03-02-how-to-use-atom/" target="_blank">新编码神器Atom使用纪要</a></li>
<li><a href="http://www.jeffjade.com/2016/03/11/2016-03-11-autohotkey/" target="_blank">Win下最爱效率神器:AutoHotKey</a></li>
<li><a href="http://www.jeffjade.com/2015/07/29/2015-07-29-mac-musthave-software/" target="_blank">Mac必备软件渐集之ZSH－终极Shell</a></li>
<li><a href="http://www.jeffjade.com/2016/01/13/2016-01-13-windows-software-cmder/" target="_blank">Win下必备神器之Cmder</a></li>
<li><a href="http://www.jeffjade.com/2015/10/19/2015-10-18-chrome-vimium/" target="_blank">Vimium~让您的Chrome起飞</a></li>
</ul>
</div>
</div>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
</div>