1.前言社区从6月份开始闹腾，到现在已经快9月份了。按照工作的说法，也就意味着快三个月的试用期已经过去了，准备转正了！一般来说，快转正的时候，会有一个总结或者分享会！所以今天给大家推荐和分享一些我看过的学习资源（主要是博客，博文）。从开始接触前端到截止发稿，看了很多博客，也了解了一些开源项目，质量参差不齐（甚至有广告和鸡汤文）).但是下面推荐的博客、博文、项目或者其他资源都是我接触过的。不敢说资源是最好的、最全的、适合所有人的，但内容质量我还是很满意的。可能有些资源我可能没有仔细阅读、理解、阅读。但是我觉得可以帮助到大家，让大家提高自己的技术水平。希望能给大家一个指导，指导或者解决问题。如果你有什么好的资源，欢迎分享！有一些资源链接，后面会在括号里注明！比如：“html5推广（介绍html5开发的创意广告）”，我加评论的原因可能如下：1.资源很好，干货较多，提醒大家阅读！2.资源是一系列资源中的一个。比如一个系列有20多篇，每篇都有用。我发不了超过20篇的链接，所以我一般发这个系列的第一篇，提醒大家不要忘记看系列！3.资源里面有些内容我个人觉得很有用，有些我觉得没用！提醒大家根据需求挑选观看！4.资源标题可能有点误导，或者资源的其他注意事项，我会加上自己的解释和备注。2.推荐文章（教程）html(5)Post-HTML5EraIPost-HTML5EraII（简单粗暴介绍html5api，不废话）html5promotion（介绍html5开发的创意广告）匠心打造canvas签名组件HTML5/CSS3（汤姆大叔总结的html5和css3的新特性）H5动画开发快车道移动端H5前端性能优化指南玩转HTML5移动页面HTML5进阶系列：文件上传下载HTML5进阶系列：canvas动态图表HTML5进阶系列：draganddropAPI实现拖拽排序（这个系列文章不错，值得一读）H5动效常用制作方法经典画布实例很多，动态离子背景，移动彩球，贪吃蛇，坦克battles,isaman创建100层的高级Canvas粒子动画，心形文字等css（三）CSS3属性教程及案例分享（沙漠中的CSS3干货，可以进去看看一个byone,对学习css3非常有用)CSS3implementation11一个经典的CSS技术（沙漠中CSS3的经典例子都是干货，对学习CSS3非常有用）w3cplusdemo（w3cplus案例，非常值得一看)强大的CSS3（笼统解释CSS3新特性的文章）css3经典教程系列（不要忘记看这个系列，文章都不错）如何写一个轻量级的CSS框架21个CSS进阶技巧原文：CSS3技术-Sprite图片自适应缩放和sprite动画解决方案Flex布局教程：语法Flex布局教程：实例文章精彩的CSS形状（CSS图形）用CSS3制作各种形状的图形（转自他人）CSS趣味专题（一）：The左边竖条的实现方法（看了第一篇，可以往下看，总有帮助，但是这个网站有时候加载不上图片，如果加载不上图片，放弃或者坚持toit,everyonecatchestheidea）纯CSS实现波浪效果！使用浏览器开发者工具检测CSS动画性能解决这些疑难杂症对CSS3动画说yes有效前端1：不要用JS解决可以用html/css解决的问题如何让你的动画更自然Css绘制图形Css各种鼠标In-深入理解CSS3新特性（也是个概括总结，这个系列值得推荐）前端如何抖风吹雨打:after和:before炫酷用法总结神奇的conic-gradient锥形渐变10个优质CSS和JSLOGO动画实例解放GPU-提升CSS3性能【项目总结】浅谈电子商务网站前端css整体架构设计（一）（看了第一篇，别忘了看后面的系列）（后面几篇都是我自己的文章，主要总结css3的新特性，例子css3动画和过渡，我想对大家有帮助(^__^))个人总结(css3新特性)CSS3热身实践--过渡和动画(实现炫酷下拉、手风琴、无缝滚动)写的自己的代码库（css3常用动画实现）javascriptJavaScript核心概念归纳与排序（大致讲解js的一些核心概念）从规范到卓越——API设计之道我眼中的JavaScript函数式编程深入理解JavaScript系列（汤姆大叔写的JavaScript系列，对于学习深入js很有用）javascript组件化如何写出小而清晰的功能？（JS版）javascript对象详解：__proto__和prototype的区别与联系详解设计模式你需要知道的10个javascript最佳开发实践深入理解javascript原型和闭包在本专栏找到这个系列文章，因为作者没有在这个专栏发表系列文章，中间还有其他文章，不过也很好找CMAScript6新特性（es6常用新特性总结说明）jqueryjquery源码分析jQuery中的100个技巧（翻译）保留意见）这几个JQuery性能提升规则需要牢记JQuery的坑，说说大家都踩过的坑（对于刚接触的新手，这篇文章还是有帮助的）jQuery学习笔记（总结讲解jquery常用api，还不错）jQuery插件开发总结vuevue官网Vue2.x踩坑和总结你不知道的Vue但是很实用的黑科技一个栗子实践vue2.0和1.0的区别从来没见过这么简单易懂的Vue教程vue-API(2.3版API)Vue.js插件-in开发详解vue插件编写与实战（一个从开发到发布的过程，例子简单易懂）使用Vue.js制作日历加薪DAY10》Vue开源项目库总结)Vue.js实战技巧（一）（看了第一篇，其他的不要忘了）深入vue2.0底层思想——模板渲染Vue.js——vue-router60分钟速成开始Vue2.1.7源码学习Vue实现原理分析——mvvmVue如何实现双向绑定。不错，顶一下）webpack（后面的文章，有的是webpack1.x和2.x，考虑到现在已经更新到3.x了，看的时候要注意区别）使用优化（基础篇）webpack常用功能介绍开发工具心得：如何让你的Webpack构建效率提升10倍剩下的，本系列文章不错）gulpgulp详细入门教程前端构建工具gulp介绍及技巧gulp入门指南react（刚接触react不久，暂时只看的两个网站）React中国React技术栈系列教程React组件规范git猴子都能看懂的GIT介绍Git教程-廖雪峰官网browsersync(Browsersync中文网-省时省力的浏览器同步测试工具)node.jsusingnpm-NodeSource对Node.js和npm的绝对入门指南-NodeSource中Package.json的基础知识配置.npmrc以获得最佳Node.js环境Markdown理解和入门Markdownyoeman教你从零开始搭建一个前端脚手架工具JavaScript工具库，其他功能。4.17.4版本Fiddler官网Fiddler教程调试分享几个日常调试方法，让JS调试更简单使用Chrome调试你的JavaScriptJavaScript中控制台的用法（看了这篇和上一篇，你可能会觉得以前没用过控制台）细节、优化浅谈移动前端最佳实践前端优化带来的思考浅谈前端工程前端优化实践总结减少前端代码耦合判断列表，加载多张图片并完成终端代码重复率检测【组件化开发】Web开发者如何编写可维护、可升级的代码，网站发布前需要考虑哪些技术细节【单页应用】我们如何应对框架pop-上层层次结构？剥离模板代码加速网页加载移动前端系列-移动端页面性能优化Evolution|手把手教你搭建一个通用的WebVR项目RxJSDeeplearn.js入门：浏览器端机器智能框架分享及技巧列表鸡年快乐！前端周刊（第15期）前端收藏夹（同上篇，是别人总结的，干货不少，不过《前端收藏夹》可能资源太多了，给一下对我来说也有点像往脑袋里放资源的感觉，只要是资源就放进去，有几个资源质量不高，建议大家看看参考一下。）移动web干货收藏夹awesomes（前端一个庞大的资源库，里面包含了所有的资源）知识库（很多语言、框架、库的知识图谱，值得一看！让你知道库里有哪些语言、框架、知识点，并详细讲解每个知识点。还有栗子和文章，比如：javascript知识图谱，html5知识图谱，react知识图谱）前端资源分享给你前端，几个前端推荐摘要文章。在里面，可以阅读别人的代码，向大家学习！segmentfault：我目前活跃在一个以问答为主的社区，还有文章和讲座，质量也很好！知乎：虽然不是纯IT社区，但是里面有很多大牌和优质的栏目！stackoverflow：一个问答社区，基本上各种问题都可以在上面回答w3cplus：一个前端学习的网站，里面的文章质量还是比较不错的，尤其是关于CSS的（三）文章所在的社区有分享，有很多优秀的文章开发者头条前端周刊HTML5梦工厂毕业森墨客网（现在好像很多视频都是收费的，以前看的时候基本是免费的）稀土掘金慧智网6.公众号前端百科segmentfault前端顶峰前端晨读教程W3cplus稀土圈（上图来源于网络）7.推荐关注项目github上的vuereact项目（我只有接触过几次react，用起来还不错，正在学习）gulpwebpackd3chart（和d3一样，属于数据可视化，经验丰富。)ec-css（基于css3开发的代码库，包括hover过渡效果、动画效果、日常使用的预设动画）其他推荐项目腾讯css3ui库NEC：更好的CSS样式解决方案（来自网易的css3解决方案，不过好像挺老了，没人维护，不过可以参考一下里面的案例，一定会有收获的）8.综合项目教程（学习记录）使用node.js+socket.io+redis实现前端基础聊天室场景开发，从草根到英雄（上）前端开发，从草根到英雄（下）title，但其实感觉是一篇总结文章，大家可以看下)Lookingtoatouchofnoveltyforyourmobilewebpage——移动交互网页项目总结（上）为你的移动网页找点新意——移动交互网页项目总结（下）前端开发指南2017【实践HTML5和CSS3第1部分】初探水深，漂亮的导航，华丽的画面爆炸！！（看完别忘了下面是叶小柴在仿智能社官网的实战）基于Vue2.0的移动弹窗（Alert、Confirm、Toast）组件。发现最好的你——如何在设计Webpack+vue项目实战中创建最合适的组件（一、搭建运行环境及相关配置）（本人文章，关于使用vue+webpack开发单页应用，后台管理系统开发搭建，本系列一共五篇）9.开发杂谈OpenDoc-前端简历评分标准（美团出的一份简历评分，大家可以适当参考，自己对比一下实力与美团评级。不过，别忘了多练习，毕竟练习才是最重要的！如果有空或者周末，也可以做自己感兴趣的项目，用在自己项目的开发中！项目不求比人强，只求能练，提高自己的技术水平！--------------------------华丽的分割线-------------------------想了解更多，关注我微信公众号：手厚书阁
