# 1月份前端資源分享 ####1. Javascript - [視頻-D2前端技術論壇——2015融合](http://www.imooc.com/learn/590) - [不可錯過的javascript迷你庫](http://yanhaijing.com/js/2015/12/29/mini-js-lib/) - [測試框架 Mocha 實例教程](http://www.imooc.com/article/3207) - [為你詳細解讀HTTP請求頭的具體含意](http://jingyan.baidu.com/article/375c8e19770f0e25f2a22900.html) - [Markdown解析的js庫simple-markdown](https://github.com/Khan/simple-markdown) - [如果要用前端框架，開發流程是怎樣的？](http://segmentfault.com/q/1010000004221774) - [obeject.key與object[key]有什么區別](http://segmentfault.com/q/1010000004225321) - [正確使用Github 的方法是什么？](http://segmentfault.com/q/1010000004240527) - [flowchart.js 流程圖插件](http://flowchart.js.org/) - [小tip: 如何讓contenteditable元素只能輸入純文本](http://www.zhangxinxu.com/wordpress/2016/01/contenteditable-plaintext-only/) - [JSNext.fm - 前端技術中文播客節目](http://gold.xitu.io/entry/5690751460b25396c51dbab2) - [前端開發：Javascript那些經典書籍你都造嗎？](http://mp.weixin.qq.com/s?__biz=MzIxNzA4NzQ4OQ==&mid=401622623&idx=1&sn=a97dc2bc54eaee1851dac751fdd79116&scene=23&srcid=01122PCW73oST0hrbdMt8T7H#rd) - [GitHub比較受歡迎的框架排名走勢](https://stats.js.org/) - [How to Learn ES6](https://medium.com/javascript-scene/how-to-learn-es6-47d9a1ac2620#.thbf0i5z4) - [給 JavaScript 初心者的 ES2015 實戰](http://gank.io/post/564151c1f1df1210001c9161) - [ES7中async/await實現原理是什么？](https://www.zhihu.com/question/39571954) - [面向設計的半封裝web組件開發](http://mp.weixin.qq.com/s?__biz=MTEwNTM0ODI0MQ==&mid=402751887&idx=1&sn=3bc0ed7aca8f653f583c833a467b6d46) - [復選框的 CSS 魔法](http://jinlong.github.io/2016/01/14/checkbox-trickery-with-css/) - [如何評價 JavaScript 和 Ruby 的生態系統目前各自的發展狀況？](https://www.zhihu.com/question/39598766) - [在JavaScript中，是否存在“同步非阻塞”和“異步阻塞”這兩種情況？](https://www.zhihu.com/question/39565359) - [[譯]成為 JavaScript 忍者](http://pengisgood.github.io/2016/01/16/becoming-a-javascript-ninja/) - [知乎上復制回答，剪貼板里自動加上版權出處的技術js如何實現？](https://www.zhihu.com/question/38685128) - [你真的會使用XMLHttpRequest嗎？](http://segmentfault.com/a/1190000004322487) - [FastClick 源碼解讀](http://segmentfault.com/a/1190000004295106) - [RxJS 教程](http://segmentfault.com/a/1190000004293922) - [熱炒的前端什么時候能冷靜下來](https://www.zhihu.com/question/39659771) - [各大互聯網公司架構演進之路匯總](http://www.hollischuang.com/archives/1036) - [JavaScript核心 - 「深入ECMA-262-3」系列的一個概覽和摘要](http://weizhifeng.net/javascript-the-core.html) - [[翻譯] JavaScript Scoping and Hoisting](https://segmentfault.com/a/1190000004345355) - [給 JavaScript 初心者的 ES2015 實戰](http://gank.io/post/564151c1f1df1210001c9161) - [Awesomes.cn新增了RSS訂閱源](https://www.awesomes.cn/rss) - [Feature.js 各種瀏覽器特性檢測](http://featurejs.com/) - [新手上路學習JavaScript引擎實現——路線圖](http://zhuanlan.zhihu.com/hllvm/20505562) - [JS一定要放在Body的最底部么？聊聊瀏覽器的渲染機制](http://delai.me/code/js-and-performance/) ####2. 移動Javascript開發 - [支付寶-移動Web解決方案](http://am-team.github.io/default.html) - [微信公眾號編輯有哪些實用的小工具？](https://www.zhihu.com/question/35046637/answer/75730441) - [WeUI 為微信 Web 服務量身設計](https://github.com/weui/weui) - [微信 web 開發者工具詳解](http://www.jikexueyuan.com/course/2463.html) ####3. Html5 - [H5動效的常見制作手法](http://isux.tencent.com/h5active.html) - [在線編輯動畫](http://ds-overdesign.com/transform/matrix3d.html) - [空間秀的發現之旅：Qzone6.0動畫誕生記](http://isux.tencent.com/the-making-of-qzone-6-0-animation.html) - [微信web開發者工具](http://mp.weixin.qq.com/wiki/10/e5f772f4521da17fa0d7304f68b97d7e.html) - [移動端布局終極解決方案 - hotcss](https://github.com/imochen/hotcss) - [滑屏 H5 開發實踐九問](http://isux.tencent.com/nine-question-of-swipe-html5-page.html) ####4. CSS - [Twitter "like" 動畫實戰](http://zhuanlan.zhihu.com/FrontendMagazine/20486738) - [Dribbble動畫實驗室之兩把刷子](http://w3ctrain.com/2016/01/09/Dribbble-Animation-Pratice/) - [各種css動畫](http://codepen.io/collection/HtAne/) - [CSS代碼重構與優化之路](http://luopq.com/2016/01/05/css-optimize/) ####5. Angular ####6. React, Webpack 1. React - [React組件的可視化生成器](http://www.overreact.io/) - [多React Native項目時依賴管理的最佳實踐](http://segmentfault.com/a/1190000004278414) - [學習Webpack - 阮一峰](http://m.weibo.cn/1400854834/3929680178238734) - [react有哪些優秀實用的組件？](https://www.zhihu.com/question/39452825) 2. Webpack - [Webpack中文指南](http://zhaoda.net/webpack-handbook/index.html) - [如何寫一個webpack插件（一）](https://segmentfault.com/a/1190000004279560) - [[譯] 基于 Webpack 和 ES6 打造 JavaScript 類庫](https://github.com/cssmagic/blog/issues/56) - [webpack指南](http://webpack.toobug.net/zh-cn/index.html) - [webpack使用優化](http://www.alloyteam.com/2016/01/webpack-use-optimization/) ####7. Vue - [Vue.js 和 Webpack文章系列（一）](http://djyde.github.io/2015/08/29/vuejs-and-webpack-1/) - [Vue.js 和 Webpack文章系列（二）](http://djyde.github.io/2015/08/30/vuejs-and-webpack-2/) - [Vue.js 和 Webpack文章系列（三）](http://djyde.github.io/2015/08/31/vuejs-and-webpack-3/) - [Evan You - Diving Deep into Vue.js](https://simplecast.fm/s/5e60d9be) ####8. jQuery - [文件上傳](http://fineuploader.com/) ####9. 看書學習 - [在時間管理上，大家有什么好的心得和方法？](https://www.zhihu.com/question/39162973) - [互聯網計算機技術方面的入門書籍有哪些推薦](https://www.zhihu.com/question/19940797) - [【第468期】牛人們有哪些思維方式值得我們學習](http://mp.weixin.qq.com/s?__biz=MjM5MTA1MjAxMQ==&mid=401575204&idx=1&sn=05fa0bb63cb8bd9ed87012dd1133b81f&scene=0#wechat_redirect) - [陌生人的哪些事，讓你感觸很深？](https://www.zhihu.com/question/19866127) - [Web開發學習之路是否有盡頭](http://www.ganiks.me/how-to-avoid-listing-everything-but-carrying-out-little/) - [哪些知識技能一定要掌握？](https://www.zhihu.com/question/35112627/answer/62011613) - [怎樣避免成為伸手黨？](https://www.zhihu.com/question/23883975/answer/27043426) ####10. Git,Github - [正確使用Github 的方法是什么？](http://segmentfault.com/q/1010000004240527) - [記錄我學github的路程（三）](http://www.cnblogs.com/xcywt/p/5068355.html) ####11. 創業 | 職業 | 管理 | 產品 - [Babel 作者的年終總結](https://medium.com/@sebmck/2015-in-review-51ac7035e272#.rlhn2b7i7) - [更簡單、更快捷地呈現DEMO原型](http://www.isux.us/qdemo/index.php) - [專訪｜360奇舞團團長@月影](http://mp.weixin.qq.com/s?__biz=MjM5MTA1MjAxMQ==&mid=401557831&idx=1&sn=ac93d8ee19bdb5413be9a94dccf71b2e&scene=0#wechat_redirect) - [怎樣以創業者的心態「打工」](http://zhuanlan.zhihu.com/robbin/20457539) - [怎么做好互聯網公司的技術團隊負責人？](https://www.zhihu.com/question/39421456/answer/81373074) - [你永遠都無法叫醒一家裝睡的公司](http://zhuanlan.zhihu.com/bigertech/20500602) - [為什么上海出不了一流的互聯網企業？](https://www.zhihu.com/question/19980901) - [為什么老板多數是銷售出身，而不是市場出身？](https://www.zhihu.com/question/21648437) - [大齡程序員怎樣渡過中年危機？](http://zhuanlan.zhihu.com/robbin/20427809) - [IT行業都有哪些職位，初學者該如何選擇，才能夠快速進入這個行業？](https://www.zhihu.com/question/36991788/answer/69902291) - [我的前端之路](http://segmentfault.com/a/1190000004292245) - [賀師俊（hax）在技術上的積累為什么這么深厚？學習路線是怎么樣的？](https://www.zhihu.com/question/39356417) ####12. IDE，編輯器，調試等工具類 - [可多人實時協作在線代碼分享工具 – CodePiple](http://www.imooc.com/article/2400) - [Chrome渲染分析之Rendering工具使用(1)](http://www.ghugo.com/chrome-rendering-tools-1/) - [Chrome渲染分析之Rendering工具使用(2)](http://www.ghugo.com/chrome-rendering-tools-2/) - [Chrome渲染分析之Rendering工具使用(3)](http://www.ghugo.com/chrome-rendering-tools-3/) - [Chrome 瀏覽記錄統計](https://github.com/jiacai2050/chrome-history-stat) - [visual studio code 操作指南](http://i5ting.github.io/vsc/) - [Chorme 35個開發者工具的小技巧](http://www.w3cplus.com/tools/dev-tips.html) - [像 Sublime Text 一樣使用 Chrome DevTools](http://chinagdg.org/2015/12/%E5%83%8F-sublime-text-%E4%B8%80%E6%A0%B7%E4%BD%BF%E7%94%A8-chrome-devtools/) - [如何更專業的使用Chrome開發者工具-w3cplus](http://www.w3cplus.com/tools/how-to-use-chrome-devtools-like-a-pro.html) - [Google Developers-w3cplus](https://developers.google.com/web/updates/devtools/?hl=en) - [DevTools-w3cplus](https://umaar.com/dev-tips/) ####13. 前端架構及工程化等 - [全站 HTTPS 來了](http://geek.csdn.net/news/detail/48765) - [Getting started with gulp](https://markgoodyear.com/2014/01/getting-started-with-gulp/) - [Gulp 入門指南](https://github.com/nimojs/gulp-book) - [TJ - Frontend Boilerplate](https://github.com/tj/frontend-boilerplate) - [架構細節 | 看看 Medium 的開發團隊用了哪些技術？](http://mp.weixin.qq.com/s?__biz=MzA5Nzc4OTA1Mw==&mid=408154901&idx=1&sn=c17573f6fbb2c035db6300ddfc5e9df7#rd&location=35) ####14. Sass，PostCSS ####15. 工作 | 協同 | 流程 - [番茄工作法](http://baike.baidu.com/view/5259318.htm) - [如何融入工作？如何看待工作的意義](https://www.zhihu.com/question/39465280) - [讓思路更清晰——我是怎樣使用思維導圖的](https://blog.coding.net/blog/coding-mindmap) ####16. Nodejs - [Node.js 源站應用穩定性保障](http://taobaofed.org/blog/2016/01/05/dragonfly-stability/) - [node.js能開發大型網站嗎？](https://www.zhihu.com/question/21176891) - [runs Node.js programs through Chromium DevTools](https://github.com/Jam3/devtool) - [Node.js 未來會超越 Java 嗎？](https://www.zhihu.com/question/22098326) - [國內Nodejs 2015匯總](https://cnodejs.org/topic/5696e43e6272216e51bff67e) - [[Node] - 16年，新 Node 項目注意點](https://github.com/gf-rd/blog/issues/29) ####17. UI - [Assistor PS 切圖標記外掛神器](http://witstudio.net/) - [免費了，切圖標記外掛神器 Assistor PS 深入解讀(上)](http://www.bigertech.com/post/assistor-ps-1/) - [免費了，切圖標記外掛神器 Assistor PS 深入解讀(下)](http://www.bigertech.com/post/assistor-ps-2/) - [國外有哪些流行的圖片分享網站](https://www.zhihu.com/question/19670020) - [從零基礎如何自學 UI 設計？](https://www.zhihu.com/question/20857524/answer/41328995) - [超贊！設計師完全自學指南](http://www.uisdc.com/designer-self-study-2) ####18. 性能優化教程 - [前端性能優化-基礎知識認知](http://www.imooc.com/learn/580) - [研究首屏時間？你先要知道這幾點細節](http://www.alloyteam.com/2016/01/points-about-resource-loading/) ####19. 面試相關 - [面試的時候，如何自我介紹？](https://www.zhihu.com/question/19603341) ####20. mac ios - [Mac 上最好用的流程圖軟件是什么？](http://www.zhihu.com/question/19588698) ####21. php - [PHP框架Laravel還是Codeigniter？](https://www.zhihu.com/question/21617669) - [PHP7新特性](http://www.php7.site/book/php7.html) - [PHP7.0新特性](http://www.imooc.com/learn/438) - [PHP的框架通常用于小型項目嗎？](http://segmentfault.com/q/1010000003465862) - [為什么 Laravel 5 這么好一個框架，國人都不去用？](https://www.zhihu.com/question/30622752/answer/79244664) - [Docker入門實戰 - php群貓哥推薦](http://yuedu.baidu.com/ebook/d817967416fc700abb68fca1?fr=aladdin&key=docker%E5%85%A5%E9%97%A8%E5%AE%9E%E6%88%98) ####22. 英語 - [A special issue looking back at the best of 2015](http://javascriptweekly.com/issues/264) - [在中國，英語流利能給個人帶來多少額外的收益？](https://www.zhihu.com/question/37174334) ####23. 其它 - [變量命名神器](http://unbug.github.io/codelf/) - [SegmentFault 2015 年度精選](http://segmentfault.com/a/1190000004292681) - [推薦一個做編程題的網站](http://zhuanlan.zhihu.com/marisa/20528510) - [清明上河圖有哪些鮮為人知又很值得品味的細節？](https://www.zhihu.com/question/29771389) ####24. 特別推薦我聯盟群幾個高手的力作或個人網站 1. 高級群 - [bingoJS是一個前端MV*開發框架](http://bingojs.mydoc.io/) - [KODExplorer是一個公開源碼的基于Web的在線文件管理、代碼編輯器](http://kalcaddle.com/) - [基于javascript和css開發的 Web富文本編輯器， 輕量、簡潔、易用、開源免費](http://wangeditor.github.io/) - [WIKE - prototype源碼分析之class.js](http://52wike.com/prototype/1.html) - [WIKE - prototype源碼分析之array.js](http://52wike.com/prototype/2.html) - [嶺南才子 - web基礎知識（重點學習和復習）](http://note.youdao.com/share/web/file.html?id=cc07fd37527db123daf71ad0691c860a&type=note) - [嶺南才子 - web進階知識點](http://note.youdao.com/share/web/file.html?id=0a8ddaacadcf35c5a864fd21c9a9db66&type=note) 2. 中級群 - [我中級群小伙一翻譯項目-lodashv4.0.0-pre中文翻譯](http://lodash.think2011.net/) - [就是夢想家 - 像夜鶯在夏天門前徹夜清囀](http://94dreamer.com/) - [A JavaScript library like React, but uses Web Components.](http://www.x-view.org/) - [HTML5掃雷游戲](http://blog.csdn.net/liusaint1992/article/details/50531186) - [Runner - 作品集](http://runningls.com/demos/) - [underscorejs 學習參考](https://www.gitbook.com/book/niec-fe/underscorejs/details) - [基于canvas實現UI的H5播放器](http://det101.github.io/) - [ZYL的博客](https://www.zyl.me/) - [low poly風格圖片生成器](http://kinglisky.github.io/lowpoly/) 3. 初級群 - [一個管理系統的前端框架](http://pagurian.com/) 4. 入門群 - [Markcook 1.0--簡潔、高效的markdown編輯器](https://github.com/jrainlau/markcook) 5. 跳板群 群號：492107297 - [從頭開始寫框架(二):孕育框架的種子_上](http://www.cnblogs.com/BlueQ/p/5000860.html) - [sliceAnimate是一個分動畫的輪播插件](https://github.com/taifu5522/sliceAnimate)