手记

2018年8月前端必须star的github项目

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

react相关

  1. mauerwerk -- react-spring grid 栅格进入/退出交互组件

    [图片上传失败...(image-16a4f3-1537065666086)]

  2. react-color -- 来自Sketch,Photoshop,Chrome,Github,Twitter等的颜色选择器

    demo

    官网

  3. react-loadable -- 用于加载具有promise的组件的更高阶组件。

  4. react-window -- React组件,用于有效地呈现大型列表和表格数据

    官网

  5. rc-bmap -- 当百度地图遇上React,会产生怎样的火花 欢迎您的加入

    官网

  6. JavaScript和React的可读,自动化和优化(5 kb)国际化

  7. 用于滚动,缩放和突出显示代码的反应组件</>

    demo

react native 相关

  1. metro -- React Native的JavaScript打包工具。

音频

  1. Tone.js -- 用于在浏览器中制作交互式音乐的Web Audio框架。

    demo

UI

  1. taro-ui -- 一款基于 Taro 框架开发的多端 UI 组件库

    官网

办公

  1. mdx-deck -- 基于MDX的演示文稿

    demo

webpack

  1. size-plugin -- 随时间跟踪压缩的Webpack资产大小。

// webpack.config.js+ const SizePlugin = require('size-plugin');module.exports = {
  plugins: [
+    new SizePlugin()
  ]
}
![demo](http://upload-images.jianshu.io/upload_images/3790386-791a17aa77f79441?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

架构

  1. [lerna -- 用于管理具有多个包的JavaScript项目的工具。](https://github.com/lerna/l                                                                                                                                                                                                                    erna)
    对于维护过多个package的同学来说,都会遇到一个选择题,这些package是放在一个仓库里维护还是放在多个仓库里单独维护,数量较少的时候,多个仓库维护不会有太大问题,但是当package数量逐渐增多时,一些问题逐渐暴露出来:

package之间相互依赖,开发人员需要在本地手动执行npm link,维护版本号的更替。
issue难以统一追踪,管理,因为其分散在独立的repo里。
每一个package都包含独立的node_modules,而且大部分都包含babel,webpack等开发时依赖,安装耗时冗余并且占用过多空间。

可视化

  1. BizCharts -- 基于G2和React的强大数据可视化库。

    demo

    官网

  2. zeu -- 用于实时可视化的JavaScript库

    [图片上传失败...(image-6ee66e-1537065666086)]

css

  1. postcss-autoprefixer通过Can I Use解析CSS并将规则添加到规则中

node

  1. dumper.js -- 适用于Node.js应用程序的更好,更漂亮的变量检查器

  2. got -- 简化的HTTP请求

const got = require('got');(async () => {    try {        const response = await got('sindresorhus.com');        console.log(response.body);        //=> '<!doctype html> ...'
    } catch (error) {        console.log(error.response.body);        //=> 'Internal server error ...'
    }
})();
  1. check-links -- 可靠地检查一系列URL以获得活跃度。

支持http和https;
每次HTTP请求默认为10秒超时,重试次数为2次;
默认为Mac OS Chrome用户代理;
默认为重定向
  1. http-timer -- HTTP请求的计时

const https = require('https');const timer = require('@szmarczak/http-timer');const request = https.get('https://httpbin.org/anything');const timings = timer(request);

request.on('response', response => {
    response.on('data', () => {}); // Consume the data somehow
    response.on('end', () => {
        console.log(timings);
    });
});

微信小程序

  1. WeTypecho -- 微信小程序版Typecho

众所周知,现在由于移动互联网的普及,网站访问量下降,导致个人站长非常难混。

WeTypecho则能帮您快速搭建微信小程序,将Typecho博客的内容映射到微信小程序。 帮助您在一定程度上获取更多来自微信的流量。WeTypecho的安非常简单,只需三分钟,就能搭建。

文本处理

  1. monaco-editor -- 基于浏览器的代码编辑器

    demo

pwa

  1. SuperSlide.js -- 为您的下一个PWA提供灵活,流畅的GPU加速滑动菜单

    [图片上传失败...(image-d4af18-1537065666086)]

funny stuff

  1. nes -- 一个Javascript NES模拟器

    demo

  2. resources -- 知名互联网企业内推资料整理 持续更新ing 。

  3. windows95 -- Windows 95 in Electron。在macOS,Linux和Windows上运行。

    demo



作者:张君卓mytac
链接:https://www.jianshu.com/p/834ed409ba85


0人推荐
随时随地看视频
慕课网APP