前端学习之路, 记录前端小白成长历程, 学习总结, 工具汇总, 打造开箱即用的学习体验
前端学习之路, 记录前端小白成长历程, 学习总结, 工具汇总, 打造开箱即用的学习体验
常用js库汇总
之前有很多人问学好前端需要学习哪些 js 库, 主流框架应该学 vue 还是 react ? 针对这些问题, 笔者来说说自己的看法和学习总结.
首先我觉得在学习任何知识之前必须要有一个明确的学习目标, 知道自己为什么要学它, 而不是看网上说的一股脑的给你灌输各种知识, 让你学习各种库, 从而不断的制造大家的焦虑感.
前端由于入行门槛低, 更新换代很快, 每年都会有大量新的框架和库出现, 也有大量库被淘汰(比如 JQuery
, 但是学习它的设计思想很有必要). 所以我们大可不必担心, 保持自己的学习步伐, 按需学习即可. 比如说你对移动端比较感兴趣, 工作中也刚好涉及到一些技术的应用,那么我可以专门研究移动端相关的技术和框架, 又或者你对企业后台/中台产品感兴趣, 比较喜欢开发PC端项目, 那么我们可以专门研究这种类型的js库或者框架, 接下来笔者也是按照不同前端业务的需求, 来整理一份能快速应用到工作中的js库, 以提高大家的开发效率.
Relative developer-roadmap
- React学习必备
- HelloWorld开发者社区, 你要的技术都在这里
js常用工具类
- lodash 一个一致性、模块化、高性能的 JavaScript 实用工具库。
- ramda 一个很重要的库,提供了许多有用的方法,每个 JavaScript 程序员都应该掌握这个工具
- day.js 一个轻量的处理时间和日期的 JavaScript 库,和 Moment.js 的 API 设计保持完全一样, 体积只有2kb
- big.js 一个小型,快速的JavaScript库,用于任意精度的十进制算术运算
- qs 一个 url参数转化 (parse和stringify)的轻量级js库
- decimal.js 实现JavaScript的任意精度的十进制类型库
表单校验
- Validator.js 一个强大的js表单校验库, github地址: https://github.com/validatorjs/validator.js
- Validate.js 致力于提供一种验证数据的跨框架和跨语言方式的js库, 已通过100%代码覆盖率的单元测试 github地址: https://github.com/ansman/validate.js
dom库
- JQuery 封装了各种dom/事件操作, 设计思想值得研究借鉴
- zepto jquery的轻量级版本, 适合移动端操作
- fastclick 一个简单易用的库,它消除了移动端浏览器上的物理点击和触发一个 click 事件之间的 300ms 的延迟。目的就是在不干扰你目前的逻辑的同时,让你的应用感觉不到延迟,反应更加灵敏。
文件处理
- file-saver 一个在客户端保存文件的解决方案,非常适合在客户端上生成文件的Web应用程序
- js-xlsx 一个强大的解析和编写excel文件的库
网络请求
- Axios 一个基于 Promise 的 HTTP 库,可用在 Node.js 和浏览器上发起 HTTP 请求,支持所有现代浏览器,甚至包括 IE8+
- Superagent 基于Ajax的优化, 可以与 Node.js HTTP 客户端搭配使用
- fly.js 一个基于promise的http请求库, 可以用在node.js, Weex, 微信小程序, 浏览器, React Native中
动画库
- Anime.js 一个JavaScript动画库,可以处理CSS属性,单个CSS转换,SVG或任何DOM属性以及JavaScript对象
- Velocity 一个高效的 Javascript 动画引擎,与jQuery的 $.animate() 有相同的API, 同时还支持彩色动画、转换、循环、画架、SVG支持和滚动等效果
- Vivus 一个零依赖的JavaScript动画库,可以让我们用SVG制作动画,使其具有被绘制的外观
- GreenSock JS 一个JavaScript动画库,用于创建高性能、零依赖、跨浏览器动画,已在超过400万个网站上使用, 并且可以在React、Vue、Angular项目中使用
- Scroll Reveal 零依赖,为 web 和移动浏览器提供了简单的滚动动画,以动画的方式显示滚动中的内容
- Kute.js 一个强大高性能且可扩展的原生JavaScript动画引擎,具有跨浏览器动画的基本功能
- Typed.js 一个轻松实现打字效果的js插件
- fullPage.js 一个可轻易创建全屏滚动网站的js滚动动画库, 兼容性无可替代
- iscroll 移动端使用的一款轻量级滚动插件
- swiper.js 一款强大的js跨端触摸滑动插件, 使用地址: https://www.swiper.com.cn/api/index.html
- MixItUp 是用于DOM操作的高性能,无依赖库,使您能够使用精美的动画过滤,排序,添加和删除DOM元素的js动画库
- Lottie 一个用于Android,iOS,Web和Windows的库,用于解析使用Bodymovin导出为json的Adobe After Effects动画,并在移动设备和网络上呈现它们, github: https://github.com/airbnb/lottie-web
鼠标/键盘相关
- KeyboardJS 一个在浏览器中使用的库(与node.js兼容).它使开发人员可以轻松设置键绑定和使用组合键来设置复杂的绑定.
- SortableJS 功能强大的JavaScript 拖拽库
图形/图像处理库
- html2canvas 一个强大的使用js开发的浏览器网页截图工具
- dom-to-image 一个可以将任意DOM节点转换为用JavaScript编写的矢量(SVG)或光栅(PNG或JPEG)图像的库
- pica 一个在浏览器中调整图像大小,而不会出现像素失真,处理速度非常快的图片处理库
- Lena.js 一个轻量级的可以给你图像加各种滤镜的js库
- Compressor.js 一个使用本地canvas.toBlob API进行图像有损压缩的js库
- Fabric.js 一个易于使用的基于HTML5 canvas元素的图片编辑器
- merge-images 一个将多张图片合并成一张图的js插件
- cropperjs 一款强大的图片裁切库, 支持灵活的图片裁切方式
- Grade 一个基于图像中的前2种主要颜色生成互补渐变背景的库
表单表格
- x-spreadsheet 一个基于web的简单易用的表格插件
github: https://github.com/myliang/x-spreadsheet
以上这些js库不必每一样都去了解和深究, 技术都是为业务服务的, 所以我们按需使用和学习即可. 至于像react或者vue这种框架的相关生态, 笔者这里就不一一介绍了, 官网文档上都有非常详细的生态集, 感兴趣的朋友自行了解即可.
Partner project
- Blink - 一款自定义的生成故障艺术动画的组件库
- H5-Dooring | 一个所见即所得的H5编辑器
持续更新 | Continuous upgrades
源地址
前端学习之路, 记录前端小白成长历程, 学习总结, 工具汇总, 打造开箱即用的学习体验相关推荐
- 编程学习之路记录重新开始
编程学习之路记录重新开始 2017年起始 记录重头开始--------------
- 新的blog,将会记录我的成长历程
51CTO博客已经开通,这里将记录我的成长历程,记录我的点点滴滴` 转载于:https://blog.51cto.com/linuxtracer/376354
- 深度学习(目标检测。图像分割等)图像标注工具汇总
深度学习(目标检测.图像分割等)图像标注工具汇总 2018年05月31日 09:21:54 努力努力再努力tq 阅读数:3581 对于监督学习算法而言,数据决定了任务的上限,而算法只是在不断逼近这个上 ...
- Android 开发、成长、辅助等工具汇总(持续更新中)
互联网的迅速发展,导致市面上各种各样的工具层出不穷,这本来是好事.但是过于频繁的尝试.更换工具,不仅仅浪费了我们的时间,最重要的是也影响了我们的成长.现如今同类工具的功能基本类似,优秀的ideal总会 ...
- python 前端学习_python学习之路7 前端学习3
1.页面布局 PosTion :fixed Title .left{float:left; }.right{float:right; }.head{height:58px;background-col ...
- 【学习分享】 记录开源小白的第一次 PR
本文由RT-Thread论坛用户@yanlineng原创发布:https://club.rt-thread.org/ask/article/5a3155877b44066c.html 大家好,我是一枚 ...
- 我的Linux学习之路(纯小白)
说在前面:感激赏识我的人们,谢谢你带我入门~~~~满怀感恩,出发~~~ 第一部分:学习资料(书籍和B站上的Linux视频) 目前在看的几本Linux书籍: 1.Linux就该这么学-刘遄 网址:htt ...
- 【深度学习之路记录02】python代码批量修改Labelme标注的json文件(删除标签、修改标签名)
代码参考:https://blog.csdn.net/qq_44442727/article/details/112785978 创建自己的数据集时,经常需要一些调整,比如说修改某一批文件中已经标好的 ...
- Love 6 从零开始的计算机学习之路(一)---- 我的大学历程(不定期更新到大学毕业)
文章目录 前引(2022/3/7日 笔者留) 大一大二的学习历程(一) 1.2022/3/7日留(大一到大二下) 2.2022/5/12日留(大二下) 3.2023/4/13日留(大二下-至今) 前引 ...
- HACK RF学习之旅记录1——填坑历程
在家隔离期偶尔发现RTL SDR,是realtek芯片破解了做软件无线电,价格非常实在不到百元,功能可以玩电视 广播等等.后来搜搜发现更强大的Hack RF ONE开发板,淘宝和闲鱼都看了大多都是Ha ...
最新文章
- 将TVM集成到PyTorch
- TestStack.White安装详解
- ddz指标最佳数值_一个良心操盘手的肺腑之言:炒股10年从未被套,只依靠RSI指标!...
- java常见的内存泄漏
- [codevs 1922] 骑士共存问题
- 无数种求逆元的方法总结
- 验证邮箱是否合法php,验证邮箱字段是否合法
- 前端常用功能记录(一)
- 搭建自己的 CDN 会有哪些乐趣和好处?
- 使用mysqldump备份数据库
- Atitit 常用加密算法 aes des rsa 比较 历史演进 目录 1.1. 常规加密算法如下 Aes 3des des rsa	1 2. 加密算法历史演进 按照出现时间和加密强度 流行
- 设置Linux中的Mysql不区分表名大小写
- input限制输入经纬度和java后台验证经纬度
- Java、数据库等面试题大全
- bezier曲面制作,SU技巧 | Bezier Surface(贝兹曲面)
- 微机原理与接口技术[第三版]——第五章课后习题答案
- EC-PCA: 利润中心主数据维护流程
- 运维部门工作总结_运维部技术工作总结
- linux mint 18.3 内核,Linux Mint 18.3 “Sylvia” KDE和Xfce版本正式发布
- 【sql查询】使用sql查询一个物品是否在有效期内的方法(数据库无这个字段 通过生产日期和保质期进行计算得出)
热门文章
- LFY-SpringBoot2【SpringBoot2入门】
- 磁盘管理压缩卷显示服务器异常,Win7分配盘符提示“磁盘管理控制台不是最新状态”错误怎么办...
- pygame 单色背景颜色
- Java基础篇--异常机制
- mysql error 1137_遇到的错误-----MySQL使用临时表 出现 “ERROR 1137 (HY000): Can't reopen table” 的异常 解决方法...
- 深拷贝和浅拷贝的区别(必须掌握)
- 苟富贵倒萨忽然他确实
- 此处纸薄不经墨,待入章中再续貂
- 微信小游戏排行榜卡顿或无法滑动
- WPF流程图制作系列相关基础一