简评：作者没有讨论大型的前端框架如 React，Angular，Vue 等等，也没有讨论流行的代码编辑器如 Atom，VS Code，Sublime 等等，而是罗列出了一些加速开发者工作流的工具、资源和库。
JavaScript 库
-
Particles.js —— 在网页上创建炫酷的漂浮例子的库，在网站首页比较常见。
-
Three.js —— 在网页上创建 3D 对象和空间的库，常用于网页游戏。
-
Fullpage.js —— 轻松创建全屏滚动的网页。
-
Typed.js —— 实现打字机的效果。
-
Waypoints.js —— 实现滚动一个元素触发一个函数的最简单的方式。
-
Highlight.js —— 自动检测语言及高亮语法。
-
Chart.js —— 纯 JavaScript 实现炫酷图表。
-
Instantclick —— 大大提升网页加载效率，在鼠标悬停时预加载资源。
-
Chartist —— 另一个图表库。
-
Motio —— 实现基于 sprite 的动画和平移效果的库。
-
Animstion —— css 动画页面切换效果的 JQuery 插件
-
Barba.js —— 流畅和平滑的页面过渡效果。
-
TwentyTwenty —— 一个视觉差异工具，突出两个图像之间的差异。
-
Vivus.js —— 用于在 SVG 上绘制动画的库。
-
Wow.js —— 滚动时显示动画。
-
Scrolline.js —— 显示页面的滚动进度条。
-
Velocity.js —— 快速、平滑的 JavaScript 动画。
-
Animate on scroll —— 另一个滚动显示动画的库。
-
Handlebars.js —— JavaScript 模版。
-
jInvertScroll —— 轻量级的水平视差插件。
-
One page scroll —— 与 FullPage 类似。
-
Parallax.js —— 视觉引擎，对智能设备的方向做出反应。
-
Typeahead.js —— 自动匹配搜索。
-
Dragdealer.js —— 相当酷的实现拖动效果的库。
-
Bounce.js —— 创建炫酷的 CSS3 动画。
-
Pagepiling.js —— 又一个 one page scroll.
-
Multiscroll.js —— 实现多列滚动面板效果。
-
Favico.js —— 动态图标。
-
Midnight.js —— 无缝切换固定标题。
-
Anime.js —— 动画库。
-
Keycode —— 获得按键的 JavaScript 键码。
-
Sortable —— 拖动排序控件。
-
Flexdatalist —— 输入补全。
-
Slideout.js —— 在网页上实现抽屉效果的侧边导航栏。
-
Jquerymy —— 使用 jquery 的两种数据绑定方式。
-
Cleave.js —— 格式化输入内容。
-
Page —— 小型客户端路由库。
-
Selectize.js —— 用于添加标签的选择框。
-
Nice select —— 用于创建奈斯型选择框。
-
Tether —— 可以有效地固定绝对定位的元素。
-
Shepherd.js —— 实现指导用户使用应用的效果。
-
Tooltip —— 提示信息。
-
Select2 —— 丰富的自定义选择框。
-
IziToast —— 容易实现的 JS 通知。
-
IziModal —— 容易实现的 JS 弹窗。
CSS 库／设计类
-
Animate.css —— 动画库。
-
Flat UI Colors —— 简单有效的颜色。
-
Material design lite —— 基于 Google 的 Material Design。
-
Materialui.co —— 许多 Material Design 框架的资源。
-
Colorrrs —— 随机颜色生成器。
-
Section separators —— CSS 分割线。
-
Topcoat —— 简单快速的 CSS 框架。
-
Create ken burns effect —— 使用 CSS 动画的 Ken Burns 效果。
-
DynCSS —— 为 CSS 添加函数，让它变成动态的。
-
Magic animations —— 人如其名。
-
CSSpin —— CSS 旋转控件集合。
-
Feather icons —— 图标。
-
Ion icons —— 图标。
-
Font awesome —— 图标。
-
Font generator —— 组合多种字体，生成一个混合体。
-
On/Off switch —— 开关按钮。
-
UI Kit —— 轻型的模块化框架。
-
Bootstrap —— 这个就不谈了。
-
Foundation —— 号称最先进的响应式前端框架。
有用的产品／链接
-
<head> cheatsheet —— 可以进入 <head> 标签的所有内容列表。
-
Ghost —— 基于 node.js 的简单博客平台。
-
What runs —— 发现一个网站使用什么技术的 Chrome 插件。
-
Learn anything —— 以思维导图形式提供各种学习资源，你值得拥有。
英文原文：67 useful tools, libraries and resources for saving your time as a web developer
推荐阅读：
StackBlitz - 针对 Web 开发者的在线 IDE
55 个顶尖 Web 设计与开发网站
100+ 值得收藏的 Web 开发资源
网友评论