前端教程 & 开发模块化 / 规范化 / 工程化 / 优化 & 工具 / 调试 & 值得关注的博客 / Git & 面试...
Claudette80
8年前
<p>本以为自己收藏的站点多，可以很快搞定，没想到一入汇总深似海。还有很多不足&遗漏的地方.</p> <p>有好友反应和斧正，会及时更新，平时业务工作时也会不定期更新...</p> <h2><strong>内容精简</strong></h2> <p>资源这么多，多看看多学习再总结肯定是好的。多读读就算看重了不算浪费时间，毕竟一千个读者就有一千个林黛玉，还有温故而知新，说不定多读一些内容，就发现惊喜了呢。不过，在此也精简一些内容，就1~2项，只供参考。更多内容细看分类。</p> <ul> <li> <p><a href="/misc/goto?guid=4958870312253630531" rel="nofollow,noindex">js：JavaScript 标准参考教程</a></p> </li> <li> <p><a href="/misc/goto?guid=4958823448454672002" rel="nofollow,noindex">js：JavaScript 秘密花园</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721367748124129" rel="nofollow,noindex">Es6：ECMAScript 6入门</a></p> </li> <li> <p><a href="/misc/goto?guid=4959637720000315728" rel="nofollow,noindex">Es6：深入浅出ES6</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721367864694918" rel="nofollow,noindex">css：CSS 参考手册</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721367937399897" rel="nofollow,noindex">jquery：从零开始学习jQuery</a></p> </li> <li> <p><a href="/misc/goto?guid=4959649575041523205" rel="nofollow,noindex">jquery：前端开发者都应知道的 jQuery 小技巧</a></p> </li> <li> <p><a href="/misc/goto?guid=4958865625172818727" rel="nofollow,noindex">移动Web：腾讯移动Web前端知识库</a></p> </li> <li> <p><a href="/misc/goto?guid=4958974312247076951" rel="nofollow,noindex">移动Web：移动web知识资料集-白树</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721368106129623" rel="nofollow,noindex">小程序：微信(小程序or应用号)开发资源汇总-文档-工具-教程-代码-插件-组件...</a></p> </li> <li> <p><a href="/misc/goto?guid=4958965999878690796" rel="nofollow,noindex">Git：Git教程 - 廖雪峰</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721368213910503" rel="nofollow,noindex">Git：设置Git快捷命令</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721368289417047" rel="nofollow,noindex">React：React 入门实例教程 - 阮一峰</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719454453229366" rel="nofollow,noindex">Angular：Angular.js 的一些学习资源</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719455042593158" rel="nofollow,noindex">underscore：underscore.js 手册</a></p> </li> <li> <p><a href="/misc/goto?guid=4959637350766412118" rel="nofollow,noindex">vue：vue.js API 中文</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721368454982243" rel="nofollow,noindex">vue：vue.js 中文入门 - vuejs作者</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721368537252820" rel="nofollow,noindex">RegExp：RegExp对象 - 阮一峰</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719461158229586" rel="nofollow,noindex">RegExp：正则表达式&常用代码</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721368653130583" rel="nofollow,noindex">Node：Node.js 包教不包会</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721368725270302" rel="nofollow,noindex">Node：七天学会NodeJS</a></p> </li> <li> <p><a href="/misc/goto?guid=4959668467186788384" rel="nofollow,noindex">Express：Express 4.x API 中文手册</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721368834754894" rel="nofollow,noindex">Koa：Koa 手册</a></p> </li> <li> <p><a href="/misc/goto?guid=4959668458400160848" rel="nofollow,noindex">前端：Front-End-Develop-Guide 前端开发指南</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721368938791004" rel="nofollow,noindex">模块化：JavaSript模块规范 - AMD规范与CMD规范介绍</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719458498791912" rel="nofollow,noindex">规范化：通过分析github代码库总结出来的工程师代码书写习惯</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721369052449069" rel="nofollow,noindex">工程化：前端工程——基础篇</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721369131317781" rel="nofollow,noindex">关注：github上值得关注的前端项目</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721369199603671" rel="nofollow,noindex">博客：淘宝前端团队</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721369289300266" rel="nofollow,noindex">博客：Tencent AlloyTeam 2016</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719448917817726" rel="nofollow,noindex">博客：FEX 百度WEB前端研发部</a></p> </li> <li> <p><a href="/misc/goto?guid=4959648276937399917" rel="nofollow,noindex">工具：sublime-text & 资料齐聚</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721369429252286" rel="nofollow,noindex">工具：chrome 开发者工具的 15 个小技巧</a></p> </li> <li> <p><a href="/misc/goto?guid=4959625343448110761" rel="nofollow,noindex">优化：转一篇Yahoo关于网站性能优化的文章，兼谈本站要做的优化</a></p> </li> <li> <p><a href="/misc/goto?guid=4959639404033985363" rel="nofollow,noindex">面试：前端开发面试题</a></p> </li> <li> <p><a href="/misc/goto?guid=4958854485248259878" rel="nofollow,noindex">面试：前端开发面试题 - GitHub</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721369587189936" rel="nofollow,noindex">面试：前端开发面试问题及答案整理</a></p> </li> </ul> <h2><strong>前端资源教程类</strong></h2> <p>各种教程会有很多，我也精简的挑选了一些。选择一两个合适的就好了。有时间多看看多比比也是极好的。</p> <h3><strong>JavaScript</strong></h3> <ul> <li> <p><a href="/misc/goto?guid=4959719447505646500" rel="nofollow,noindex">Javascript教程-小白的零基础JavaScript全栈教程-瘳雪峰</a></p> </li> <li> <p><a href="/misc/goto?guid=4958870312253630531" rel="nofollow,noindex">JavaScript 标准参考教程</a></p> </li> <li> <p><a href="/misc/goto?guid=4959638271489117464" rel="nofollow,noindex">重新介绍 JavaScript（JS 教程）</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719447423921096" rel="nofollow,noindex">前端入门教程</a></p> </li> <li> <p><a href="/misc/goto?guid=4959645678167960092" rel="nofollow,noindex">前端开发者手册</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721369788271206" rel="nofollow,noindex">JavaScript学习总结-trigkit4</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721369872403487" rel="nofollow,noindex">温故js系列-对知识点进行回顾知新</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719446942784962" rel="nofollow,noindex">JS函数式编程指南</a></p> </li> <li> <p><a href="/misc/goto?guid=4959639629717352718" rel="nofollow,noindex">JavaScript Promise迷你书（中文版）</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721370005540058" rel="nofollow,noindex">精通JavaScript开发-智能社</a></p> </li> <li> <p><a href="/misc/goto?guid=4958823448454672002" rel="nofollow,noindex">JavaScript秘密花园</a></p> </li> <li> <p><a href="/misc/goto?guid=4959717925938561849" rel="nofollow,noindex">JavaScript 资源大全中文版</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721370122125814" rel="nofollow,noindex">JavaScript闯关记 - 编辑中</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721370208501560" rel="nofollow,noindex">统一回复《怎么学JavaScript？》</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719474042768633" rel="nofollow,noindex">runjs - js在线编辑学习</a></p> </li> <li> <p><a href="/misc/goto?guid=4959649575125492899" rel="nofollow,noindex">常用的Javascript设计模式</a></p> </li> <li> <p><a href="/misc/goto?guid=4959649575534801185" rel="nofollow,noindex">45个实用的JavaScript技巧、窍门和最佳实践</a></p> </li> <li> <p><a href="/misc/goto?guid=4959649575692535694" rel="nofollow,noindex">给JavaScript初学者的24条最佳实践</a></p> </li> <li> <p><a href="/misc/goto?guid=4959649575448334708" rel="nofollow,noindex">编写快速、高效的JavaScript代码</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721370432040666" rel="nofollow,noindex">javascript功能插件大集合</a></p> </li> </ul> <h3><strong>ES6</strong></h3> <ul> <li> <p><a href="/misc/goto?guid=4959721367748124129" rel="nofollow,noindex">ECMAScript 6入门</a></p> </li> <li> <p><a href="/misc/goto?guid=4959637720000315728" rel="nofollow,noindex">深入浅出ES6</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721370533586608" rel="nofollow,noindex">探索ES6</a></p> </li> </ul> <h3><strong>HTML5</strong></h3> <ul> <li> <p>HTML5与CSS3权威指南（书籍）</p> </li> <li> <p><a href="/misc/goto?guid=4959721370609463273" rel="nofollow,noindex">HTML5菜鸟教程</a></p> </li> <li> <p><a href="/misc/goto?guid=4959659353049004780" rel="nofollow,noindex">玩转html5<canvas>画图</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721370725304872" rel="nofollow,noindex">HTML5+NodeJs实现WebSocket即时通讯</a></p> </li> </ul> <h3><strong>CSS3</strong></h3> <ul> <li> <p><a href="/misc/goto?guid=4958868278914084142" rel="nofollow,noindex">CSS 语法参考</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721367864694918" rel="nofollow,noindex">CSS 参考手册</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719452804332457" rel="nofollow,noindex">腾讯css3动画制作工具</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719452965835416" rel="nofollow,noindex">css3 js 移动大杂烩</a></p> </li> <li> <p><a href="/misc/goto?guid=4958825016939205076" rel="nofollow,noindex">Animate.css</a></p> </li> <li> <p><a href="/misc/goto?guid=4959650080916742441" rel="nofollow,noindex">Sass guide</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719459079083251" rel="nofollow,noindex">Sass中文文档</a></p> </li> <li> <p><a href="/misc/goto?guid=4958969386308747588" rel="nofollow,noindex">less</a></p> </li> </ul> <h3><strong>jQuery</strong></h3> <ul> <li> <p><a href="/misc/goto?guid=4959721367937399897" rel="nofollow,noindex">从零开始学习jQuery</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721371023707896" rel="nofollow,noindex">jQuery API 中文文档</a></p> </li> <li> <p><a href="/misc/goto?guid=4958530544722977674" rel="nofollow,noindex">learn JQuery</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721371128961262" rel="nofollow,noindex">JQuery 源码查找</a></p> </li> <li> <p><a href="/misc/goto?guid=4959649575041523205" rel="nofollow,noindex">前端开发者都应知道的 jQuery 小技巧</a></p> </li> <li> <p><a href="/misc/goto?guid=4959649575205064033" rel="nofollow,noindex">10 个 jQuery 图表插件推荐</a></p> </li> </ul> <h3><strong>移动WEB</strong></h3> <ul> <li> <p><a href="/misc/goto?guid=4958865625172818727" rel="nofollow,noindex">腾讯移动Web前端知识库</a></p> </li> <li> <p><a href="/misc/goto?guid=4958974312247076951" rel="nofollow,noindex">移动web知识资料集-白树</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721371269317321" rel="nofollow,noindex">移动端布局终极解决方案 --- 让移动端布局开发更加容易</a></p> </li> <li> <p><a href="/misc/goto?guid=4959639629491965789" rel="nofollow,noindex">移动端学习 - mobileTech</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719456631291743" rel="nofollow,noindex">移动前端的一些坑和解决方法（外观表现）</a></p> </li> <li> <p><a href="/misc/goto?guid=4959648039473697906" rel="nofollow,noindex">zepto</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719457069593652" rel="nofollow,noindex">jqmobile 手册</a></p> </li> <li> <p><a href="/misc/goto?guid=4958875403884683387" rel="nofollow,noindex">移动开发大杂烩</a></p> </li> <li> <p><a href="/misc/goto?guid=4959647152761410753" rel="nofollow,noindex">特色的HTML框架可以创建精美的iOS应用-框架</a></p> </li> </ul> <h3><strong>微信小程序</strong></h3> <ul> <li> <p><a href="/misc/goto?guid=4959721368106129623" rel="nofollow,noindex">微信(小程序or应用号)开发资源汇总-文档-工具-教程-代码-插件-组件...</a></p> </li> </ul> <h3>Git</h3> <ul> <li> <p><a href="/misc/goto?guid=4958965999878690796" rel="nofollow,noindex">Git教程 - 廖雪峰</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719491011394749" rel="nofollow,noindex">GitHub 漫游指南</a></p> </li> <li> <p><a href="/misc/goto?guid=4959636126006156062" rel="nofollow,noindex">企业开发git工作流模式探索</a></p> </li> <li> <p><a href="/misc/goto?guid=4959645088735312029" rel="nofollow,noindex">Git资料</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719490900909341" rel="nofollow,noindex">Git常用命令</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721368213910503" rel="nofollow,noindex">设置Git快捷命令</a></p> </li> </ul> <h3><strong>React</strong></h3> <ul> <li> <p><a href="/misc/goto?guid=4958874692283405843" rel="nofollow,noindex">react.js 官方文档</a></p> </li> <li> <p><a href="/misc/goto?guid=4958870578281658581" rel="nofollow,noindex">React 入门实例教程 - 阮一峰</a></p> </li> <li> <p><a href="/misc/goto?guid=4958872159776707326" rel="nofollow,noindex">React Native 中文版</a></p> </li> </ul> <h3><strong>Angularjs</strong></h3> <ul> <li> <p><a href="/misc/goto?guid=4959719454453229366" rel="nofollow,noindex">Angularjs开发指南</a></p> </li> <li> <p><a href="/misc/goto?guid=4959639316006513120" rel="nofollow,noindex">Angular.js 的一些学习资源</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719455042593158" rel="nofollow,noindex">有jQuery背景，该如何用AngularJS编程思想</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721371792865368" rel="nofollow,noindex">AngularJS 源码分析</a></p> </li> </ul> <h3><strong>Underscore.js</strong></h3> <ul> <li> <p><a href="/misc/goto?guid=4959721368537252820" rel="nofollow,noindex">underscore.js 手册</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719461158229586" rel="nofollow,noindex">underscore.js源码分析</a></p> </li> </ul> <h3>vue.js</h3> <ul> <li> <p><a href="/misc/goto?guid=4958857378973396767" rel="nofollow,noindex">vuejs 官网</a></p> </li> <li> <p><a href="/misc/goto?guid=4959637350766412118" rel="nofollow,noindex">vue.js API 中文</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721368454982243" rel="nofollow,noindex">vue.js 中文入门 - vuejs作者</a></p> </li> <li> <p><a href="/misc/goto?guid=4958977564508786080" rel="nofollow,noindex">vue github</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721371977562334" rel="nofollow,noindex">Element，一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的组件库</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721372055102387" rel="nofollow,noindex">vue2.0 发布了</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719456267628813" rel="nofollow,noindex">Welcome to the Vue Forum!</a></p> </li> </ul> <h3><strong>正则表达式</strong></h3> <ul> <li> <p><a href="/misc/goto?guid=4959719462606815873" rel="nofollow,noindex">RegExp对象 - 阮一峰</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721372201285410" rel="nofollow,noindex">正则表达式&常用代码</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719462687885059" rel="nofollow,noindex">进阶正则表达式</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719462512550975" rel="nofollow,noindex">正则表达式 - MDN</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721368653130583" rel="nofollow,noindex">ES6正则的扩展</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721368725270302" rel="nofollow,noindex">在线正则表达式测试</a></p> </li> </ul> <h3><strong>NodeJs</strong></h3> <ul> <li> <p>深入浅出NodeJs（推荐书籍）</p> </li> <li> <p><a href="/misc/goto?guid=4959639629829368204" rel="nofollow,noindex">Node.js 包教不包会</a></p> </li> <li> <p><a href="/misc/goto?guid=4959556520004475062" rel="nofollow,noindex">七天学会NodeJS</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721372408385043" rel="nofollow,noindex">NodeJs学习笔记</a></p> </li> <li> <p><a href="/misc/goto?guid=4959637721312444676" rel="nofollow,noindex">NodeJs-阮一峰</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721372517016959" rel="nofollow,noindex">Node.js 究竟是什么？</a></p> </li> <li> <p><a href="/misc/goto?guid=4959668467186788384" rel="nofollow,noindex">NodeJs的代码调试和性能调优</a></p> </li> <li> <p><a href="/misc/goto?guid=4959642376367580283" rel="nofollow,noindex">Express 框架学习</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721368834754894" rel="nofollow,noindex">Express 4.x API 中文手册</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721372644425364" rel="nofollow,noindex">Koa 框架学习</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721372721887473" rel="nofollow,noindex">Koa 手册</a></p> </li> </ul> <h3><strong>简单算法</strong></h3> <ul> <li> <p><a href="/misc/goto?guid=4959719466209533597" rel="nofollow,noindex">数据结构与算法 JavaScript 描述. 章节练习</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719466309378161" rel="nofollow,noindex">常见排序算法（JS版</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719466588087601" rel="nofollow,noindex">JS算法 数据结构 精华集</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721368938791004" rel="nofollow,noindex">算法系列15天速成——第一天 七大经典排序【上】</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721372898857941" rel="nofollow,noindex">常见排序算法及优化</a></p> </li> </ul> <h3><strong>前端综合</strong></h3> <ul> <li> <p><a href="/misc/goto?guid=4959668458400160848" rel="nofollow,noindex">Front-End-Develop-Guide 前端开发指南</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719446365844851" rel="nofollow,noindex">前端知识体系</a></p> </li> <li> <p><a href="/misc/goto?guid=4958875403698804895" rel="nofollow,noindex">前端知识结构</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719447592976537" rel="nofollow,noindex">前端工程师必备的PS技能——切图篇</a></p> </li> <li> <p><a href="/misc/goto?guid=4959648269078102840" rel="nofollow,noindex">结合个人经历总结的前端入门方法</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721373106418387" rel="nofollow,noindex">w3help</a></p> </li> <li> <p><a href="/misc/goto?guid=4959627238387477374" rel="nofollow,noindex">响应式布局指南</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721368289417047" rel="nofollow,noindex">关于前端开发谈谈单元测试</a></p> </li> </ul> <h2><strong>前端模块化开发类</strong></h2> <ul> <li> <p><a href="/misc/goto?guid=4959721373224673582" rel="nofollow,noindex">JavaSript模块规范 - AMD规范与CMD规范介绍</a></p> </li> <li> <p><a href="/misc/goto?guid=4959543761979448200" rel="nofollow,noindex">Javascript模块化编程（一）：模块的写法 阮一峰</a></p> </li> <li> <p><a href="/misc/goto?guid=4959543825334947825" rel="nofollow,noindex">Javascript模块化编程（二）：AMD规范 阮一峰</a></p> </li> <li> <p><a href="/misc/goto?guid=4959651659732667251" rel="nofollow,noindex">Javascript模块化编程（三）：require.js的用法 阮一峰</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719458166163045" rel="nofollow,noindex">RequireJS入门（一）Snandy</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719458253311643" rel="nofollow,noindex">RequireJS入门（二）Snandy</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721373450512103" rel="nofollow,noindex">RequireJS入门（三）Snandy</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721373521037306" rel="nofollow,noindex">RequireJS进阶（一）Snandy</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721373607136301" rel="nofollow,noindex">RequireJS进阶（二）Snandy</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719458336153516" rel="nofollow,noindex">RequireJS进阶（二）Snandy</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719458498791912" rel="nofollow,noindex">RequireJS 入门指南</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721373723813372" rel="nofollow,noindex">Seajs 提供简单、极致的模块化开发体验</a></p> </li> </ul> <h2><strong>前端开发规范类</strong></h2> <ul> <li> <p><a href="/misc/goto?guid=4959653344870627429" rel="nofollow,noindex">通过分析github代码库总结出来的工程师代码书写习惯</a></p> </li> <li> <p><a href="/misc/goto?guid=4959653344698831146" rel="nofollow,noindex">HTML&CSS编码规范 by @mdo</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719463175237264" rel="nofollow,noindex">Javascript编码规范-Max Yu</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721373879690374" rel="nofollow,noindex">CSS编码规范-Max Yu</a></p> </li> <li> <p><a href="/misc/goto?guid=4959637636332843867" rel="nofollow,noindex">前端编码规范之JavaScript-小胡子哥</a></p> </li> <li> <p>前端编码规范之css-小胡子哥</p> </li> <li> <p><a href="/misc/goto?guid=4959644291293807322" rel="nofollow,noindex">前端开发规范手册</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721374028570983" rel="nofollow,noindex">前端代码规范 及 最佳实践</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721369052449069" rel="nofollow,noindex">百度前端规范</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719464401904635" rel="nofollow,noindex">网易前端规范</a></p> </li> </ul> <h2><strong>前端工程化类</strong></h2> <p>工程化的工具都不是绝对的，选择合适的使用，项目多了，说不定你都用上了也不一定。反正在我身边我知道的项目中，不同项目用着不同工具，基本都包含了。</p> <ul> <li> <p><a href="https://github.com/fouber/blog/issues/10?from=timeline&isappinstalled=0#" rel="nofollow,noindex">前端工程——基础篇</a></p> </li> <li> <p><a href="/misc/goto?guid=4959639629230980790" rel="nofollow,noindex">Gulp中文网</a></p> </li> <li> <p><a href="/misc/goto?guid=4958825205695716034" rel="nofollow,noindex">Gulp官网</a></p> </li> <li> <p><a href="/misc/goto?guid=4959659947615720919" rel="nofollow,noindex">Gulp：任务自动管理工具 - 阮一峰</a></p> </li> <li> <p><a href="/misc/goto?guid=4959645085822284192" rel="nofollow,noindex">Gulp 入门指南</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721374290469490" rel="nofollow,noindex">Gulp入门教程</a></p> </li> <li> <p><a href="/misc/goto?guid=4958978579255651724" rel="nofollow,noindex">Grunt中文网</a></p> </li> <li> <p><a href="/misc/goto?guid=4958524645657745150" rel="nofollow,noindex">Grunt官网</a></p> </li> <li> <p><a href="/misc/goto?guid=4959643112847689251" rel="nofollow,noindex">fis 前端工具框架</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721374444550120" rel="nofollow,noindex">fis 文档</a></p> </li> <li> <p><a href="/misc/goto?guid=4958870939634769772" rel="nofollow,noindex">Webpack</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721374552705801" rel="nofollow,noindex">Webpack 中文指南</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721374642703258" rel="nofollow,noindex">Webpack傻瓜式指南（一）</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721374717153863" rel="nofollow,noindex">Webpack傻瓜指南（二）开发和部署技巧</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721374791691084" rel="nofollow,noindex">入门Webpack，看这篇就够了</a></p> </li> </ul> <h2><strong>前端开源Git类</strong></h2> <ul> <li> <p><a href="/misc/goto?guid=4959721374875923026" rel="nofollow,noindex">非死book Projects</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721374959216822" rel="nofollow,noindex">Baidu FEX team</a></p> </li> <li> <p><a href="/misc/goto?guid=4959638926130923546" rel="nofollow,noindex">nzakas</a></p> </li> <li> <p><a href="/misc/goto?guid=4958838506750452729" rel="nofollow,noindex">chrome开发团队成员</a></p> </li> <li> <p><a href="/misc/goto?guid=4959670054589005726" rel="nofollow,noindex">玉伯 -支付宝前端Leader</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721375118551409" rel="nofollow,noindex">豆瓣前端Leader</a></p> </li> <li> <p><a href="/misc/goto?guid=4959549058969633704" rel="nofollow,noindex">JacksonTian 朴灵</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721375223792067" rel="nofollow,noindex">伯乐在线</a></p> </li> <li> <p><a href="/misc/goto?guid=4958343085976002622" rel="nofollow,noindex">淘宝UED北京团队</a></p> </li> <li> <p><a href="/misc/goto?guid=4958862968568139158" rel="nofollow,noindex">国外TJ大神</a></p> </li> <li> <p><a href="/misc/goto?guid=4958836571566408427" rel="nofollow,noindex">substack</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721369131317781" rel="nofollow,noindex">支付宝前端美女沉鱼~</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721369199603671" rel="nofollow,noindex">fengmk2</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721369289300266" rel="nofollow,noindex">github上值得关注的前端项目</a></p> </li> </ul> <h2><strong>前端知名博客类</strong></h2> <p>SF内有很多高手，可以前去排行榜看看。。。</p> <ul> <li> <p><a href="/misc/goto?guid=4959719448917817726" rel="nofollow,noindex">淘宝前端团队</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719465091677823" rel="nofollow,noindex">Tencent AlloyTeam 2016</a></p> </li> <li> <p><a href="/misc/goto?guid=4958836157683731590" rel="nofollow,noindex">FEX 百度WEB前端研发部</a></p> </li> <li> <p><a href="/misc/goto?guid=4958849076296879202" rel="nofollow,noindex">EFE 百度EFE(Excellent FrontEnd)技术体系</a></p> </li> <li> <p><a href="/misc/goto?guid=4958861448674781793" rel="nofollow,noindex">qunaer UED</a></p> </li> <li> <p><a href="/misc/goto?guid=4958968139332870245" rel="nofollow,noindex">Ruby-China</a></p> </li> <li> <p><a href="/misc/goto?guid=4958975295131740487" rel="nofollow,noindex">CNodeJs</a></p> </li> <li> <p><a href="/misc/goto?guid=4958326774042942546" rel="nofollow,noindex">伯乐在线</a></p> </li> <li> <p><a href="/misc/goto?guid=4958970398140708408" rel="nofollow,noindex">博客园</a></p> </li> <li> <p><a href="/misc/goto?guid=4959617422797267582" rel="nofollow,noindex">justjavac - 迷渡</a></p> </li> <li> <p><a href="/misc/goto?guid=4959658919620092795" rel="nofollow,noindex">阮一峰的网络日志</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721375721274908" rel="nofollow,noindex">三生石上-专注于前端（JavaScript、jQuery、ExtJS）</a></p> </li> <li> <p><a href="/misc/goto?guid=4959642382075950583" rel="nofollow,noindex">司徒正美-Ruby's Louvre</a></p> </li> <li> <p><a href="/misc/goto?guid=4959648276937399917" rel="nofollow,noindex">张鑫旭 - CSSCSSCSS</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721375848607434" rel="nofollow,noindex">Snandy</a></p> </li> </ul> <h2><strong>前端开发工具类</strong></h2> <ul> <li> <p><a href="/misc/goto?guid=4959719448129947916" rel="nofollow,noindex">sublime-text & 资料齐聚</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721375958921158" rel="nofollow,noindex">SublimeText-快捷键大全</a></p> </li> <li> <p><a href="/misc/goto?guid=4959625758735470665" rel="nofollow,noindex">Gif多图：我常用的 16 个 Sublime Text 快捷键</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721376060951813" rel="nofollow,noindex">AngularJS最理想开发工具WebStorm</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719484817778712" rel="nofollow,noindex">Fiddler调式深入研究(一)</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721376177564041" rel="nofollow,noindex">Fiddler实战深入研究(二)</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721376259217502" rel="nofollow,noindex">移动web调式利器---Rosin研究</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719484904042886" rel="nofollow,noindex">移动开发中Fiddler的那些事儿</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719484987500691" rel="nofollow,noindex">微信内移动前端开发抓包调试工具fiddler使用教程</a></p> </li> <li> <p><a href="/misc/goto?guid=4959637675583151052" rel="nofollow,noindex">Google Chrome 官方</a></p> </li> <li> <p><a href="/misc/goto?guid=4959637600490968453" rel="nofollow,noindex">Chrome开发者工具不完全指南（一、基础功能篇）</a></p> </li> <li> <p><a href="/misc/goto?guid=4959637610023876873" rel="nofollow,noindex">Chrome开发者工具不完全指南（二、进阶篇）</a></p> </li> <li> <p><a href="/misc/goto?guid=4959637616082977643" rel="nofollow,noindex">Chrome开发者工具不完全指南（三、性能篇）</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719485184214012" rel="nofollow,noindex">Chrome开发者工具不完全指南（四、性能进阶篇）</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719485251531715" rel="nofollow,noindex">Chrome开发者工具不完全指南（五、移动篇）</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721369429252286" rel="nofollow,noindex">chrome开发工具快捷键</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721376588555391" rel="nofollow,noindex">Chrome 开发工具 Workspace 使用</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719486863252014" rel="nofollow,noindex">chrome 开发者工具的 15 个小技巧</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721376693918808" rel="nofollow,noindex">天啦噜！原来Chrome自带的开发者工具还能这么用！</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721376777723995" rel="nofollow,noindex">神器——Chrome开发者工具(一)</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719486047855979" rel="nofollow,noindex">使用Chrome开发工具调试Canvas</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719487109719017" rel="nofollow,noindex">WEB调试工具---Firebug-慕课网</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719487195032075" rel="nofollow,noindex">Firefox 开发工具 WebIDE</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719487302618416" rel="nofollow,noindex">Firebug入门指南 - 阮一峰</a></p> </li> <li> <p><a href="/misc/goto?guid=4959546476349948689" rel="nofollow,noindex">Firebug控制台详解 - 阮一峰</a></p> </li> <li> <p><a href="/misc/goto?guid=4959622518019986321" rel="nofollow,noindex">移动端前端开发调试</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719487823009315" rel="nofollow,noindex">屌爆了,完美调试 微信webview(x5)</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721377063119165" rel="nofollow,noindex">微信调试的那些事</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721377150005166" rel="nofollow,noindex">在线二维码图片生成器</a></p> </li> <li> <p><a href="/misc/goto?guid=4958839376500515304" rel="nofollow,noindex">Smart PNG and JPEG compression在线图片压缩</a></p> </li> <li> <p><a href="/misc/goto?guid=4958537221933699146" rel="nofollow,noindex">easyicon 图标下载</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721377378602107" rel="nofollow,noindex">Icon Hover Effects</a></p> </li> </ul> <h2><strong>前端性能优化类</strong></h2> <ul> <li> <p><a href="/misc/goto?guid=4959626377211648347" rel="nofollow,noindex">Javascript高性能动画与页面渲染</a></p> </li> <li> <p><a href="/misc/goto?guid=4959625343448110761" rel="nofollow,noindex">移动H5前端性能优化指南</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719474641516442" rel="nofollow,noindex">给网页设计师和前端开发者看的前端性能优化</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719475835393188" rel="nofollow,noindex">转一篇Yahoo关于网站性能优化的文章，兼谈本站要做的优化</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719475908663886" rel="nofollow,noindex">Yahoo!团队实践分享:网站性能优化的34条黄金守则(一)—内容</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719475997277496" rel="nofollow,noindex">网站性能优化指南：什么使我们的网站变慢？</a></p> </li> <li> <p><a href="/misc/goto?guid=4958530385288575575" rel="nofollow,noindex">分享网页加载速度优化的一些技巧</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721377651551928" rel="nofollow,noindex">【高性能前端1】高性能HTML -</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721377727503375" rel="nofollow,noindex">【高性能前端2】高性能CSS</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719477493368490" rel="nofollow,noindex">前端工程精粹（一）：静态资源版本更新与缓存</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719477582362097" rel="nofollow,noindex">前端工程精粹（二）：静态资源管理与模板框架</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721377859998897" rel="nofollow,noindex">让网站提速的最佳前端实践</a></p> </li> <li> <p><a href="/misc/goto?guid=4959639404033985363" rel="nofollow,noindex">阿里无线前端性能优化指南 (Pt.1 加载期优化)</a></p> </li> <li> <p><a href="/misc/goto?guid=4958854485248259878" rel="nofollow,noindex">pagespeed - 检测网页性能及优化建议</a></p> </li> </ul> <h2><strong>前端面试类</strong></h2> <p>面试题可以供我们学习补漏，但面试题始终有一种应对面试的感觉。请相信面试官能轻易的看出你的斤两，掌握基础和提升技术才是最重要的。这些面试题也是极好的。</p> <ul> <li> <p><a href="/misc/goto?guid=4959721369587189936" rel="nofollow,noindex">前端开发面试题</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719484056154934" rel="nofollow,noindex">前端开发面试题 - GitHub</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721377999278179" rel="nofollow,noindex">前端开发面试问题及答案整理</a></p> </li> <li> <p><a href="/misc/goto?guid=4958875403417677784" rel="nofollow,noindex">front-end development interview questions and answers</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719483632781688" rel="nofollow,noindex">如何面试一名前端开发工程师？</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719483749726692" rel="nofollow,noindex">前端实习生面试总结</a></p> </li> <li> <p><a href="/misc/goto?guid=4959629560171328161" rel="nofollow,noindex">前端开发面试题大收集</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719483973391704" rel="nofollow,noindex">如何面试前端工程师？ - 知乎</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719483464987942" rel="nofollow,noindex">5个经典的前端面试问题</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721378257201218" rel="nofollow,noindex">10个常见的Node.js面试题</a></p> </li> <li> <p><a href="/misc/goto?guid=4959719483216378557" rel="nofollow,noindex">百度FEX 的面试</a></p> </li> <li> <p><a href="/misc/goto?guid=4958975919043625190" rel="nofollow,noindex">40 个重要的 HTML5 面试问题及答案</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721378387907901" rel="nofollow,noindex">BAT及各大互联网公司2014前端笔试面试题：JavaScript篇</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721378469009108" rel="nofollow,noindex">TCP三次握手&Render Tree页面渲染=>从输入URL到页面显示的过程</a></p> </li> <li> <p><a href="/misc/goto?guid=4959721378554044566" rel="nofollow,noindex">前端进阶-让你升级的网络知识</a></p> </li> </ul> <p> </p> <p>来自：https://segmentfault.com/a/1190000007062464</p> <p> </p>