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

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

数据图表相关

  1. superstruct —
    一个简单和可组合的方式来验证Javascript中的数据

  2. lowdb —
    lowdb是一个由Lodash支持的小型本地JSON数据库(支持Node,Electron和浏览器)

  3. inmap — inMap
    是一款基于百度地图的大数据可视化库,专注于大数据方向的散点、热力图、网格、聚合等方式;让大数据可视化变得简单易用。

    官网

    蜂窝聚合的demo

数据图表相关

  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
    输入掩码

    示例

文件处理

  1. uppy —
    下一个用于Web浏览器的开源文件上传器

    [图片上传失败…(image-a5edf1-1514857613721)]

UI相关

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

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

    示例

  3. scrollama —
    用IntersectionObserver滚动查询

    demo

动画相关

  1. popmotion —
    JavaScript动作引擎。创建独特的动画和补间,物理和输入跟踪交互。

    查看官网

影像处理

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

    【官网】

  2. voxelengine3 —
    Javascript中的体素引擎

    【Demo】

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

    【Demo】

  4. UPNG.js —
    快速和先进的PNG(APNG)解码器和编码器

    示例

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

    官方demo

UI相关

  1. muuri —
    响应式,可排序,可过滤和可拖动的网格布局
    muuri最大的特点是可拖动,优秀的示例请查看
    官网

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>
    

React相关

  1. react-show —
    React的无依赖显示/隐藏组件。

    demo

  2. react-perf-devtool —
    Chrome扩展程序,用于检查React组件的性能

  3. react-sketchapp —
    渲染React组件到Sketch

  4. beidou —
    服务器呈现的React应用程序的同构框架
    阿里出品—-必属呃呃呃。。。

架构相关

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

    官网

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

  3. Front-End-Checklist —
    现代网站和一丝不苟的开发人员的完美的前端清单

    用这个清单来检查你的项目吧~

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

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

Vue相关

  1. vue-content-placeholders —
    用于渲染虚假(渐进)内容的可组合组件,例如vue中的Facebook

    demo

  2. vue-global-events —
    将全局事件注册为组件

  3. bootstrap-vue — 快速将Bootstrap
    4组件与Vue.js集成的组件库

    官网

  4. vue2-element-touzi-admin

Vue相关

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

RN相关

  1. react-native-typography — React Native
    中像素完美,像原生一样的印刷风格

    [图片上传失败…(image-c3323d-1514857613721)]

  2. AC-QRCode-RN — React
    Native高度可定制的二维码扫描组件

    [图片上传失败…(image-2a46-1514857613721)]

Node相关

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

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

    【官网】

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

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

electron相关

  1. PicGo —
    一个简单而美丽的工具,用electron-vue构建的图片上传工具

    demo

博客

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

架构

  1. parcel —
    快速,零配置的Web应用程序打包器

  2. microbundle —
    用于小型模块的零配置打包程序。

  3. DOClever —
    移动时代首选的接口管理平台

    官网

第三方api

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

文档

  1. Docusaurus —
    易于维护开源文档网站。

    官网

  2. i18next — 学习一次 –
    到处翻译:i18next国际化生态系统

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

[下载地址](https://link.jianshu.com?t=http://sudachi.io/)
  1. cs-playground-react —
    用JavaScript实现常用排序算法和数据结构的交互式概述
    这个超赞的,作者把原理和算法的代码都放到了项目中,点击演示地址进行操作

博客

  1. grow-to-express —
    渐进式Express学习课程,从零开始实现一个Express
  2. 30-seconds-of-code —
    精心收集的有用的JavaScript代码片段,你可以在30秒或更少的时间内理解。

小程序相关

  1. wepy —
    小程序组件化开发框架

    官网

funny stuff

  1. learn-anything —
    搜索互动地图学习任何东西

    官网最大的特点是帮你建立每个知识点的相互关联,查看下图

    demo

  2. array-explorer —
    帮助在任何时候最好的数组方法

    官方示例

相关文章