## 概况 在线地址：`http://www.kancloud.cn/jsfront/month/82796` [JS前端开发群月报](http://www.kancloud.cn/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.kancloud.cn/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/)