前端常用工具库整理

文章列举了一系列JavaScript相关的技术资源,包括HTTP库Axios、实用工具库Lodash、前端UI框架如Bootstrap,以及各种JavaScript动画库,如Wow.js和Anime.js,还涵盖了布局、CSS动画、配色、图标和数据可视化工具等。
摘要由CSDN通过智能技术生成

|功能库|<<<

Axios|一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中|http://www.axios-js.com/
Lodash|一个一致性、模块化、高性能的 JavaScript 实用工具库|https://www.lodashjs.com/
Underscore|一个JavaScript实用库,提供了一整套函数式编程的实用功能,但是没有扩展任何JavaScript内置对象。|https://underscorejs.net/
Ramda |一款实用的 JavaScript 函数式编程库。|https://ramda.cn/
Moment.js|时间处理库|http://momentjs.cn/
MathJS|这个库是 JavaScript 和 Node.js 的数学扩展库,与 JavaScript 内置的 Math 库兼容。|https://mathjs.org/
Day.js|仅 2 kb大小的时间处理库,和 Moment.js 的 API 设计保持完全一样|https://dayjs.fenxianglu.cn/
tui.calendar|ThorUI,轻量、简洁、全面的移动端组件库中的日历组件|http://www.thorui.cn/doc/docs/thorui/tui-calendar.html
Keycode | 获取键盘按键的 JavaScript keycode|http://keycode.info/

|前端UI库|<<<

Bootstrap|Bootstrap 是最受欢迎的 HTML、CSS 和 JS 框架,用于开发响应式布局、移动设备优先的 Web 项目。|https://www.bootcss.com/
ElementUI|可以很好的搭配vue来进行项目的开发,提供了很多风格统一美观的组件。|https://element.eleme.cn
Antd Design|antd 是基于 Ant Design 设计体系的 React UI 组件库,主要用于研发企业级中后台产品。|https://ant.design/index-cn
Thor-UI|ThorUI,轻量、简洁、全面的移动端组件库|http://www.thorui.cn

|布局|<<<

Macy.js|仅 4 kb的 原生 流布局插件|http://macyjs.com/
Section separators | CSS 实现区域分割|https://tympanus.net/Development/SectionSeparators/

|JS滚动动画|<<<

wow.js|让页面滚动更有趣|dowebok.com/demo/131/
Barba.js|流式页面过渡|https://barba.js.org/
Waypoints.js | 滚动到某个元素位置时触发一个功能|http://imakewebthings.com/waypoints/
fullPage.js|基于 jQuery 的插件,它能够很方便、很轻松的制作出全屏网站|http://fullpage.81hu.com/
Scrolline.js | 页面滚动时显示滚动进度|https://jquery-plugins.net/scrolline-js-scroll-line-bar-indicator-on-page
Animate on scroll | 漂亮的页面滚动元素动画|https://michalsnik.github.io/aos/
Pagepiling.js | 全屏滚动|https://github.com/alvarotrigo/pagePiling.js

|JS特效动画|<<<

tippyjs|玩转鼠标悬停提示信息|https://atomiks.github.io/tippyjs/
Vivus.js |在 SVG 上绘制动画|http://maxwellito.github.io/vivus/
Highlight.js | web 语法高亮|https://highlightjs.org/
OWL Carousel.js|走马灯插件|https://www.dowebok.com/demo/2014/93/
typed-js|打字效果|https://mattboldt.com/demos/typed-js/
Velocity.js|动画库|http://velocityjs.org/
Tween.js|TweenJS类库主要用来调整和动画HTML5和Javascript属性,提供了简单并且强大的tweening接口。|http://www.createjs.cc/tweenjs/
Shepherd.js | 为应用创建新手引导|https://github.com/HubSpot/shepherd
Anime.js| 动画库|https://www.animejs.cn/
Dragdealer.js | 炫酷拖|https://skidding.github.io/dragdealer/
Sortable | 拖拽插件|http://www.sortablejs.com/

|CSS动画|<<<

Motio|一个基于动画和平移的雪碧图库|https://darsa.in/motio/#!introduction
Animate.css|常用的CSS动画|https://animate.style/
Bounce.js| 创建炫酷的 CSS3 动画|http://bouncejs.com/
TweenMax|动画库|https://www.tweenmax.com.cn/
Barba.js|流式页面过渡|https://barba.js.org/
CSSpin | css spinners 合集,CSS Spinners and Loaders|https://webkul.github.io/csspin/
Magic animations | CSS3 实现动画特效|https://www.minimamente.com/project/magic/

|颜色、配色|<<<

Flat UI Colors | 扁平化设计配色|https://flatuicolors.com/
Colorrrs |随机颜色生成器|https://www.webfx.com/web-design/random-color-picker/

|ICON|<<<

Ion icons |Icon 集合|https://ionicons.com/
Font awesome |Icon 集合|https://feathericons.com/
阿里图标库|-|https://www.iconfont.cn/
On/Off switch | 使用 CSS 创建 on/off 开关、radio 按钮|https://proto.io/freebies/onoff/

|字体|<<<

Font awesome | 字体集合|https://fontawesome.com/
Font generator | 组合多个字体创建混合字体|https://brandmark.io/font-generator/

|可视化|<<<

D3JS|绘图库|https://d3js.org/
ChartJS|提供了 8 种不同类型的数据可视化,每种类型都支持动画和定制。|https://www.chartjs.org/samples/latest/
Echarts|数据可视化|https://echarts.apache.org
HighCharts|方便快捷的纯 JavaScript 交互性图表,是目前是市面上最简单灵活的图表库。|https://www.highcharts.com.cn/

|3D|<<<

Particles.js| 一个用来在 web 中创建炫酷的浮动粒子的库 |http://vincentgarreau.com/particles.js/
Three.js |一个用来在 web 中创建 3d 物体和 3d 空间的库|https://threejs.org/
Tween.js|TweenJS类库主要用来调整和动画HTML5和Javascript属性,提供了简单并且强大的tweening接口。|http://www.createjs.cc/tweenjs/

|识别|<<<

tesseract.js|OCR识别js语言库|https://tesseract.projectnaptha.com/
trackingjs|人脸识别库|官网,示例

|其它|<<<

Awesome Vuejs Resource|Vue 资源|https://github.com/suifeng123/awesome-vue-cn
Touch.js|移动端手势库|https://www.w3cways.com/2007.html
httpserver|轻量级本地web服务器|
TwentyTwenty | 一个对比图片的可视化 diff 工具|https://zurb.com/playground/twentytwenty

参考网址

https://www.cnblogs.com/hasz/p/14330945.html

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值