## 概況 在線地址：`http://www.hmoore.net/jsfront/month/82796` [JS前端開發群月報](http://www.hmoore.net/jsfront/month/82796) --- ## 6月份前端資源分享 #### 1. Javascript 175453545 - [「帶 BOM 的 UTF-8」和「無 BOM 的 UTF-8」有什么區別？網頁代碼一般使用哪個？](https://www.zhihu.com/question/20167122) - [前端如何給Js加密，保護自己的知識產權？](https://www.zhihu.com/question/47047191) - [使用多種姿勢上傳圖片](http://mp.weixin.qq.com/s?__biz=MzI2NzExNTczMw==&mid=2653284851&idx=1&sn=9967ae75e786890d438ebbd152c0fcd5&scene=2&srcid=0530nZf2S6OdxB7w0B0188QE&from=timeline&isappinstalled=0#wechat_redirect) - [Javascript框架對比](http://jeffcarp.github.io/frontend-hyperpolyglot/) - [每個單元測試必須回答的 5 個問題](http://www.zcfy.cc/article/423) - [JSDoc 中文文檔](http://www.css88.com/doc/jsdoc/about-namepaths.html) - [如何練習前端技術？](https://www.zhihu.com/question/24543125) - [JS的數組，基礎算法練習和一些Web動畫文章集合](http://mp.weixin.qq.com/mp/homepage?__biz=MjM5NzE0MjQ2Mw==&hid=3&sn=29ad5333a258516ffa2e997e865cd0f6&uin=NzM2MzI5MjQx&key=f5c31ae61525f82e2578dfb2e7d9cf1b25af3ce0d0a96b324769a61a05d73434ee35c458b5261174b8a0d25597998e16&devicetype=iPhone+OS9.3.2&version=16031312&lang=zh_CN&nettype=WIFI&fontScale=100&pass_ticket=92GSbrPt9KTmSEqAZ7CqbY2ZnnFbwClQwZR5Yne79OKkV%2ForkitXH4YdA27vkeX3&scene=2&from=timeline&isappinstalled=0&location=35) - [Babel 插件開發與單元測試覆蓋度檢查](https://www.h5jun.com/post/code-coverage-with-babel-plugin.html) - [一張圖學完Javascript](http://coodict.github.io/javascript-in-one-pic/) - [ES6 免費的交互式教程](http://matrix.h5jun.com/coding?le=3) - [如何重構一個大型歷史項目——百度經驗改版總結](http://yanhaijing.com/program/2016/04/14/how-to-reconstruct-a-large-historical-project/) - [underscore.js 源碼解讀 & 系列文章（未完待續..）](https://github.com/hanzichi/underscore-analysis) - [深入剖析 JavaScript 的深復制](http://jerryzou.com/posts/dive-into-deep-clone-in-javascript/) - [lodash 中文學習拾零之Array篇](http://blog.csdn.net/Soaring_Tiger/article/details/48089017) - [深入剖析 JavaScript 的深復制](http://jerryzou.com/posts/dive-into-deep-clone-in-javascript/) - [Javascript Animation Engine - css3 動畫效果](https://github.com/juliangarnier/anime) - [前端 TOP 100](https://www.awesomes.cn/rank/) #### 2. 移動Javascript開發 群號：148257606 - [canvas圖形繪制之星空、噪點與煙霧效果](http://www.zhangxinxu.com/wordpress/2016/06/canvas-star-noise-smoke/) - [六個漂亮的 ES6 技巧](http://www.zcfy.cc/article/346) - [jQuery WeUI](https://github.com/lihongxun945/jquery-weui) - [“我的微信SDK” - 包括公眾平臺管理、微信支付等各個版本](https://github.com/wxyyxc1992/WXWeChatToolkits) - [不一樣的前端手指操](http://www.jianshu.com/p/e9e47edd58b1) - [WeFlow - 一個高效、強大、跨平臺的前端開發工作流工具](https://weflow.io/) #### 3. Html5 - [Web大前端時代之：HTML5+CSS3入門系列](http://www.cnblogs.com/dunitian/p/5121725.html) - [一張H5游戲頁引起的思考](http://www.cnblogs.com/strick/p/5556434.html) #### 4. CSS - [[譯]css編碼技巧 css coding techniques](https://wangmx.github.io/2016/05/29/css-coding-techniques/) - [css3 animation實現逐幀動畫](http://www.cnblogs.com/Fengzp/p/5548493.html) - [重拾CSS的樂趣](http://www.imooc.com/learn/588) - [PNG格式小圖標的CSS任意顏色賦色技術](http://www.zhangxinxu.com/wordpress/2016/06/png-icon-change-color-by-css/) - [如何理解CSS的display屬性](http://www.w3cplus.com/css/how-well-do-you-know-display.html) - [css hover](http://ianlunn.github.io/Hover/) - [【CSS進階】box-shadow 與 filter:drop-shadow 詳解及奇技淫巧](http://www.cnblogs.com/coco1s/p/5592136.html) - [【CSS進階】CSS 顏色體系詳解](http://www.cnblogs.com/coco1s/p/5622534.html) #### 5. Angular 群號：238251402 - [Projects using AngularJS](https://github.com/angular/angular.js/wiki/Projects-using-AngularJS) - [簡單易用的 angular switch](https://github.com/hjzheng/angular-switch) - [angular.io 中文版](https://github.com/angular/angular-cn) - [國內官網](http://www.angular.live/) - [18年老司機告訴你：我為什么選擇Angular 2](http://mp.weixin.qq.com/s?__biz=MzIwNjQwMzUwMQ==&mid=2247483837&idx=1&sn=932b359504eec2ae50a3bcba2964b3c2&scene=1&srcid=0624s5m2R95dJlrybEInh6xk#wechat_redirect) #### 6. React, Webpack 群號：530415177 - React - [React 移動 web 極致優化](https://segmentfault.com/a/1190000005599249) - [reactjs適合移動端的web頁面開發嗎？](https://www.zhihu.com/question/33683359) - [React.js 到底是迎合部分人口味還是真的是自然而然產生的？](https://www.zhihu.com/question/35935368) - [如何評價 React Native？](https://www.zhihu.com/question/27852694) - [精益 React 學習指南](https://zhuanlan.zhihu.com/leanreact) - [怎樣理順react，flux，redux這些概念的關系](https://www.zhihu.com/question/47686258) - [react如何性能達到最大化(前傳)，暨react為啥非得使用immutable.js](https://segmentfault.com/a/1190000004290333) - Webpack - [【第619期】如何 10 倍提高你的 Webpack 構建效率](http://mp.weixin.qq.com/s?__biz=MjM5MTA1MjAxMQ==&mid=2651221263&idx=1&sn=d13f2615c9cb8eb5a08d41db8eba3fa1&scene=0#wechat_redirect) - [webpack常用配置總結](http://www.h-simon.com/42/) - [Webpack 中文指南](https://zhaoda.gitbooks.io/webpack/content/) - [Webpack 源碼解析](https://lihuanghe.github.io/2016/05/30/webpack-source-analyse.html) #### 7. Vue 群號：364912432 - [Mint UI 基于 Vue.js 的移動端組件庫](http://mint-ui.github.io/) - [webstorm vue插件](https://plugins.jetbrains.com/plugin/8057?pr=webStorm) - [使用Vue.js從零構建GitHub項目瀏覽器](https://segmentfault.com/a/1190000005651367) - [ECharts component for Vue.js.](https://github.com/Justineo/vue-echarts) - [Vue Admin Panel Framework [WIP] ](https://github.com/fundon/vue-admin) - [用 Vue 造了一個 jsFiddle 的輪子](http://ruosen.io/139/) - [Someline Starter 開源](https://www.v2ex.com/t/289895) - [Vue能不能寫一個Android版QQ？](http://gold.xitu.io/post/576dece12e958a0078da63e9) ##### 7.1 Vue 群內資源 - [小凡哥錄制視頻教程](https://github.com/bhnddowinf/vuejs-learn) - [上海-靈瞳 - A simple Webpack + vue-loader setup for quick prototyping.](https://github.com/zhipenglin/mobile-app) #### 8. jQuery - [瀑布流插件 - The Wookmark jQuery plugin](http://www.wookmark.com/jquery-plugin) #### 9. 看書學習 | 成長 - [怎樣做讀書筆記：分享5個我堅持了10年的好習慣](http://weibo.com/2309846073/DxBBdgsNP?type=comment#_rnd1464748879539) - [如何評價家長口中「這孩子特聰明就是學習不用心，他要是認真起來學習成績肯定好」](https://www.zhihu.com/question/39979978) - [大學看哪些書比較適合？](https://www.zhihu.com/question/46726145) - [你的努力程度之低，根本輪不到拼天賦](https://zhuanlan.zhihu.com/p/20129091?f3fb8ead20=1c4ca537fbf11dc08fc665b45498e24c) - [Web前端的路該怎么走？](https://www.zhihu.com/question/34388831) #### 10. Git | Github | SVN | FTP - [從0開始學習 GitHub 系列之「向GitHub 提交代碼](http://mp.weixin.qq.com/s?__biz=MzA4NTQwNDcyMA==&mid=2650661821&idx=1&sn=c6116ed82bff2d083bb152fbd8cbc38d#rd) - [有用的git命令](http://www.ido321.com/1677.html) - [常用的幾十個Git小技巧分類與總結](https://segmentfault.com/a/1190000005706707) - [GitHub 上有些什么好玩的項目？](https://www.zhihu.com/question/37146954) - [github入門教程系列](http://m.weibo.cn/2036070420/3986763045136597/qq?sourceType=qq&from=1066095010&wm=20005_0002) - [webstorm git教程](http://www.hmoore.net/caomenglong/webstorm_guide/49494) - [【WebStorm】利用WebStorm來管理你的Github](http://www.mrfangge.com/how-to-use-webstorm-to-manage-your-github/) #### 11. 創業 | 職場 | 管理 | 產品 | 運營 - [StuQ 專訪：CSS魔法暢聊前端人生](https://github.com/cssmagic/blog/issues/60) - [微信運營有沒有輔助工具？](https://www.zhihu.com/question/20981010) - [前端工程師和 UI 設計師該如何選擇？](https://www.zhihu.com/question/21630068) - [《讀庫》是怎么成功的？](https://www.zhihu.com/question/20489491) - [創業團隊的股權（股份）應該怎么算？](https://www.zhihu.com/question/22851516) - [日本軟銀為什么要出售阿里巴巴股票進行套現，將持股比例降低為28%？](https://www.zhihu.com/question/46971318) - [如何評價期權 (Stock Option) 這種激勵方式？](https://www.zhihu.com/question/21818075) #### 12. IDE，編輯器，調試等工具類 - [用 Markdown 寫作用什么文本編輯器？](https://www.zhihu.com/question/19637157) - [Sublime Text helpers for React](https://github.com/facebookarchive/sublime-react) #### 13. 前端架構及工程化等 - [天貓前端基礎技術體系MAP簡介](https://zhuanlan.zhihu.com/p/21271376) - [淘寶和天貓首頁都用到了哪些技巧或者技術？](https://www.zhihu.com/question/46149490) - [Gulp使用小結(二)](http://www.fefork.com/gulp_2/) - [鏈家網前端總架構師楊永林：我的8年架構師成長之路](http://mp.weixin.qq.com/s?__biz=MzIwNjQwMzUwMQ==&mid=2247483769&idx=1&sn=f4ad37e4af9ee3f0e43183f5e44835cf&scene=2&srcid=06158jB5PxQC90FfEKCOedmI&from=timeline&isappinstalled=0&location=35) #### 14. Sass，PostCSS - [關于PostCSS的一點小科普](http://www.jianshu.com/p/7f8a5d83f4b7) #### 15. 工作 | 協同 | 流程 #### 16. Nodejs 群號：422910907 - [JS一般般的網頁重構可以使用Node.js做些什么](http://www.zhangxinxu.com/wordpress/2016/06/csser-how-to-use-nodejs/) - [node 兼容列表查詢](http://node.green/) - [深入理解Node.js：核心思想與源碼分析](https://yjhjstz.gitbooks.io/deep-into-node/content/) - [調試 Node.js 應用](https://gold.xitu.io/entry/577871f97db2a200552cd107) #### 17. UI - [20張小抄，讓前端開發與設計的效率大幅提升（原圖已打包）](http://www.uisdc.com/shortcut-list-improve-development-efficiency) - [為什么國外的 App 乃至互聯網產品通常都很簡陋？](https://www.zhihu.com/question/46981059) #### 18. 性能優化教程 - [聊一聊淘寶首頁和它背后的一套](http://www.barretlee.com/blog/2016/06/02/thing-about-taobao-homepage/) - [前端性能優化指南](https://segmentfault.com/a/1190000003646305) - [網站性能優化之渲染性能](http://www.jianshu.com/p/a32b890c29b1) #### 19. 面試 | 求職 - [簡歷上的哪些內容才是 HR 眼中的干貨？](https://www.zhihu.com/question/39722495) - [前端綜合面試題](http://www.bishibaodian.com/writtenCircle/findQuestionByKnowledgeId?knowledge_Id=5335ff64-cab5-467f-b3ab-63958237bf2b) - [關于面試的那些事兒（1）](http://mp.weixin.qq.com/s?__biz=MzA3MDExNzcyNA==&mid=2650392112&idx=1&sn=8d39cb28672cc7ed24bf173ceb785b18&scene=0) - [最厲害的面試技巧都有哪些？](https://www.zhihu.com/question/34478434) - [開開心心做幾道JavaScript機試題 - 01](https://segmentfault.com/a/1190000005828394) #### 20. mac ios - [swift開發者個人資料頁](https://github.com/ipader/SwiftGuide/wiki/%E5%BC%80%E5%8F%91%E8%80%85%E4%B8%AA%E4%BA%BA%E8%B5%84%E6%96%99%E9%A1%B5) - [Xcode 插件集：xTextHandler](https://zhuanlan.zhihu.com/p/21380769) - [如何發布一個Mac應用并使其成為全球付費榜第一](http://get.ftqq.com/8458.get) #### 21. php 群號：132984819 - [2016 版 Laravel 系列入門教程（一）](https://github.com/johnlui/Learn-Laravel-5/issues/4) - [YesnoPHP框架是基于Yaf擴展的PHP二次開發框架](https://github.com/winerQin/yesnophp) #### 22. java 群號：145381037 - [Java設計模式（一） 簡單工廠模式不簡單](http://www.jasongj.com/design_pattern/simple_factory/) - [Java攻城獅是如何養成的？](https://www.zhihu.com/question/39139518) #### 22. 英語 - [哪些英語單詞的背后有小故事？](https://www.zhihu.com/question/37874527) - [成為一個好的譯者：我的翻譯心得](https://www.h5jun.com/post/to-be-a-good-translator.html) #### 23. 其它 - 影視 - [細數那些充滿回憶的TVB懸疑警匪劇！看看你錯失了哪一部？](http://photo.weibo.com/5888120096/wbphotos/large/mid/3981240656554628/pid/006qtX0Ygw1f4enb9to73j30c8bs2hdu) - [如何評價電影《x 戰警：天啟》？](https://www.zhihu.com/question/42743135) - [如何通俗易懂地羅列《X 戰警》前幾部影片的劇情？](https://www.zhihu.com/question/23940039) - [如何評價徐浩峰《師父》中炫目的武器？](https://www.zhihu.com/question/38140764) - [看電影1000部以上，是種什么體驗？](https://www.zhihu.com/question/41348958) - [動作電影預告片中，動作鏡頭的銜接有什麼剪輯技巧？](https://www.zhihu.com/question/37699448) - [有哪些電影一定要趁年輕看？](https://www.zhihu.com/question/25699277) - [如何評價網絡劇《余罪》？](https://www.zhihu.com/question/46671146) - 健康，養生 - 歷史，人文 - [長城這么矮究竟能攔住什么？](https://www.zhihu.com/question/25528331) - [推薦一些非專業人士看的好看的歷史書籍吧？](https://www.zhihu.com/question/20909150) - [古代的陣法究竟是什么？](https://www.zhihu.com/question/22993399) - [如何評價余罪這本書？](https://www.zhihu.com/question/27189907) - [是時候讀書了，2016年書單推薦](https://zhuanlan.zhihu.com/p/20448603) - 其它 - [人所能做到的最大的善良是什么？](https://www.zhihu.com/question/33947484) - [searchcode - 搜索引擎匯聚了 Github, Bitbucket, Sourceforge](https://searchcode.com/) - [大公司都有哪些開源項目~~~阿里，百度，騰訊，360，新浪，網易，小米等](http://www.cnblogs.com/dunitian/p/5581520.html) - [你有哪些內行人才知道的省錢訣竅？](https://www.zhihu.com/question/41854964/answer/108510091?f3fb8ead20=1c4ca537fbf11dc08fc665b45498e24c) - [有哪些 100 元以下，很少見但高大上的物件？](http://www.zhihu.com/question/23054572/answer/23902562?f3fb8ead20=1c4ca537fbf11dc08fc665b45498e24c) #### 24. 特別推薦我聯盟群幾個高手的力作或個人網站 1. 高級群 - [【原創】手把手教你打造一款別致的時間線插件](http://seejs.me/2016/06/14/maketimeline/) - [上海-何幻 - 如何應對需求變更](http://thzt.github.io/blog/2016/06/02/requirement-change/) 2. 中級群 3. 初級群 4. 入門群 5. 跳板群3 - [成都-☆幻~精靈 - 利用express簡化rest api開發](https://github.com/hstarorg/rest-express) - [廣州-BarZu - 移動端高性能H5滑動插件JRoll](http://www.chjtx.com/JRoll/)