前端周刊是一份专为前端从业人员，以及对前端、设计领域感兴趣的朋友们打造的技术周刊。程小狮会精选出前端、设计领域近期相关的资讯、热点以及技术干货，与大家一同分享。
前端周刊 第十一期
前端周刊专注于前端领域技术分享。希望这份周刊能够成为你成长的得力助手与伙伴。
又到了周末，与前端宝宝们相见的时刻，程小狮还是有些激动。因为相见不易，且行且珍惜。
眼瞅着，2016 年就快要结束了。《前端周刊》也迎来了第十一期，回顾从创刊至今，能坚持下来还是不容易的。这一路，我的收获也是蛮多。无论是对前端开发行业的理解，还是在前端技术上的学习，都让我受益匪浅。而大家的支持，也让我为之感动。
在此，对支持我的朋友们，说声谢谢！希望与君同行，越走越远。
那么，今年你在工作上、学习上什么收获呢？欢迎在评论中，与大家分享你的收获与感悟。
与君同行！《前端周刊》第十一期献给大家。
前端技术集——前端干货聚集地
HTML
1. HTML5 元素选择流程图
地址：http://t.cn/RIZTt39
译者：十年踪迹
一张 HTML5 元素选择流程图，与你分享。
2. 使用 HTML5 Canvas 创建动态粒子网格动画
地址：http://t.cn/Rfdfgld
译者：myvin
手把手地教你利用 HTML5 Canvas 创建动态粒子网格动画
CSS
1. 20 条书写 CSS 代码的建议
地址：http://t.cn/RfTcFLa
译者：高华峰
本文翻译自《20 Protips For Writing Modern CSS》，作者将从 CSS 样式使用技巧方面给大家一些建议。
2. CSS 居中：完全指南
地址：http://t.cn/RfRxHaD
译者：EamonnZhang
CSS 的居中是众多 CSS 难点的代表。在本文中，我们将随作者通过不同的场景来了解 CSS 居中那些事。
3. CSS 新特性
地址：http://t.cn/RfHCAE0
作者：大漠
大漠老师在天津在线回声公司分享的 CSS 话题整理。
4. CSS3 Animation 属性众妙
地址：http://t.cn/RfYroS6
作者：Yetty
在本文中，我们将结合实际的开发经验，介绍 CSS3 Animation 属性的一些使用场景及技巧，让你深入了解 CSS3 动画属性。
JavaScript
1. JavaScript 中的作用域（scope）和提升（hoisting）
地址：http://t.cn/Rfn8bUV
作者：亓官翊宸
通过示例讲解 JavaScript 中的作用域、变量与函数提升。
2. JavaScript 字符串实用常操纪要
地址：http://t.cn/RfCSHH7
作者：晚晴幽草轩轩主
JavaScript 字符串用于存储和处理文本。因此在编写 JS 代码之时她总如影随形。在这篇文章中，作者将与大家分享 JavaScript 字符串详细的实用操作。
3. 15 个有趣的 JavaScript 与 CSS 库
地址：http://t.cn/RfEP06t
译者：IT程序狮
一些最新、有趣的 JS 与 CSS 库，收藏备用。
4. 轻量高效的开源 JavaScript 插件和库
地址：http://t.cn/RfEsWY9
作者： jaywcjlove
在这个列表里，你可以找到图片、布局、弹出层、音频视频等各种 JS 插件和库，用来满足你不同的项目需求。
5. Vue 构建单页应用最佳实战
地址：http://t.cn/RqOBL6F
作者：二哲
Vue 实战单页应用。
其他推荐
1. 2016 年前端开发者深度调研
地址：http://t.cn/RfneZrr
作者：王下邀月熊_Chevalier
一份来自 4715 名前端开发者参与的调查，我们将了解在他们的技术体系中使用怎样的前端技术，而最终对于整个前端社区的潮流风向有个大致总览。
2. 2016 年开源巨献：来自百度的 71 款开源项目
地址：http://t.cn/Rf8D55W
作者：灵雨飘零
作者从 OSChina、GitHub 上综合整理的百度开源 70+ 项目，看看有没有你感兴趣的。
3. CodePen 上最新的 12 个热门前端项目
地址：http://t.cn/RfBS2QN
作者：IT程序狮
CodePen 上，一些好玩、有趣的前端项目，它们能让你耳目一新。
4. 三看 SVG Web 动效
地址：http://t.cn/RfNQLxv
作者：lyxuncle
通过三个动效示例，作者将带大家了解 SVG 标签与其属性。
5. 一天精通 Chrome 开发
地址：http://t.cn/RIPztL8
作者：SegmentFault
来自 SegmentFault 的技术专题，带你零基础学习 Chrome 开发。
6. 浅析渲染引擎与前端优化
地址：http://t.cn/RfdHQpB
作者：hanyuxinting
以 Chrome 浏览器的内核 WebKit 为例，带大家对渲染引擎如何展示页面做个简单、全面的了解。
前端新手家园——前端新人好帮手
1. CSS 参考手册
地址：http://t.cn/hDPTG2
作者：@doyoe
应该是国内最好的 CSS 学习手册了。推荐收藏！
2. 一个前端的职业轨迹
地址：http://t.cn/RqZjqkE
作者：欧雷
作者从自身经历出发，结合对他人的了解所总结的前端职业轨迹，供大家参考。
3. Awesome JavaScript 中文版
地址：http://t.cn/RLvefUc
作者：wwsun
全面的 JS 学习列表。
4. 2015-2016 前端知识体系
地址：http://t.cn/RbmsuvF
作者：ouvens
作者总结了了前端这两年的主流技术，供大家参考。
5. GitHub 上有哪些值得推荐的开源电子书？
地址：http://t.cn/R4TJfV5
作者：聞其詳
一些 GitHub 上高质量的免费电子书推荐。
前端猿与射鸡尸——设计的那些事
1. 2017 年 UI 设计的 10 大趋势
地址：http://t.cn/RfSJFQM
译者：Healan
随着 2016 年接近尾声，我们挑选了我们认为您应该在 2017 年 UI 设计的 10 个最重要的趋势，一起来看看。
2. 设计师与程序员不能错过的 10 个酷站
地址：http://t.cn/RI7yQGu
作者：IT程序狮
为前端开发者、设计师带来灵感的 10 个酷站，与大家分享。Have Fun！
3. 如何让设计更具价值
地址：http://t.cn/RfRfroi
作者：福宝
以企鹅 FM 3.0 实际项目为例，带大家了解如何让你的设计更具价值。
程序人生——程序员的成长与故事
1. 如何看英文技术文档
地址：http://t.cn/Rf18MFw
作者：Spxiaomin
作者以 jeykll 文档为例，实战讲解如何看英文技术文档，供初学者参考。
2. 前端开发应该怎么学
地址：http://t.cn/Rfr65Yq
作者：解牛
个人学习前端的经历分享。
3. 26 岁学编程会不会已经晚了？
地址：http://t.cn/RIzoOzN
作者：LEONYao
想做一件事，任何时候都不晚。
如果喜欢本期内容，不妨点个赞，谢谢！同时，也欢迎分享你的感悟。_
网友评论