├── SUMMARY.md ├── zui-jia-shi-jian-yu-xiang-mu.md └── README.md /SUMMARY.md: -------------------------------------------------------------------------------- 1 | # Summary 2 | 3 | * [简介](README.md) 4 | 5 | -------------------------------------------------------------------------------- /zui-jia-shi-jian-yu-xiang-mu.md: -------------------------------------------------------------------------------- 1 | ### todomvc 各种MV* 前端框架实现的todolist 2 | https://github.com/tastejs/todomvc 3 | 4 | 对学习和理解各种技术很有帮助。 5 | 6 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Github优秀开源项目整理（每周更新） 2 | 3 | **所有项目整理到一张思维导图**： 4 | [http://chenhaoact.com/github-project-recommend.html](http://chenhaoact.com/github-project-recommend.html) 5 | 6 | **github项目地址（每周更新，欢迎star）**： 7 | [https://github.com/chenhaoact/github-project-recommend](https://github.com/chenhaoact/github-project-recommend) 8 | 9 | ## 写在前面 10 | 11 | 目前开源社区Github涌现出不少优秀的项目，关注和使用这些项目，一方面可以很好的提升开发效率与质量，另一方面研究开源项目的源码，参与其贡献，也是提升技术能力一个不错的方法。 12 | 13 | 基于自己团队的需求，以后每周会整理一些不错的Github开源项目（每周3-6个），范围主要包括：编程基础，前端开发，客户端开发，图形图像，网络，通用工具等，但不局限于此，一些服务端技术以及前沿技术（如：AI，AR，loT等）也可能会涉及到。相信多开阔眼界，方能看的更远！ 14 | 15 | 所有的项目都会第一时间整理到上面的[思维导图](http://chenhaoact.com/github-project-recommend.html)中，通过这种形式能够实时的跟踪每个项目的star数，在需要用的时候也可以快点检索和查找。 16 | 17 | ### **如果对你的工作或学习有所帮助，请到项目的[github](https://github.com/chenhaoact/github-project-recommend) star 支持一下哈，不胜感激！** 18 | 19 | 以下是以往各期收集的项目（**持续更新中...**）： 20 | 21 | ## 2018年 22 | 23 | 每周更新中... 24 | 25 | ### 第三期（2018-1-19） 26 | | 分类 | 项目名称与地址 | 项目简介 | star数 | 27 | | --- | --- | --- | --- | 28 | |动画特效|react-motion https://github.com/chenglou/react-motion|一个强大的react动画库。可以很容易的实现许多React组件的动画效果。它背后的思想是将 API 引用的内容作为 “Spring”，一个非常稳定的基础动画配置，在大多数情况下工作良好，同时也是可配置的。它不依赖于时间，所以当你想要取消／停止／撤销一个动画或在应用中使用可变维度的时候会更好用。|11660| 29 | |移动端测试|stf https://github.com/openstf/stf/|WEB端批量移动设备管理控制工具，直接通过浏览器控制多台智能手机，可用于产品兼容性测试。|6650| 30 | |编辑器|tui.editor https://github.com/nhnent/tui.editor|支持左右栏预览和wysiwyg模式的Markdown编辑器，能够轻松的通过拖拽与Markdown编辑器插入各种图表（如Excel中的表格，UML图等）。|4521| 31 | 32 | ### 第二期（2018-1-12） 33 | | 分类 | 项目名称与地址 | 项目简介 | star数 | 34 | | --- | --- | --- | --- | 35 | |React建站|Gatsby https://github.com/gatsbyjs/gatsby|Gatsby 是一个令人难以置信的静态站点生成器，它允许使用React作为渲染引擎引擎来快速搭建一个静态站点，通过在构建时通过服务器端渲染将动态的 React 组件呈现为静态 HTML 内容。这意味着用户可以获得静态站点的所有好处，比如不使用 JavaScript、搜索引擎友好性、非常快的加载速度等，也并没有失去现代 web 所期望的活力和交互性。一旦呈现为静态 HTML，客户端站点的 React 和 JavaScript 会接管它并添加动态的内容。 |17305| 36 | |设计工具|react-sketchapp https://github.com/airbnb/react-sketchapp|一个为设计系统量身定制的开源库。它通过将 React 元素渲染到 Sketch 来连接设计和开发之间的鸿沟。这个开源库给设计师们提供了一个全新的设计工作流程：在时下最流行的 React 前端框架下可以通过代码进行设计，并实时渲染到 Sketch 中审阅设计。在设计圈大红大紫的 Sketch 虽说占了此开源库的一半名字，但其实担当的只是一个浏览器的角色。真正留下的设计文档则成了代码。|10408| 37 | |python游戏外挂|python 微信《跳一跳》辅助https://github.com/wangshub/wechat_jump_game|2017 年 12 月 28 日下午，微信加入了「小游戏」功能，并提供了官方 DEMO「跳一跳」。这是一个 2.5D 插画风格的益智游戏，玩家可以通过按压屏幕时间的长短来控制这个「小人」跳跃的距离。分数越高，那么在好友排行榜更加靠前。此项目通过 Python 脚本自动运行，让你轻松霸榜。其中利用了图像识别精确测量出起始和目标点之间测距离，就可以估计按压的时间来精确跳跃。|12026| 38 | 39 | ### 第一期（2018-1-5） 40 | 41 | | 分类 | 项目名称与地址 | 项目简介 | star数 | 42 | | --- | --- | --- | --- | 43 | |前后端协同|realworld https://github.com/gothinkster/realworld|前端示例和后端代码库的集合和规范。提供了各种前端框架（如：React，Angular）与后端技术（如：Node.js，Django，Laravel）的最佳实践，技术栈很全，具有一定的参考价值。|11251| 44 | |Node.js|egg https://github.com/eggjs/egg/|为企业级应用而生的Node.js框架，特点如下：基于 Egg 定制上层框架的能力；高度可扩展的插件机制；内置多进程管理；基于 Koa 开发，性能优异；框架稳定，测试覆盖率高；渐进式开发。|6601| 45 | |React组件|react-content-loader https://github.com/danilowoz/react-content-loader|React应用中内容加载之前的占位动画，在页面完全加载出来之前，先显示大致轮廓的动画效果，而不是一片空白，从而提升产品的用户体验。|3386| 46 | 47 | 48 | ## 2017年 49 | 50 | ### 第十八期（2017-12-29） 51 | 52 | | 分类 | 项目名称与地址 | 项目简介 | 推荐理由 | star数 | 53 | | --- | --- | --- | --- | --- | 54 | |canvas|react-canvas https://github.com/Flipboard/react-canvas|React Canvas增加了React组件渲染到canvas而不是DOM的能力。它带来了Web开发人员熟悉的一些API，并将它们与高性能绘图引擎混合在一起。|与本地应用程序相比，移动Web应用程序感觉缓慢的原因是DOM。 CSS动画和过渡是在Web上实现平滑动画的最快途径，但它们有一些限制。 React Canvas利用现代移动浏览器拥有硬件加速画布的能力，更好的构建应用程序用户界面。事实上，它是对渲染到canvas上行为的具体实现。|10792| 55 | |UI布局|muuri https://github.com/haltu/muuri|Muuri 能够创建响应式，可排序，可过滤和可拖动的网格布局。其布局系统允许以多种方式将网格项目定位在容器内。|流布局是目前用于图像类布局的常见展示方式之一，Muuri很适合创建这种布局。它的特点是支持响应式、排序、筛选以及拖拽布局元素。能通过鼠标随意拖拽，支持左上、右上，左右两端对齐以及根据标题内容进行筛选，筛选时切换的的动画也非常流畅。|6188| 56 | |文件上传处理|uppy https://github.com/transloadit/uppy|一个全新的模块化的浏览器Web文件上传组件，可以与任何框架无缝集成。|它能从本地磁盘，Google Drive，Dropbox，远程URL，摄像机和其他地点获取文件，然后将其上传到最终目的地，支持拖拽和暂停上传。 快速，易于使用，让你能专注于比构建文件上传器更重要的问题。|4628| 57 | 58 | ### 第十七期（2017-12-22） 59 | 60 | | 分类 | 项目名称与地址 | 项目简介 | 推荐理由 | star数 | 61 | | --- | --- | --- | --- | --- | 62 | |组件开发与测试|storybook https://github.com/storybooks/storybook|React和React-Native UI组件的交互式开发和测试环境。|这款工具很适合在页面UI快速直观的展示控件的运行效果，测试不同的运行场景。|17123| 63 | |可视化分析|github-profile-summary https://github.com/tipsy/github-profile-summary|对Github主页进行可视化分析的工具。能够分析某个github用户关注项目，历史活跃度，贡献情况。|你可以用它来可视化分析自己的github使用数据，也可以了解他人的，但前提是分析的用户需要先关注这个项目。|12028| 64 | |文档管理|Docusaurus https://github.com/facebook/Docusaurus|Facebook开源的一套快速生成开源项目文档站点的项目，它把项目介绍页面，文档，博客，github关注数与跳转及搜索都做好了，如果你有一个开源项目想要做一个主页，它是一个很好的选择。|基于React构建，React Native，Prettier，jest等许多大型开源项目都在使用它。|2716| 65 | 66 | 67 | ### 第十六期（2017-12-15） 68 | 69 | | 分类 | 项目名称与地址 | 项目简介 | 推荐理由 | star数 | 70 | | --- | --- | --- | --- | --- | 71 | |前端工程化 |rollup https://github.com/rollup/rollup|Rollup 是一个 JavaScript 模块打包器，可以将小块代码编译成大块复杂的代码，例如 library 或应用程序。它对代码模块使用新的标准化格式，这些标准都包含在 Js 的 ES6 版本中，而不是以前的特殊解决方案，如 CommonJS 和 AMD。可以使你自由、无缝地使用你最喜爱的 library 中那些最有用的独立函数，而你的项目不必携带其他未使用的代码。|它被称为下一代的模块打包工具，采用shaking tree的技术，利用es6模块能静态分析语法树的特性，只将需要的代码提取出来打包，能大大减小代码体积。面对其竞争，webpack也增加了类似的功能。|11140| 72 | |学习资源|learn-anything https://github.com/learn-anything/learn-anything|learn-anything是由社区建立的开源网站，它提供学习任何知识技能的交互式地图，通过其提供的学习路径与资源，能够很快的掌握一项技能。|学习新技能的好方法，同时项目本身的交互也很值得参考。|9400| 73 | |机器学习|keras-js https://github.com/transcranial/keras-js|本项目可以让你使用 WebGL 在 GPU 驱动的、浏览器上运行训练好的 Keras 模型。它能将深度学习完成的网络放进js。|打开机器学习，图像识别大门最简答的方法之一。通过几十行简单的代码，就可以实现文字，图像识别的demo。|3313| 74 | 75 | 76 | ### 第十五期（2017-12-8） 77 | 78 | | 分类 | 项目名称与地址 | 项目简介 | 推荐理由 | star数 | 79 | | --- | --- | --- | --- | --- | 80 | |代码格式化|Prettier https://github.com/prettier/prettier|Prettier是一个代码格式化程序。支持很多种语言，如：JavaScript、JSX、Flow、TypeScript、CSS、LESS、SCSS等。它的一大特点就是能够支持命令行、API 等多种形式调用，可以让团队保持代码风格一致。|使用Prettier有很多益处：几乎不需要做决定，因为 Prettier的配置选项很少；团队成员不需要为规则去争论；开源代码开发者不需要去学习项目的代码风格；不需要去修复ESLint报告的风格问题；保存文件的时候可以自动统一风格。包括 React 和Babel在内的很多著名项目已经开始使用了，所以，你也值得拥有。|17779| 81 | |前端工程化|Parcel https://github.com/parcel-bundler/parcel|Parcel 是一款极速、零配置的 Web 应用打包工具，支持：极速打包 - 多核心编译，以及即使在重启后也能快速重建的文件系统缓存。无需安装插件，开箱即用，支持 JS、CSS、HTML、file assets 等。在有需要时自动转换成 Babel、PostCSS 和 PostHTML 模块 - 甚至是 node_modules。代码零配置，使用动态 import（）语句分割。内置热模块替换。|前端领域已经有了webpack这样一个强大的工具，但它并非就十全十美，Parcel就针对webpack的不足做了很多文章，它的构建速度非常快，使用cache后几乎能比webpack快8倍，同时它支持零配置，在项目中开箱即用，不像webpack那样需要各种配置项。在GitHub开源，一周内就得到了7200多个star，未来绝对不容忽视的前端工程化技术。|7268| 82 | |接口模拟|json-server https://github.com/typicode/json-server|Json-Server是一个本地数据接口模拟神器，基于REST API，配合使用Proxy，效率极其高。它可以在30s内让你建立一套完整的REST API。|它足够简单，写少量数据，即可使用。也足够强大，支持CORS和JSONP跨域请求，支持GET, POST, PUT, PATCH 和 DELETE 方法，更提供了一系列的查询方法，如limit，order等。|27310| 83 | 84 | ### 第十四期（2017-12-1） 85 | 86 | | 分类 | 项目名称与地址 | 项目简介 | 推荐理由 | star数 | 87 | | --- | --- | --- | --- | --- | 88 | |响应式编程|RxJS https://github.com/ReactiveX/RxJS|RxJS 是使用 Observables 的响应式编程的库，它使编写异步或基于回调的代码更容易。这个项目是 Reactive-Extensions/RxJS(RxJS 4) 的重写，具有更好的性能、更好的模块性、更好的可调试调用堆栈，同时保持大部分向后兼容，只有一些破坏性的变更(breaking changes)是为了减少外层的 API 。|使用RxJS，可以达到以下目的：同步与异步的统一；获取和订阅的统一；现在与未来的统一；可组合的数据变更过程；数据与视图的精确绑定；条件变更之后的自动重新计算|9507| 89 | |数据可视化|g2 https://github.com/antvis/g2|G2 是一套基于可视化编码的图形语法，以数据驱动，具有高度的易用性和扩展性，用户无需关注各种繁琐的实现细节，一条语句即可构建出各种各样的可交互的统计图表。2017年11月22日，G2 3.0 来了，一个“数据驱动的高交互图形语法”新生绽放，并且从这个版本起，G2 将以 MIT 协议正式对外开源。|G2是图形语法在前端工程上的一个实现。它提供了强大的语义化图表生成能力，使得用户（开发者）可以通过简单的语法组合即可搭建出各种各样的图表。|3531| 90 | |PWA|第一本 PWA 中文书 https://github.com/SangKa/PWA-Book-CN|《Progressive Web Apps》是 Manning 出版社发行的一本很不错的PWA 主题的书，到目前为止，市场上关于 PWA 的好书也是屈指可数。这个项目是该书的中文翻译版本，已经在github上开源。|目前 PWA 相关的学习资料十分有限，中文的就更少了，给想去了解 PWA 的开发者带来了一定的困扰。作者利用业余时间翻译了此书，对PWA学习很有帮助。|1657| 91 | 92 | ### 第十三期（2017-11-24） 93 | 94 | | 分类 | 项目名称与地址 | 项目简介 | 推荐理由 | star数 | 95 | | --- | --- | --- | --- | --- | 96 | |JS运行时环境| napajs https://github.com/Microsoft/napajs|Napa.js是一个基于V8的多线程JavaScript运行时环境，它起初被设计用于在Bing中开发不影响性能的高度迭代服务。随着开发的深入，微软的工程师发现Napa.js能有效补足Node.js在CPU-bound任务上的不足，而且拥有在多个V8隔离中执行JavaScript代码并进行相互通信的能力。虽然Napa.js是Node.js的一个模块，但是它也能嵌入没有Node.js依赖的主机进程中。|多线程JavaScript运行时环境；Node.js兼容的模块，支持NPM；JavaScript线程间的对象传递、对象共享和同步接口；可插拔的日志、标准和内存分配接口；作为一个Node.js的模块部署，支持脚本嵌入。|7133| 97 | |时间类库|date-fns https://github.com/date-fns/date-fns|轻量级的 JavaScript 日期库。提供了最全面，简单和一致的工具集，用于在浏览器和 Node.js 中操纵 JavaScript 日期。|非常好的解决了纯 JS 操作时间极其复杂的问题。|7832| 98 | |PWA|react-pwa https://github.com/Atyantik/react-pwa|一个可拓展的、最佳实践的 PWA 基础库（对提升react应用的性能和体验很有帮助）。|支持 React & Redux SSR，良好的 SEO 策略与页面加载速度。|1001| 99 | 100 | ### 第十二期（2017-11-17） 101 | 102 | | 分类 | 项目名称与地址 | 项目简介 | 推荐理由 | star数 | 103 | | --- | --- | --- | --- | --- | 104 | |网络请求|axios https://github.com/axios/axios|一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端。它支持如下特性：从浏览器中创建 XMLHttpRequest；从 node.js 发出 http 请求；支持Promise API；拦截请求和响应；转换请求和响应数据；取消请求；自动转换JSON数据；客户端支持防止 CSRF/XSRF；|vuejs 作者尤雨溪之前发布过消息，不再继续维护vue-resource，并推荐大家使用 axios。目前axios 被越来越多的人所了解和使用，它功能强大，api设计的也比较好，代表一种较新的网络请求模式。|30650| 105 | |数据图表|charts https://github.com/frappe/charts|简单，响应式，无任何依赖的现代SVG图标库，纯ES6+CSS写的项目，不依赖任何框架的项目典范。同时图表组件使用简单，样式也很漂亮。|零依赖，使用简单且效果美观的图表组件库。|8670| 106 | |动画特效| lottie-web https://github.com/airbnb/lottie-web|Airbnb开源的动画库，它能够同时支持iOS，Android与ReactNative的开发，让美工在AE软件上设计的动画直接用于移动客户端与网页。|它的出现极大地解放了客户端/前端工程师编写原生自定义动画的工作。相关的另外两个开源库lottie-android和lottie-ios都已经收获了过万的star。|8633| 107 | 108 | 109 | ### 第十一期（2017-11-3） 110 | 111 | | 分类 | 项目名称与地址 | 项目简介 | 推荐理由 | star数 | 112 | | --- | --- | --- | --- | --- | 113 | |PWA|workbox https://github.com/GoogleChrome/workbox|Workboxjs Chrome官方团队推出的用来降低 PWA 开发成本的技术。|2017 Chrome Dev Summit 10月23号在在美国旧金山举行，大会的主题依旧是PWA（Progressive Web APP，渐进式Web应用），从2017年从始至今，在 Google I／O、GDD到各种 Conf上，PWA一直被强调。|Workboxjs 作为官方技术，一定程度上代表着未来PWA开发的趋势。|3340| 114 | |中后台应用搭建|ant-design-pro https://github.com/ant-design/ant-design-pro|由Ant Design出品的开箱即用的中台前端/设计解决方案。优雅美观：基于 Ant Design 体系精心设计；常见设计模式：提炼自中后台应用的典型页面和场景；响应式：针对不同屏幕大小设计；主题：可配置的主题满足多样化的品牌诉求；国际化：内建业界通用的国际化方案；Mock 数据：实用的本地数据调试方案；UI 测试：自动化测试保障前端产品质量；|2366| 115 | |离线存储|pouchdb https://github.com/pouchdb/pouchdb|PouchDB是受 Apache CouchDB启发为Web设计的一款占用空间少的数据库。它尤其适合于需要基于浏览器的可离线使用的存储方案的移动应用。|离线或“在云中”工作的应用都将面临可靠的数据同步的问题，它们都可能会用到PouchDB。|9653| 116 | 117 | 118 | ### 第十期（2017-10-27） 119 | 120 | | 分类 | 项目名称与地址 | 项目简介 | 推荐理由 | star数 | 121 | | --- | --- | --- | --- | --- | 122 | |React组件|awesome-react-components https://github.com/brillout/awesome-react-components|一个React 组件/库集合，awesome系列之一。|收集了很多的React组件项目，对开发复杂交互的React项目会很有帮助。|10486| 123 | |React组件|react-virtualized https://github.com/bvaughn/react-virtualized|用于高效地呈现大型的列表（包括瀑布流等）和表格数据的React组件。|开发中经常需要实现能无限滚动的长列表，使用这个库将使得长列表加载具有更好的性能，因为它能够动态的渲染需要呈现的部分，并删掉不需要展示的dom。|7491| 124 | |数据图表|recharts https://github.com/recharts/recharts|使用React和D3构建的重新定义的图表库。|简单易用的React图表库，原生的SVG支持，声明式的组件。|6980| 125 | 126 | 127 | ### 第九期（2017-10-20） 128 | 129 | | 分类 | 项目名称与地址 | 项目简介 | 推荐理由 | star数 | 130 | | --- | --- | --- | --- | --- | 131 | | js函数式编程 | ramda [https://github.com/ramda/ramda](https://github.com/ramda/ramda) | 一款实用的 JavaScript 函数式编程库。强调更加纯粹的函数式风格。Ramda的函数本身都是自动柯里化的。其参数的排列顺序更便于柯里化。 | 目前已经存在许多优秀的函数式的库（如underscore,Lodash）。相比而言，Ramda 的目标更为专注：专门为函数式编程风格而设计，更容易创建函数式 pipeline、且从不改变用户已有数据。 | 9758 | 132 | | React与electron最佳实践 | nylas-mail [https://github.com/nylas/nylas-mail](https://github.com/nylas/nylas-mail) | 一款用现代web技术搭建的可扩展的开源电子邮件客户端。 | 是React和electron等技术搭建的大型跨平台桌面客户端项目，无论是从技术还是架构都值得去学习和借鉴。 | 23563 | 133 | | 前端包管理 | lerna [https://github.com/lerna/lerna](https://github.com/lerna/lerna) | 用于管理具有多个包的JavaScript项目的工具。 | 将大型代码库拆分为独立的独立版本包对于代码共享非常有用。 然而，在许多存储库中进行更改是麻烦和难以跟踪的事情。lerna就是为了解决这些问题，它能让项目将它们的代码库组织成多包存储库。 | 6324 | 134 | 135 | ### 第八期（2017-10-13） 136 | 137 | | 分类 | 项目名称与地址 | 项目简介 | 推荐理由 | star数 | 138 | | --- | --- | --- | --- | --- | 139 | | UI框架 | bulma [https://github.com/jgthms/bulma](https://github.com/jgthms/bulma) | 基于Flexbox的现代CSS框架 | 响应式，专门为移动端而设计；组件纯CSS实现，无js依赖；模块化，按需引入。 | 20085 | 140 | | 动画 | anime.js [https://github.com/juliangarnier/anime](https://github.com/juliangarnier/anime) | 一个优秀的JavaScript动画引擎，可以和CSS3属性，SVG，DOM元素和JS对象一起工作，制作出各种高性能，平滑过渡的动画效果。 | 相比于其他的很多动画库，anime要更灵活而轻量一些，无论是从使用还是性能角度。 | 15480 | 141 | | 图像语言识别 | tesseract.js [https://github.com/naptha/tesseract.js](https://github.com/naptha/tesseract.js) | 纯Javascript实现的OCR支持62种语言，是流行Tesseract OCR引擎的一个JS移植。 | 能很快的对图像文件进行分析识别处理，获取到语言文字信息，图像转字符数据的利器。 | 12342 | 142 | 143 | ### 第七期（2017-09-30） 144 | 145 | | 分类 | 项目名称与地址 | 项目简介 | 推荐理由 | star数 | 146 | | --- | --- | --- | --- | --- | 147 | | 拖拽效果实现 | draggable [https://github.com/Shopify/draggable](https://github.com/Shopify/draggable) | 一个轻量级，响应式的现代JavaScript拖放\(Drag & Drop\)库 | 比较新的拖拽效果库，对ES6很友好，同时支持排序，插拔等效果，API比较强大 | 7117 | 148 | | Vue最佳实践 | vue2-elm [https://github.com/bailicangdu/vue2-elm](https://github.com/bailicangdu/vue2-elm) | 基于 vue2 + vuex + vue-router2 + fetch 构建一个具有 45 个页面的大型单页应用（饿了么移动端应用） | Vue2构建的大型应用，对Vue开发很有参考价值 | 12080 | 149 | | js基础 | You-Dont-Need-jQuery [https://github.com/nefe/You-Dont-Need-jQuery](https://github.com/nefe/You-Dont-Need-jQuery) | 前端发展很快，现代浏览器原生 API 已经足够好用。我们并不需要为了操作 DOM、Event 等再学习一下 jQuery 的 API。同时由于 React、Angular、Vue 等框架的流行，直接操作 DOM 不再是好的模式，jQuery 使用场景大大减少。本项目总结了大部分 jQuery API 如何用原生 js 实现。 | 整理了各种用原生js实现 jQuery API的写法，有助于提生原生js的掌握程度，巩固基础，同时也可以减少项目对jQuery的依赖。 | 12239 | 150 | 151 | ### 第六期（2017-09-22） 152 | 153 | | 分类 | 项目名称与地址 | 项目简介 | 推荐理由 | star数 | 154 | | --- | --- | --- | --- | --- | 155 | | 文件处理 | js-xlsx [https://github.com/SheetJS/js-xlsx](https://github.com/SheetJS/js-xlsx) | 纯JS实现读写各种电子表格文件的类库。 | 让开发者能直接在浏览器端处理表格数据，减少对服务端和网络的压力。 | 7401 | 156 | | 性能优化 | electron-webpack-dashboard [https://github.com/FormidableLabs/electron-webpack-dashboard](https://github.com/FormidableLabs/electron-webpack-dashboard) | 采用Electron开发的Webpack桌面GUI管理控制台，通过它能够可视化的查看项目中webpack的打包，构建，依赖等相关数据。 | 对性能优化很有帮助，同时它也是Electron技术的最佳实践之一。 | 2226 | 157 | | 人工智能 | hubot [https://github.com/hubotio/hubot](https://github.com/hubotio/hubot) | Hubot 是 GitHub 团队开源的一款聊天机器人技术，原目的是帮助 GitHub 员工更好的管理他们的软件。直到大家为这个机器人发掘了更多强大和好玩的用途。它能为团队内的任一成员服务，自动处理各种复杂的任务。 | 一种 ChatOps 式的技术，Hubot 可以用来记录和帮助公司所发生的几乎一切。它常被戏称为 GitHub 最勤奋的「员工」，因为它始终尽职尽责勤勤勉勉，并且作为团队的「一员」，如果你愿意，它会永远在线。 | 13227 | 158 | 159 | ### 第五期（2017-09-15） 160 | 161 | | 分类 | 项目名称与地址 | 项目简介 | 推荐理由 | star数 | 162 | | --- | --- | --- | --- | --- | 163 | | 文件处理 | jsPDF [https://github.com/MrRio/jsPDF](https://github.com/MrRio/jsPDF) | 领先的浏览器端PDF解决方案，支持不同类型的PDF文件格式，包括：文本，数字，图形，图片，同时可以自由的编辑PDF中的标题或其它类型元素。 | 曾经生成PDF是服务端代码的专利，而通过jsPDF则能够用前端脚本生成和控制PDF文件 | 8950 | 164 | | 服务端技术 | serverless [https://github.com/serverless/serverless](https://github.com/serverless/serverless) | Serverless Framework是无服务器应用框架和生态系统，旨在简化开发和部署服务端应用程序的工作。它作为Node.js NPM模块提供，填补了AWS Lambda等服务端技术存在的许多缺口。同时提供多个样本模板，可以迅速启动AWS Lambda，Azure, Google Cloud等服务进行开发。 | 通过这项技术能快速的部署服务端架构，让开发者能更专注于应用本身。比起微服务、DevOps，Serverless的落地可能更快。 | 19098 | 165 | | 图像识别 | tracking.js [https://github.com/eduardolundgren/tracking.js/](https://github.com/eduardolundgren/tracking.js/) | tracking.js 是一款js封装的图像处理的库，为浏览器带来丰富的计算视觉相关的算法和技术，通过它可以实现颜色追踪、人脸检测等功能 | 通过它能很容易的在浏览器上使用计算机视觉技术，实现人脸识别等功能 | 5498 | 166 | 167 | ### 第四期（2017-09-08） 168 | 169 | | 分类 | 项目名称与地址 | 项目简介 | 推荐理由 | star数 | 170 | | --- | --- | --- | --- | --- | 171 | | 编程学习 | free-programming-books-zh\_CN [https://github.com/justjavac/free-programming-books-zh\_CN](https://github.com/justjavac/free-programming-books-zh_CN) | 一份免费的编程书籍（中文版）索引，涵盖了计算机基础，各大编程语言，操作系统，编译，图形学，数据库，项目管理，设计模式，Web等各个领域的优秀书籍资源，并收录了一些读书笔记 | 非常全的一份编程开发的书籍清单，而且都有在线阅读的资源，很值得收藏和学习 | 21760 | 172 | | 数据查询语言 | graphql [https://github.com/graphql/graphql-js](https://github.com/graphql/graphql-js) | GraphQL是一套数据查询语言规范，由 Facebook在2012年开发，2015年开源，Facebook 内部已经广泛应用，用于替代 REST。graphql-js是Facebook官方对于js的GraphQL的一种实现 | 与REST相比，GraphQL定义了更严格、可扩展、可维护的数据查询方式，是未来前后端协同的一个方向 | 7767 | 173 | | 命令行工具开发 | Inquirer.js [https://github.com/SBoudrias/Inquirer.js/](https://github.com/SBoudrias/Inquirer.js/) | 常见的交互式命令行接口的集合，它能够很容易的提供错误回调，询问操作者问题，获取并解析用户输入，检测用户回答是否合法，管理多层级的提示等 | 一些有名的命令行脚手架工具，如：vue官方脚手架vue-cli和yeoman脚手架yo都有用到Inquirer.js | 5016 | 174 | | 虚拟现实 | react-vr [https://github.com/facebook/react-vr](https://github.com/facebook/react-vr) | 面向 VR 的React开发框架，内部通过包装流行的JS 3D引擎Three.js实现。通过WebGL将VR应用展现到网页上，同时也支持Oculus Rift，三星GearVR等VR设备。 | 相比于其他的VR技术，react-vr 在React的无缝集成上占有优势，为具备React基础的开发者减少了学习成本，同时也能充分的利用React的能力与其繁荣的生态 | 4859 | 175 | 176 | ### 第三期（2017-09-01） 177 | 178 | | 分类 | 项目名称与地址 | 项目简介 | 推荐理由 | star数 | 179 | | --- | --- | --- | --- | --- | 180 | | 数据图表 | Chart.js [https://github.com/chartjs/Chart.js](https://github.com/chartjs/Chart.js) | Chart.js是一个简单、面向对象、为设计者和开发者准备的图表绘制工具库。使用 `` 标签实现简洁的HTML5图表。 | 支持所有现代浏览器，并针对IE7/8提供了降级替代方案。简单、灵活，不依赖任何外部工具库，轻量（压缩后仅有4.5k） | 32037 | 181 | | 移动端开发 | VasSonic [https://github.com/Tencent/VasSonic](https://github.com/Tencent/VasSonic) | VasSonic是一个轻量级、高性能的Hybrid框架，专注于提升页面首屏加载速度，支持静态直出和动态直出页面，兼容离线包等方案。由腾讯团队开源，目前已广泛应用于手Q等内部应用。 | 该框架能做到智能地对页面内容进行动态缓存和增量更新，减少对网络的依赖和数据传输的大小，大大提升H5页面的加载速度，让H5页面的体验更加接近原生，提升用户体验及用户留存率 | 5173 | 182 | | 视频播放器 | video.js [https://github.com/videojs/video.js](https://github.com/videojs/video.js) | Video.js是一个基于HTML5的网络视频播放器。 它支持HTML5和其他视频格式。 台式机和移动设备上的视频播放都有很好的兼容性。 | 该项目已被超过40万个网站使用，是目前最流行的H5视频播放器技术之一 | 17463 | 183 | | 浏览器 | puppeteer [https://github.com/GoogleChrome/puppeteer](https://github.com/GoogleChrome/puppeteer) | Puppeteer是一个node库，它提供一组用来操纵Chrome的API（默认是headless即无UI的chrome，也可配置为有UI） 有点类似于PhantomJS，由Chrome官方团队进行维护 | 使用Puppeteer，相当于同时具有操作系统和Chrome的能力，应用场景会非常多。就爬虫领域来说，远比一般的爬虫工具功能更丰富。也能很好的应用在性能分析、自动化测试等其他领域 | 12233 | 184 | 185 | ### 第二期（2017-08-25） 186 | 187 | | 分类 | 项目名称与地址 | 项目简介 | 推荐理由 | star数 | 188 | | --- | --- | --- | --- | --- | 189 | | 动画效果 | 产品使用分步引导动画效果库：Intro.js [https://github.com/usablica/intro.js](https://github.com/usablica/intro.js) | 为网站和项目提供分步指导新功能介绍的好方法 | 不错的使用分步引导效果实现方案，帮助用户更容易的上手产品新功能 | 15674 | 190 | | 通用工具 | 可视化html编辑器 ORY Editor [https://github.com/ory/editor](https://github.com/ory/editor) | 一个高度可定制的HTML内容编辑器，基于 Slate.js, React和Redux开发 | 可拖拽的编辑操作体验，对移动端很友好 | 5815 | 191 | | 性能优化 | PWA相关：Lighthouse [https://github.com/GoogleChrome/lighthouse](https://github.com/GoogleChrome/lighthouse) | 一个自动化工具，用于改进网络应用的质量。提供一个要审查的网址，它将针对此页面运行一连串的测试，生成一个有关页面性能的报告。Lighthouse 目前非常关注 PWA 功能，如“添加到主屏幕”和离线支持，以针对网络应用质量的各个方面提供端到端审查。 | PWA技术的最佳实践项目之一；对提升页面性能很有帮助。 | 10224 | 192 | | 客户端开发 | yoga [https://github.com/facebook/yoga](https://github.com/facebook/yoga) | 一个客户端开发的跨平台布局引擎，由facebook开源。支持 android，ios等平台，允许使用开发者最熟悉的语言进行布局开发，如java，C\#，Objective-C，C等。同时也支持React Native开发。 | 客户端布局开发利器，支持多个平台和语言。 | 8207 | 193 | | 增强现实 | AR.js [https://github.com/jeromeetienne/AR.js](https://github.com/jeromeetienne/AR.js) | 基于web提供增强现实的解决方案，它非常快，在手机上运行也可以达到60fps。完整的基于three.js+jsartoolkit5，适用于任何手机上的WebGL和WebRTC技术。 | WebAR技术的一种实现方案，能很快的实现性能不错的AR交互。 | 4279 | 194 | 195 | ### 第一期 （2017-08-18） 196 | 197 | | 分类 | 项目名称与地址 | 项目简介 | 推荐理由 | star数 | 198 | | --- | --- | --- | --- | --- | 199 | | 性能优化 | React服务端渲染 next.js [https://github.com/zeit/next.js/](https://github.com/zeit/next.js/) | 一个轻量的提供React应用服务器端渲染的框架，支持自动代码拆分等特性。 | 能很好的提升页面加载与渲染速度。 | 16334 | 200 | | 编程基础 | learn-regex [https://github.com/zeeshanu/learn-regex](https://github.com/zeeshanu/learn-regex) | 帮助开发者更容易的学习正则表达式。 | 其中提供了一个快速检测（各种语言）正则表达式匹配的网站：[https://regex101.com/](https://regex101.com/) 使用起来很方便 | 10559 | 201 | | 通用工具 | RAP [https://github.com/thx/RAP](https://github.com/thx/RAP) | Web接口管理工具，开源免费，接口自动化，MOCK数据自动生成，自动化测试，企业级管理。阿里妈妈MUX团队出品。 | 数据接口模拟，管理，自动化测试神器。 | 5889 | 202 | | 客户端开发 | Electron [https://github.com/electron/electron](https://github.com/electron/electron) | GitHub开发的一个开源框架，它使用Node.js和Chromium，能通过html，css，js等技术完成跨平台桌面应用的开发。 | 目前有很多知名的桌面客户端应用都在使用electron进行开发，如：slack，vscode等 | 49258 | 203 | | 网络安全 | Awesome-Hacking [https://github.com/Hack-with-Github/Awesome-Hacking](https://github.com/Hack-with-Github/Awesome-Hacking) | 最近比较火的一个Awesome系列，收集了hack，安全研究方面的一些技术与学习资料，包括 Web，服务端，Android，ios，物联网等各种安全领域的资源。 | 很全的安全攻防资源整理，各个领域的开发者都能从中得到收获。 | 15979 | 204 | | 人工智能 | deeplearn.js [https://github.com/PAIR-code/deeplearnjs](https://github.com/PAIR-code/deeplearnjs) | 浏览器端机器智能框架，由 Google开发，是一款基于硬件加速的开源 JavaScript 库，可被用在机器智能领域。 | 该库将高性能的机器学习构建模块引入到 web 开发领域。 | 2291 | 205 | 206 | **（注：文中项目star数以整理当天为准）** 207 | 208 | --------------------------------------------------------------------------------