2017年11月github上值得关注的开源项目

这里面图片有的上传会失败，为了良好的阅读体验，移步到本人的github地址查看原文

数据图表相关

1. charts -- 简单，响应迅速，具有零依赖关系的现代SVG图表

   【官网】

2. tikzcd-editor -- 用于创建可交换图的简单可视化编辑器。

   【Demo】

   [图片上传失败...(image-4ff1d0-1512007372709)]

3. wasm-particles -- 这是一个视觉基准，每个粒子从WebAssembly更新，然后用WebGL绘制到屏幕上。

   demo

4. Wade -- 超级快的1kb搜索

5. lottie-web -- 分析Adobe After Effects动画与Bodymovin一起导出为json，并在移动设备上原生呈现

6. luxon -- 在JS中使用日期和时间的库

   官网

7. date-fns -- 现代JavaScript日期实用程序库

8. g2 -- 支付宝推出的简易图表生成工具G2
   demo

9. imaskjs -- vanilla js 输入掩码

   示例

UI相关

1. minui -- 基于规范的小程序 UI 组件库，支持自定义标签组件，轻量、易用、工具化

2. cube-ui -- 一个梦幻般的移动UI lib由Vue执行

   示例

3. scrollama -- 用IntersectionObserver滚动查询

   demo

影像处理

1. chimee -- 一个视频播放器旨在为浏览器带来美妙的体验

   【官网】

2. voxelengine3 -- Javascript中的体素引擎

   【Demo】

3. fieldplay -- 矢量字段浏览器。用WebGL制作，爱与激情。这个超酷

   【Demo】

4. UPNG.js -- 快速和先进的PNG（APNG）解码器和编码器

   示例

5. animateplus -- 是一个专注于性能和创作灵活性的JavaScript动画库。它的目标是提供稳定的60 FPS，重量小于2 KB（缩小和压缩），使其特别适合移动设备。

   官方demo

React 相关

1. react-pwa -- 具有通用路由（服务器端渲染）与React＆Redux的渐进式Web应用程序，内置SEO，实现最大页面速度

2. storybook -- React，React-Native，Vue UI组件的交互式开发和测试环境

3. react-konva -- 使用React绘制复杂画布图形的JavaScript库

4. react-chartkick -- 用一行React创建漂亮的图表再也不用配各种插件啦！

   demos

5. react-select -- 使用React JS构建的Select控件

   示例

6. react-swipeable-views -- 可滑动视图的React组件。

   示例

7. ReactPrimer -- React组件原型工具，生成关联的类组件代码。
   我觉得这是个神器，react党一定要下一个玩玩
   [图片上传失败...(image-b45988-1512007372709)]

8. react-aux -- 一个用于渲染多个元素的自我消除组件

   react v16之前，从一个组件中返回多个元素以将它们包装在一个辅助元素中

   const Root = () => {
     return <div>
       <p>Hello, World!</p>
       <p>I am a demo for react-aux.</p>
     </div>;
   };
   

   产生如下的dom

   <div>
     <p>Hello, World!</p>
     <p>I am a demo for react-aux.</p>
   </div>
   

   使用react-aux

   const Aux = (props) => {
     return props.children;
   };
   
   const Root = () => {
     return <Aux>
       <p>Hello, World!</p>
       <p>I am a demo for react-aux.</p>
     </Aux>;
   };
   

   后者生成没有包装节点的段落元素：

   <p>Hello, World!</p>
   <p>I am a demo for react-aux.</p>
   

架构相关

1. yapi -- YApi 是一个可本地部署的、打通前后端及QA的、可视化的接口管理平台

   官网

2. json-server -- 在30秒内得到一个完整的虚拟REST API

3. Front-End-Checklist -- 现代网站和一丝不苟的开发人员的完美的前端清单
   用这个清单来检查你的项目吧~

4. razzle -- 无需配置即可创建服务器渲染的通用JavaScript应用程序神器！不用解释！

5. purgecss -- 删除未使用的CSS在gulp、webpack中都可配置！

Vue相关

1. tiny-vue -- 缩小版的vue这是作者用来学习vue1.0.28源码，写出来的精简版，同时也包含他在创作过程中的博客。

Node相关

1. bottender -- 用你自己的方式快速、灵活的创建机器人

2. server -- 简单而强大的Node.js服务器

   【官网】

3. remoteStorage.js -- 将用户数据本地存储在浏览器中，以及连接到远程存储服务器并跨设备和应用程序同步数据。

4. emittery -- 简单和现代的异步事件发射器

博客

1. FE-Interview -- 前端面试题大合集——小菜鸟前端面试大作战
2. git-tips -- Git的奇技淫巧(中文)
3. Functional-Light-JS -- 轻量函数式js编程

第三方api

1. instagram-proxy-api -- CORS兼容的API来访问Instagram的公共数据

funny stuff

1. client -- 最小的聊天客户端库

   【官网】

2. js-code-to-svg-flowchart -- 一个将任何JavaScript代码转换成漂亮的SVG流程图的可视化库。学习其他的代码。设计你的代码。重构代码。文档代码。解释代码。

   [图片上传失败...(image-63c612-1512007372709)]

3. chalktalk -- 使用类似黑板的界面，演示者可以创建动画数字草图并与其进行交互，以便在现场演示或对话中展示想法和概念。

   [图片上传失败...(image-a01b37-1512007372709)]

4. nba-go -- 最好的NBA CLI。这个究极酷，虽然看不了实况但可以随时追踪比分，很酷！！

   demo

5. Sudachi -- 日常个人计划的时间表编辑器。 这个目前只支持macOS
   

   demo
   下载地址

6. cs-playground-react -- 用JavaScript实现常用排序算法和数据结构的交互式概述这个超赞的，作者把原理和算法的代码都放到了项目中，点击演示地址进行操作