高质量前端资源-50weekly

[phpython8]

背景

随着大前端的兴起，前端技术日新月异，前端从业者也是越来越多。如何在浩瀚的互联网中，发现高质量的前端内容，成为了大多数前端学习者的困惑，也曾有这样的困惑。50weekly就是思考解决这一困惑的一种形式。

项目地址

https://github.com/ihtml5/50weekly

简介

50weekly，中文名 50 周。希望通过 50 周 500 篇高质量的前端文章，成就更优秀的自己，成为更优秀的前端工程师。目前由我和社区贡献者一起维护，每周五同步更新本周社区高质量前端资源。内容来源于 twitter 业界大牛的推荐，javascript weekly，nodejs weekly，react status，devto，hashnode, div.io等，本着少而精的原则收集关于前端各方面高质量的资源，内容涵盖以下几方面:

• react 生态包括 react, redux, react-router, react-native 等
• 小程序
• 移动 web
• 构建工具包括 webpack
• nodejs
• 设计模式
• 用户体验
• 性能优化

遴选原则

1. 大牛推荐
2. 社区广泛阅读
3. 新的区别于以往的库，设计模式
4. 深入浅出的教程

贡献指南

1. for 本项目
2. 发起 pr
3. issue 里推荐好的文章

相关转载

• 高质量前端资源
• 全面了解 react license

[phpython8]

欢迎 fork star 贡献

[phpython8]

50weekly 发现高质量前端资源 第十周内容已更新

### 项目地址
https://github.com/ihtml5/50weekly

### 第十周
+ [漫画：深入浅出 ES 模块]( https://zhuanlan.zhihu.com/p/36358695)
+ [前端性能监控方案 window.performance 调研]( https://www.cnblogs.com/sunshq/p/5312231.html)
+ [React patterns, techniques, tips and tricks ]( https://github.com/vasanthk/react-bits)
+ [Preload，Prefetch 和它们在 Chrome 之中的优先级]( http://www.w3cplus.com/performance/reloading/preload-prefetch-and-priorities-in-chrome.html?utm_source=tuicool&utm_medium=referral)
+ [深入剖析 JavaScript 的深复制]( http://jerryzou.com/posts/dive-into-deep-clone-in-javascript/)
+ [什么是函数式编程？]( http://www.lihaoyi.com/post/WhatsFunctionalProgrammingAllAbout.html)
+ [使用组件文件夹模式编写可扩展的 React 应用程序]( https://medium.com/styled-components/component-folder-pattern-ee42df37ec68)
+ [JavaScript 如何工作：引擎，运行时和调用堆栈的概述]( https://blog.sessionstack.com/how-does-javascript-actually-work-part-1-b0bacc073cf)
+ [API 设计原则]( https://coolshell.cn/articles/18024.html)
+ [使用 immutable 优化 React]( https://github.com/Pines-Cheng/blog/issues/13?hmsr=toutiao.io&utm_medium=toutiao.io&utm_source=toutiao.io)

[phpython8]

50weekly 发现高质量前端资源 第十一周内容已更新

### 项目地址
https://github.com/ihtml5/50weekly

### 第十一周[最新]
+ [使用 Render Prop 模式]( https://cdb.reacttraining.com/use-a-render-prop-50de598f11ce)
+ [React.js 小书]( http://huziketang.com/books/react/)
+ [我如何在两天内建立自己的 react - 以及为什么我做到了]( https://medium.com/[@ajmd17](/user/ajmd17)/how-i-built-my-own-react-in-two-days-and-why-i-did-it-969c3d048f78)
+ [ [译] React 及 React Fiber 基本的设计理念]( https://segmentfault.com/a/1190000009075692#articleHeader23)
+ [去哪儿网迷你 React 的研发心得]( https://segmentfault.com/a/1190000011235844)
+ [Webpack 基本架构浅析]( https://zhuanlan.zhihu.com/p/36445010)
+ [React 可拖动且可调整大小的网格布局，具有响应式断点]( https://github.com/STRML/react-grid-layout)
+ [advanced-react-patterns-v2]( https://github.com/kentcdodds/advanced-react-patterns-v2)
+ [React Suspense]( https://github.com/facebook/react/pull/12279#event-1621005314)
+ [Guess.js：使用数据改善用户体验的工具包]( https://github.com/guess-js/guess)

[phpython8]

### 项目地址
https://github.com/ihtml5/50weekly

### 第十二周[最新]

+ [调试现代 Web 应用程序]( https://hacks.mozilla.org/2018/05/debugging-modern-web-applications/)
+ [如何阅读大型前端开源项目的源码]( https://juejin.im/post/5afe3735518825426539afce)
+ [build your own x]( https://github.com/danistefanovic/build-your-own-x)
+ [前端 Leader 如何做好团队规划？阿里内部培训总结公开]( https://zhuanlan.zhihu.com/p/36911993)
+ [移动端前端开发调试]( http://yujiangshui.com/multidevice-frontend-debug/)

[phpython8]

### 第十六周 [最新]
1. [用导航和资源时机评估现实生活中的加载性能]( https://developers.google.com/web/fundamentals/performance/navigation-and-resource-timing/)
2. [没错，我就是要吹爆 Angular]( https://zhuanlan.zhihu.com/p/38430368)
3. [给 React 的 HOC 用上 TS 的类型推导]( https://zhuanlan.zhihu.com/p/38378730)
4. [react-final-form 针对 React 的高性能基于订阅的表单状态管理]( https://github.com/final-form/react-final-form)
5. [React 生命周期方法的实时可视化工具]( https://github.com/Oblosys/react-lifecycle-visualizer)
6. [React Native2018 年现状]( https://facebook.github.io/react-native/blog/2018/06/14/state-of-react-native-2018)
7. [React Profiler RFC]( https://github.com/reactjs/rfcs/pull/51)
8. [next-codemod]( https://github.com/zeit/next-codemod)
9. [我们应该使用 React Native 吗？]( https://blog.expo.io/should-we-use-react-native-1465d8b607ac)
10. [更好地理解 React 中的表单]( https://medium.com/javascript-inside/better-understanding-forms-in-react-a85d889773ce)

[phpython8]

### 第十七周 [最新]
1. [探索 ES2018 and ES2019]( http://exploringjs.com/es2018-es2019/toc.html)
2. [Material Component Framework for Vue.js 2]( https://github.com/vuetifyjs/vuetify)
3. [WePY-小程序框架设计]( https://zhuanlan.zhihu.com/p/29264211)
4. [A simple (99% ES2015 less) tutorial for React]( https://github.com/kay-is/react-from-zero)
5. [如何成为一名数据可视化工程师]( https://www.zhihu.com/question/49749071/answer/118840095)
6. [数据结构索引]( https://www.interviewcake.com/data-structures-reference)
7. [移动端跨平台开发的深度解析]( https://juejin.im/post/5b395eb96fb9a00e556123ef)
8. [使用 Tree shaking 减少 JavaScript 有效负载]( https://developers.google.com/web/fundamentals/performance/optimizing-javascript/tree-shaking/)