Create 3.4-Frontend.md

Weekly/2017/3/3.4-Frontend.md

+> url: FE-Weekly-6
+> topicL 前端每周清单、前端、jQuery、Vue、PWA
+
+> [前端每周清单第6期：Angular  4.0学习资源，Egg.js 1.0发布，六问CTO程序员如何成长](https://zhuanlan.zhihu.com/p/26029047) 为InfoQ中文站特供稿件，首发地址为[这里](https://parg.co/bQh)；如需转载，请与InfoQ中文站联系。从属于笔者的 [Web 前端入门与工程实践](https://github.com/wxyyxc1992/Web-Frontend-Introduction-And-Engineering-Practices)，更多前端知识图谱与学习路线图参考[泛前端知识图谱（Web/iOS/Android/RN）](https://zhuanlan.zhihu.com/p/25939682) 。
+
+# 前端每周清单第6期：Angular  4.0学习资源，Egg.js 1.0发布，六问CTO程序员如何成长
+
+`前端` `前端每周清单`
+
+[前端每周清单](http://www.infoq.com/cn/FE-Weekly)专注前端领域内容，分为新闻热点、开发教程、工程实践、深度阅读、开源项目、巅峰人生等栏目。关注【前端之巅】微信公众号（ID：frontshow），及时获取前端每周清单。
+
+## 新闻热点
+
+`国内国外，前端最新动态`
+
+- [《Angular 4.0.0 发布》](https://parg.co/bsw)：今日 Angular 团队宣布发布 4.0.0 版本，该版本能够向后兼容绝大部分 2.x.x 应用。在 4.0.0 中，带来的主要改变包括应用更小并且速度更快、更新了视图引擎，减少了将近 60% 的生成代码、并且引入了动画库作为预置的核心库的一部分等 。( https://parg.co/bsw )
+- [《Egg.js 1.0.0 正式发布》](https://zhuanlan.zhihu.com/p/25860846)：Egg.js 是企业级 Node.js 框架沉淀自阿里各行各业不同领域最佳实践的插件，涵盖了常见的业务开发场景，稳定支撑了 15 和 16 年天猫双 11 大促，顶级流量压力 。其秉持渐进式理念，极具伸缩性，既适合个人小项目快速开发，也适合企业级的团队开发协作。( https://zhuanlan.zhihu.com/p/25860846 )
+- [《WebStorm 2017.1 增加对 Vue.js 的支持》](https://parg.co/bQU)：近日，JetBrains 发布了其最受欢迎的 WebStorm IDE 的 2017.1 版本，毫不例外地增加了对 Vue.js 的支持。WebStorm 现在会识别 .vue 文件并在模板中增加代码补全功能。当引用其他视图组件时，WebStorm 也将能够自动补全代码并自动增加 import 声明。( https://parg.co/bQU )
+
+
+## 开发教程
+
+`步步为营，掌握基础技能`
+
+- [《CSS Grid 典型案例》](https://sii.im/playground/css-grid/)：该网站提供了一系列基于 React 编写的 CSS Grid 布局的测试样例，是个不错的从实例中学习 CSS Grid 语法与使用的教程。( https://sii.im/playground/css-grid/#/ )
+- [《Webpack 实践教程》](https://parg.co/bsL)：本系列教程着眼于介绍真实应用中 Webpack 的使用，包含了三个部分：构建基础前端项目与添加编译支持、减少包体体积与缓存、加速构建与提升开发工作流。( https://parg.co/bsL )
+- [《面向“远古” Web 开发者的现代 JavaScript 教程》](https://parg.co/bsF)：本文主要是面向那些从 PHP、JSP、Rails 占据统治地位时开始进行 Web 技术的开发者进行常见的现代 JavaScript 基础概念的介绍。( https://parg.co/bsF )
+- [《你应该知道的关于 Node.js 中模块导入的知识》](https://parg.co/bQl)：在 Node.js 开发中我们时刻都在于其模块机制打交道，而本文作者则深入浅出地介绍了 Node.js 中负责处理模块依赖的两个核心模块：require 与 module；并且介绍了不同的导入对象在 Node.js 中实际的递归处理流程以及最终在 module 中形成的元数据描述。( https://parg.co/bQl )
+- [《Angular 4 学习资源》](https://parg.co/bQ0)：随着 Angular 4 的正式发布，本文也收集了部分学习 Angular 4 的资源，包括特性总结、服务端渲染、响应式编程、样式指南等等多个部分。( https://parg.co/bQ0 )
+## 工程实践
+
+`立足实践，提示实际水平`
+
+- [《Dropbox：使用同域 Cookie 避免跨站攻击》](https://parg.co/bs5)：跨站请求伪造（CSRF）是常见的网络渗透攻击手段之一，攻击者会误导用户在攻击站点上对目标站点发起非法请求。本文是 Dropbox 工程师分享他们在实践中常用的防御经验分享，包括使用动态表单令牌、同域 Cookie 等等。(https://parg.co/bs5)
+- [《跨浏览器插件模板》](https://parg.co/bsi)：随着 Firefox 也开始支持 WebExtensions，我们可以更加方便地编写跨浏览器插件，尽可能地复用代码。本仓库则提供了基础的插件模板，实现了一次编写，多处运行、热加载等多个便捷功能的预置。( https://parg.co/bsi )
+- [《VS Code 使用贴士与技巧》](https://parg.co/bsk): VSCode 是非常轻量易用的软件开发工具，其丰富的插件系统能够极大地满足开发需求。本文则是作者总结的一系列 VS Code 使用技巧的总结与介绍，譬如常用命令操作、文件管理、Git 集成、调试与任务运行等等。(https://parg.co/bsk)
+- [《解密 JavaScript 异步编程》](https://parg.co/bsz)：JavaScript 中异步编程历经了多个大的迭代，从回调到 Promise 到生成器以及现在的 Async/Await；本文作者则是高屋建瓴地介绍了 JavaScript 异步编程的变迁历史以及简要的内部实现原理。( https://parg.co/bsz )
+- [《Webpack CommonsChunkPlugin 与多入口公共代码提取》](https://parg.co/bQb)：在构建基于 Webpack 的前端工作流时，CommonsChunkPlugin 是常用的公共代码提取插件。而本文则是 Webpack 开发团队对于社区反馈的CommonsChunkPlugin 使用过程中的一些误区与同步/异步公共代码块提取的实践进行总结与分析。( https://parg.co/bQb )
+- [《构建可维护的大型 Angular 2 应用》](https://parg.co/bQm)：本文是来自 Versett 的工程师介绍其团队在基于 Angular 2 构建大型应用时的实践与总结。( https://parg.co/bQm )
+- [《开发 React Native 与 Redux 应用一年来的错误总结》](https://parg.co/bQS)：本文作者总结了他在过去一年中 React Native 与 Redux 开发中遇到的错误的复盘与总结，譬如布局文件分割、Redux Store 设计、项目目录结构、表单验证等多个方面。( https://parg.co/bQS )
+
+## 深度阅读
+
+`深度思考，升华开发智慧`
+- [《浅析 WebAssembly 缘何优于 Asm.js》](https://parg.co/bsv)：WebAssembly 是新的 Web 中可执行格式，逐现代浏览器纷纷地提供了对于 WebAssembly 的原生支持；本文则是对于 WebAssembly 相较于 asm.js 带来的性能提升背后的原理进行简要介绍。(https://parg.co/bsv)
+- [《ES7 Async/Await 常见误区》](https://parg.co/bsW)：ECMAScript 6 引入的 Promise 大大简化了 JavaScript 中异步编程语法，而 ES7 引入的 Async 则使其更为优雅；本文作者对于实践中常见的对于 Async/Await 的语法误用案例进行了解析。( https://parg.co/bsW )
+- [《React Conf 2017 盘点》](https://parg.co/bsg)：本文作者对于近日举办的 React Conf 2017 中的精彩演讲进行了盘点，包括 Redux 与 MobX 在状态管理领域的对比、ReactVR 等一系列优秀的基于 React 的扩展项目、代码格式化与样式组件、服务端渲染等等。( https://parg.co/bsg )
+- [《百度 SSP 单页式应用性能优化实践》](https://parg.co/bQH)：针对首页和部分页面打开速度慢的问题，百度SSP前端团队对单页式应用性能进行了优化。本文介绍其中一个方案：基于 HTTP Chunk 的首屏数据渐进式预加载方案，该方案总体减少了单页应用 1.2s 的首屏呈现时间。同时对比其与同构渲染方案的异同。( https://parg.co/bQH )
+- [《Composing Software》](https://parg.co/bQY)：本系列文章由 Eric Elliott 大神发布，着眼于介绍 JavaScript 函数式编程与大型软件项目中的可组织性技术的介绍，包括了函数式编程导论、高阶函数、Reduce、Functors & Categories 等几个部分，还在持续更新中。( https://parg.co/bQY )
+- [《Redux 实践大讨论》](https://github.com/reactjs/redux/issues/2295)：此篇是 Markerikson 在 Redux Issue 中发起的讨论，主要涉及 Redux 模板冗余、过度抽象、学习曲线过于曲折、太多的 Opinioned 最佳实践等问题。( https://github.com/reactjs/redux/issues/2295 )
+
+## 开源项目
+
+`乐于分享，共推前端发展`
+
+- [《react-native-interactable》](https://github.com/wix/react-native-interactable)：react-native-interactable 是由 wix 发布的用于创建高性能用户交互效果的声明式接口。典型的用户场景包括滑动式卡片、抽屉菜单、伸缩式应用头、聊天头等。( https://github.com/wix/react-native-interactable )
+- [《awesome-github-vue》](https://github.com/opendigg/awesome-github-vue)：awesome-github-vue 是由 OpenDigg 整理并维护的 Vue 相关开源项目库集合。( https://github.com/opendigg/awesome-github-vue  )
+- [《react-overdrive》](https://github.com/berzniz/react-overdrive)：非常简单易用的 React 应用转场动画实现库，能够在不同的页面间指定相同 ID 的元素，Overdrive 会自动为这两个元素之间添加转场动画。( https://github.com/berzniz/react-overdrive )
+- [《Eagle.js》](https://github.com/zulko/eagle.js/)：Eagle.js 是基于 Vue.js 构建的创建 Web 中幻灯片的库，支持动画、主题、交互插件等常用功能。( https://github.com/zulko/eagle.js/ )
+- [《react-perimeter》](https://github.com/aweary/react-perimeter)：react-perimeter 能够为目标元素创建隐藏的栅栏，当用户的鼠标移动到目标元素的指定范围内时会触发预设时间，譬如可以执行组件预加载等操作。( https://github.com/aweary/react-perimeter )
+
+## 巅峰人生
+
+- [《六问CTO，程序员的个人、职业成长如何抉择？》](https://parg.co/bQp)：本文是声网 Agora.io CTO 陶思明对于程序员的自我成长、KPI 考核机制、技术管理与创业选择等相关问题进行的回答与分享。( https://parg.co/bQp)
+
+## 前端之巅
+
+「前端之巅」是InfoQ旗下关注前端技术的垂直社群，加入前端之巅学习群请关注「前端之巅」公众号后回复“加群”。投稿请发邮件到editors@cn.infoq.com，注明“前端之巅投稿”。
+
+![前端之巅微信底图－5.jpg](http://upload-images.jianshu.io/upload_images/1647496-01712a993d2b23de.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)