[译]67个帮网页开发者节省时间的工具、库和资源

原文:67 useful tools, libraries and resources for saving your time as a web developer

在本文中,我并不会谈论一些大型的前端框架,比如像React、Angular、Vue等,也不准备讲流行的代码编辑器如Atom,VS Code,Sublime等,我只是想分享一个我认为对提升开发者工作效率有帮助的工具列表。

一些朋友可能对其中的一些工具有所了解,但是如果你从中发现新的和有用的东西,我会感到很高兴。

这个列表包含很多不同的资源,所以为了方便我会把它们分组。

Javascript库

Particle.js — 一个用于在页面上创建漂亮的浮动粒子的库
Three.js — 一个用于在页面创建3d对象和空间的库
Fullpage.js — 易于实现全屏滚动效果
Typed.js — 打字机效果
Waypoints.js — 滚动到一个元素时候触发事件
Highlight.js — 页面内容的语法高亮
Chart.js — 纯javascript制作漂亮的图表
Instantclick— 显著提升网站的加载时间,鼠标悬浮时预加载资源
Chartist — 图表库
Motio — 一个实现精灵动画和平移的库
Animsition — css动画实现页面过渡效果的Jquery插件
Barba.js — 平滑页面过渡
TwentyTwenty — 视差插件
Vivus — 用SVG制作路径动画的库
WOW.js — 滚动显示动画
Scrolline.js — 在到达页面底部前查看页面滚动进度
Velocity.js — 非常快并且平滑的js动画
AOS - 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 — 动态图标
Midnight.js — 页面滚动时切换固定头部效果
anime.js — 动画库
KeyCode — 获取按键的js键码
Sortable. No jQuery. — 拖拽
Flexdatalist — 自动补全
Slideout.js — 移动应用滑出式导航菜单
jQuery.my — 使用jquery双向绑定数据
Cleave.js — 格式化输入内容
Page — 单页应用的客户端路由
Selectize.js — 添加标签的输入框和下拉框
jQuery Nice Select — 用于创建漂亮的下拉框的jquery库
Tether — 使用绝对定位创建相关连元素
Shepherd.js — 应用的新用户引导
Tooltip — Name speaks for itself(基于tether的工具提示)
select2 — jquery代替选择框
iziToast — 轻量js通知插件
iziModal.js — 轻量js拟态框

CSS库 / 设计素材

Animate.css — 动画库
Flat UI Colors — 配色列表
Material Design Lite — 基于谷歌Material Design的框架
Material UI — Material设计框架资源
Colorrrs — 随机颜色
Section Separators — CSS区域分割
Topcoat — 框架
Ken Burns Effect — css动画实现特写镜头和缩放
DynCSS — 给css添加功能,让它有动态属性
Magic Animations CSS3 — 动画
CSSPIN — css旋转图片集合(加载动画)
Feather icons — 图标库
Ionicons — 图标字体
Font Awesome — 图标字体
font generator — 生成多种字体组合
On/Off switch — css创建 on/off 开关效果
UIkit — 前端框架
Bootstrap — 前端框架
Foundation — 前端框架

有用的产品/链接

cheatsheet — 所有可以放进标签的内容清单
Ghost — 基于node.js的简易博客平台
WhatRuns — 网站技术分析的Chrome插件
Learn Anything — 分解一个给定主题的强大思维导图

这就是我个人常用到的前端工具、框架、库的列表。如果愿意,随时欢迎在twitter上联系我分享你的新发现。

Comments
Write a Comment