67 个节约开发时间的前端开发者的工具、库和资源


Posted in Javascript onSeptember 12, 2017

在本文中,我不会去谈 React、Angular、Vue 等等这些大的前端框架,也不会谈 Atom、VS code、Sublime 等等这些已经很出名的代码编辑器,我只是想简单的分享一套我认为有助于提升开发者工作流的工具集。

这套工具集中的大部分你可能见过,也可能没见过,如果有哪个/些让你眼前一亮,那么我的分享就很值了。

这个列表包含许多种类的资源,所以这里我将它们分组整理。

Javascript 库

Particles.js — 一个用来在 web 中创建炫酷的浮动粒子的库

Three.js — 一个用来在 web 中创建 3d 物体和 3d 空间的库

Fullpage.js— 快速实现全屏滚动特性

Typed.js — 打字机效果

Waypoints.js — 滚动到某个元素位置时触发一个功能

Highlight.js — web 语法高亮

Chart.js — 使用 JavaScript 创建漂亮的图表

Instantclick — 能够明显加速网站加载时间,鼠标 hover 时预加载资源

Chartist — 另一个图表库

Motio — 一个基于动画和平移的雪碧图库

Animsition — CSS 实现动画过渡的 jQuery 插件

Barba.js — 流式页面过渡

TwentyTwenty — 一个对比图片的可视化 diff 工具

Vivus.js — 在 SVG 上绘制动画

Wow.js — 滚动时展现动画

Scrolline.js — 页面滚动时显示滚动进度

Velocity.js — 快速流畅的 JavaScript 动画

Animate on scroll — 漂亮的页面滚动元素动画

Handlebars.js — Javascript 模板

jInvertScroll — 视差滚动

One page scroll — 又一个页面滚动库

Parallax.js — 对智能设备方向变化做出响应的视差引擎

Typeahead.js — 搜索补全

Dragdealer.js — 炫酷拖拽

Bounce.js — 创建炫酷的 CSS3 动画

Pagepiling.js — 全屏滚动

Multiscroll.js — 两列垂直反向滚动

Favico.js — 动态 favicon

Midnight.js — 固定头部切换效果

Anime.js — 动画库

Keycode — 获取键盘按键的 JavaScript keycode

Sortable — 拖拽插件

Flexdatalist — 自动补全

Slideout.js — 移动应用侧滑导航

Jquerymy — 使用 jQuery 实现双向数据绑定

Cleave.js — 实时格式化输入内容

Page — 客户端单页应用路由

Selectize.js — 用来添加 tag 的 Hybrid 选择框

Nice select — 创建漂亮的选择框的 jQuery 库

Tether — 使用固定定位来创建相关元素

Shepherd.js — 为应用创建新手引导

Tooltip — tooltip 提示框

Select2 — Jquery 选择框插件

IziToast — 通知弹窗实现

IziModal — 模态框实现

CSS 库 / 设计相关

Animate.css — 动画库

Flat UI Colors — 扁平化设计配色

Material design lite— 基于 Google material design 的框架

Colorrrs — 随机颜色生成器

Section separators — CSS 实现区域分割

Topcoat — 框架

Create ken burns effect — 使用 CSS3 动画实现 Ken burns 特效

DynCSS — 给 CSS 添加 function,动态化 CSS

Magic animations — CSS3 实现动画特效

CSSpin — css spinners 合集

Feather icons — Icon 集合

Ion icons — Icon 集合

Font awesome — Icon 集合

Font generator — 组合多个字体创建混合字体

On/Off switch — 使用 CSS 创建 on/off 开关、radio 按钮

UI Kit — 框架

Bootstrap — 框架

Foundation — 框架

有用的产品/链接

cheatsheet — 可以写在中的所有标签

Ghost — 基于 Node.js 的博客平台

What runs — 一个用于网站技术分析的 Chrome 插件

Learn anything — 一个强大的用于分析某个主题的思维导图

这是我个人有时在使用的一些工具/框架/库的一个列表。很高兴在twitter 上和我联系,并分享你的发现。

译者:myvin
译文:http://www.zcfy.cc/article/4174
原文:https://hackernoon.com/67-useful-tools-libraries-and-resources-for-saving-your-time-as-a-web-developer-7d3fb8667030

Javascript 相关文章推荐
仿163填写邮件地址自动显示下拉(无优化)
Nov 05 Javascript
js获取RadioButtonList的Value/Text及选中值等信息实现代码
Mar 05 Javascript
JS中实现replaceAll的方法(实例代码)
Nov 12 Javascript
js获取select标签的值且兼容IE与firefox
Dec 30 Javascript
JavaScript中的Primitive对象封装介绍
Dec 31 Javascript
JS实现的自定义网页拖动类
Nov 06 Javascript
jQuery随手笔记之常用的jQuery操作DOM事件
Nov 29 Javascript
javascript从作用域链谈闭包
Jul 29 Javascript
node文字生成图片的示例代码
Oct 26 Javascript
js限制input只能输入有效的数字(第一个不能是小数点)
Sep 28 Javascript
使用 Vue cli 3.0 构建自定义组件库的方法
Apr 30 Javascript
layui table 表格模板按钮的实例代码
Sep 21 Javascript
react-native DatePicker日期选择组件的实现代码
Sep 12 #Javascript
JavaScript中递归实现的方法及其区别
Sep 12 #Javascript
详解react-native-fs插件的使用以及遇到的坑
Sep 12 #Javascript
React中jquery引用的实现方法
Sep 12 #jQuery
JS+canvas动态绘制饼图的方法示例
Sep 12 #Javascript
详解react-router4 异步加载路由两种方法
Sep 12 #Javascript
JS+canvas绘制的动态机械表动画效果
Sep 12 #Javascript
You might like
一棵php的类树(支持无限分类)
2006/10/09 PHP
php如何实现只替换一次或N次
2015/10/29 PHP
PHP面向对象程序设计高级特性详解(接口,继承,抽象类,析构,克隆等)
2016/12/02 PHP
PHP时间函数使用详解
2019/03/21 PHP
JAVASCRIPT对象及属性
2007/02/13 Javascript
juqery 学习之三 选择器 简单 内容
2010/11/25 Javascript
关于URL中的特殊符号使用介绍
2011/11/03 Javascript
JS字符串处理实例代码
2013/08/05 Javascript
jquery插件jquery倒计时插件分享
2013/12/27 Javascript
当jQuery1.7遇上focus方法的问题
2014/01/26 Javascript
node.js中的buffer.slice方法使用说明
2014/12/10 Javascript
javascript中this的四种用法
2015/05/11 Javascript
jquery.map()方法的使用详解
2015/07/09 Javascript
7个去伪存真的JavaScript面试题
2016/01/07 Javascript
微信小程序 删除项目工程实现步骤
2016/11/10 Javascript
微信小程序 es6-promise.js封装请求与处理异步进程
2017/06/12 Javascript
Webpack常见静态资源处理-模块加载器(Loaders)+ExtractTextPlugin插件
2017/06/29 Javascript
原生js实现下拉选项卡
2019/11/27 Javascript
JS字符串和数组如何实现相互转化
2020/07/02 Javascript
[00:43]DOTA2小紫本全民票选福利PA至宝全方位展示
2014/11/25 DOTA
[00:34]TI7不朽珍藏III——纯金地穴编织者饰品展示
2017/07/15 DOTA
Python编写检测数据库SA用户的方法
2014/07/11 Python
python中偏函数partial用法实例分析
2015/07/08 Python
利用pandas将numpy数组导出生成excel的实例
2018/06/14 Python
python中dict字典的查询键值对 遍历 排序 创建 访问 更新 删除基础操作方法
2018/09/13 Python
Python使用Pygame绘制时钟
2020/11/29 Python
英国拳击装备购物网站:RDX Sports
2018/01/23 全球购物
Java中有几种类型的流?JDK为每种类型的流提供了一些抽象类以供继承,请说出他们分别是哪些类?
2012/05/30 面试题
家长给孩子的表扬信
2014/01/17 职场文书
护士自我评价范文
2014/01/25 职场文书
多媒体编辑专业毕业生求职信
2014/06/13 职场文书
项目战略合作意向书
2015/05/08 职场文书
给老师的保证书怎么写
2015/05/09 职场文书
九年级数学教学反思
2016/02/17 职场文书
Python中seaborn库之countplot的数据可视化使用
2021/06/11 Python
LeetCode189轮转数组python示例
2022/08/05 Python