2020年的前端资源

时间  2021-08-14
标签 javascript php css html 前端 vue html5 java node react 栏目 JavaScript 繁體版
原文   原文链接

本文收录在 awesome-frontend 中，并将持续更新哟~javascript

打包工具

webpack loader 和插件

包管理

框架

Canvas 相关

APP 相关

CSS 相关

小程序 相关

  • mpvue - 基于 Vue.js 的小程序开发框架，从底层支持 Vue.js 语法和构建工具体系
  • wepy - 小程序组件化开发框架
  • westore - 微信小程序解决方案 - 1KB javascript 覆盖状态管理、跨页通信、插件开发和云数据库开发
  • ColorUI - 鲜亮的高饱和色彩，专一视觉的小程序组件库
  • Gitter - 采用 Taro 框架 + Taro UI 进行开发的 demo ， 多是目前颜值最高的 GitHub 微信小程序客户端

⬆️ 返回首页php

其余

  • react
  • vue
  • next.js
  • nuxt.js
  • gastby
  • umi - 蚂蚁金服的前端框架
  • rekit - IDE and toolkit for building scalable web applications with React, Redux and React-router
  • choo - dva 最初的 API 是参考这个实现的，已经不怎么发展了，再关注一段时间
  • taro - 用 React 写小程序，适配微信和支付宝等
  • after.js
  • mint - 提供了语言层方案的框架
  • quasar - 基于 vue，一套代码多处适用
  • Angular
  • Foundation
  • Polymer - Google发布的Web组件构建框架
  • cyclejs
  • taro - 多端统一开发框架，支持用 React 的开发方式编写一次代码

React 相关库

Vue 相关库

UI 库

其余

阿里系

工具类

数据流

语言

文档

工程

  • lerna - monorepo 管理
  • lerna-changelog - 为 lerna 项目自动生成 changelog
  • eslint - JS 风格约束
  • eslint-config-airbnb
  • xo - 封装自 eslint
  • prettier - 更主观的风格自动修改
  • yeoman-generator - 脚手架工具
  • serve - 本地静态服务器
  • servor - 另外一个静态服务器
  • budo - 又一个静态服务器
  • np - npm publish 辅助，自动 push、打 tag、升版本等
  • lint-staged - eslint 提速，只 lint 提交的代码
  • coveralls - 覆盖率
  • husky - 添加 git hooks
  • cross-env - 跨平台的环境变量声明
  • projj - 本地 git 项目管理，支持 github 和 gitlab
  • nvm - 管理 node 版本
  • concurrently - 在 npm scripts 里并行执行命令
  • @zeit/ncc - 打包为 npm 包为一个文件
  • npm-check - 检测依赖升级状况，和 yarn upgrade-interactive 配合着用，主要用来检测冗余依赖
  • cpx - 复制，支持 glob，而且能够 watch
  • onchange - 监听文件变更而后作一些事
  • just - 微软出的任务管理器
  • tern - 代码分析器，为很多编辑器服务
  • analyze-css - CSS选择器的复杂性和性能分析器

编辑器

命令行

  • yargs - 命令行入口套件
  • yargs-parser - 命令行参数解析
  • chalk - 输出不一样颜色
  • cheerio - 用类 jQuery 语法处理 HTML
  • chokidar - 文件监听
  • clipboardy - 复制文本到粘贴板
  • debug - 打印调试信息
  • deprecate - 给过时警告
  • glob - 文件查找
  • tiny-glob - 文件查找
  • signale - 漂亮的日志打印
  • semver - semver 版本处理
  • update-notifier - 更新提醒
  • rimraf - 删除文件
  • depd - 给出 deprecated 警告
  • execa - 比 child_process 好用，返回 Promise
  • ora - 控制命令行光标，显示 loading 等
  • inquirer - 交互式命令接口，好比 prompt
  • enquirer - 同上，更 cool 一些
  • ajv - 参数校验
  • ink - 用 React 处理命令行输出
  • figures - ✔︎ 等特殊字符，作了 windows 兼容处理

请求处理

富文本相关

持续集成

  • CircleCI
  • GitlabCi
  • appveyor - 适用于Windows和Linux的持续集成解决方案
  • Jenkins - 一个支持 PHP 的连续集成平台
  • JoliCi - 一个用 PHP 编写并由 DOCKER 供电的集成客户端
  • PHPCI - 一个开源的 PHP 连续集成平台
  • SemaphoreCI - 开源和私人项目的集成平台
  • Shippable - 一个基于 DOCKER 的开源和私有项目的连续集成平台
  • Travis CI - 持续整合平台
  • Wercker - 持续整合平台
  • snyk.io - 前端依赖检测
  • codecov.io - 测试覆盖率报告

在线工具

在线编程

  • jsfiddle - 在线编程，生成在线预览
  • plnkr - 在线编程，生成在线预览
  • codepen - 在线编程，生成在线预览
  • jsbin - 在线编程，生成在线预览

转换

图标管理

其余在线工具

代码高亮

音频/视频

数据可视化库

  • echarts - 它是用纯 JavaScript 编写的，基于 zrender 画布。它支持以画布、SVG(4.0+) 和 VML 的形式绘制图表。除了 PC 和移动浏览器外，ECharts 还能够与 node 上的 node-canvas 一块儿使用，以便进行高效的服务器端渲染（SSR）
  • Highcharts JS - 是一个广受欢迎的基于 SVG 的 JavaScript 图表库，针对旧的浏览器可降级到 VML 和画布。世界上最大的 100 家公司中，有 72 家公司（Facebook、Twitter 等）使用了这个库，这使得它成为世界上最流行的 JS 图表 API
  • G2
  • F2 - 移动端可视化图表
  • D3 - 多是最流行和使用最普遍的 JavaScript 数据可视化库。D3 用于基于数据的文档操做，并使用 HTML、SVG 和 CSS 让数据活起来。它基于 Web 标准，结合现代浏览器，不须要与专有框架耦合，将可视化组件和数据驱动的方法结合到 DOM 操做上。它容许你将任意数据绑定到文档对象模型（DOM），而后在文档上应用数据转换
  • Chart.js - 一个很是受欢迎的开源 HTML5 图表库，它使用画布元素构建响应式 Web 应用。ChartJS 提供了混合图表类型，新的图表轴类型和漂亮的动画。它的设计简单而优雅，有 8 种基本的图表类型，你能够将该库与 moment.js 结合在一块儿使用，用于渲染时间轴
  • three.js - ThreeJS 用 WebGL 建立 3D 动画。该项目的灵活性和抽象性意味着它也可用于 2 维或 3 维的数据可视化
  • Metric-Graphics - 用于可视化和布局时间序列数据。它相对较小（80kb），提供了小而优雅的线条图、散点图、直方图、柱状图和数据表，以及地格图（rug plot）和基本线性回归等特性
  • Recharts - 是一个使用 React 和 D3 构建的图表库，能够做为声明性的 React 组件使用。该库提供原生 SVG 支持，轻量级依赖树（D3 子模块）高度可定制。官网文档中能够找到不少例子
  • Raphael - 是一个 JavaScript 矢量库，可在 Web 中绘制矢量图形。该库使用 SVG W3C 和 VML 做为建立图形的基础，所以每一个图形对象也是 DOM 对象，你能够附加 JavaScript 事件处理程序。Raphael 目前支持 Firefox 3.0+、Safari 3.0+、Chrome 5.0+、Opera 9.5+ 和 Internet Explorer 6.0+
  • C3 - 是一个基于 D3 的可重用 Web 应用图表库。该库为每一个元素提供了相应的类，这样你就能够经过这些类来自定义样式，并经过 D3 直接扩展结构。它还提供了多种 API 和回调来访问图表状态。借助它们，你能够更新图表，即便是已经渲染好的图标
  • React-vis - 是 Uber 开发的一系列数据可视化组件，包括线 / 面 / 柱状图、热图、散热图、等高线图、六角热图等等。使用该库不须要事先掌握 D3 或任何其余 data-vis 库的知识，并提供了低级模块化的构建块组件，如 x/y 轴
  • React virtualized - 是一组 React 组件，有效地呈现大型列表和表格数据。ES六、CommonJS 和 UMD 版本能够在每一个分发版中使用，该项目支持 Webpack 4 工做流。请注意，为了不版本冲突，必须将 react，react-dom 指定为 peer 依赖
  • Victory - 在 Web 和 React Native 应用程序中使用相同的 API，以便于跨平台绘制图表。一种优雅而灵活的方式来利用 React 组件来支持实用的数据可视化
  • CartoDB - 是一个位置智能和数据可视化工具，用于发现位置数据中的看法。你能够经过 Web 表单上传地理空间数据（Shapefiles、GeoJSON 等），并在数据集或地图上将其可视化，使用 SQL 进行搜索，并使用 CartoCSS 来应用地图样式
  • Raw - 是电子表格和数据可视化之间的链接，基于 d3.js 库建立基于向量的自定义可视化。它能够处理表格数据（电子表格和 CSV）和从其余应用程序复制和粘贴的文本。由于是 SVG 格式，因此可使用矢量图形编辑器编辑，或直接嵌入到网页中
  • Metabase - 是一种至关快速和简单的方法，能够在不了解 SQL 的状况下建立数据仪表盘（分析师和数据专业人士可以使用 SQL 模式）。你能够建立片断和度量指标，发送数据到 Slack（经过 MetaBot 在 Slack 中查看数据）等等。它多是一个很好的工具，可用它在团队内部可视化数据，尽管可能须要作一些维护工做
  • tauCharts - 一个基于 D3 的图表库。该库提供了一个声明接口，用于将数据字段快速映射到可视化属性，它的架构容许你使用插件构建切面和扩展图表行为
  • chartist-js - 简单的响应式图表
  • semiotic - 结合了 React 和 D3 的数据可视化框架
  • nvd3 - 一个用 D3.js 编写的可重用的图表库
  • viser - 一个适合数据工程师的工具箱
  • tui.chart - 漂亮的数据可视化图表
  • datamaps - 使用 D3.js 在单个 JavaScript 件中自定义 SVG 地图可视化
  • sheetsee.js - 用于对谷歌表格的数据进行可视化
  • BizCharts - 基于 G2 和 React 的数据可视化库
  • sigma.js - 一个专门用于图形绘制的 JavaScript 库
  • incubator-echarts - 一个强大的、交互式的图表和可视化的浏览器库
  • vis - 一个动态的基于浏览器的可视化库

动画库

数据模拟

调试工具

其余

相关文章
相关标签/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公众号
   欢迎关注本站公众号,获取更多信息
联系我们 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程