Issue #232  (Top Tools of 2017)12/28/17

2017 has flown by and this newsletter has included a laughable number of tools over the past 12 months. It really is astounding how much I come across every week.

Believe it or not, I could stop all my research today and still have a good 7 or 8 newsletters with 20+ tools that I haven't yet featured in any issue. So you can imagine what the backlog is like when I'm in full research mode!

For this release, I've gone through all my 2017 issues and checked the MailChimp stats for each issue to compile the 30 most-clicked tools of 2017. These aren't necessarily the most popular tools of the year, but they're the ones that elicited the most clicks, for whatever reason.

There's a good variety of stuff here, with the usual culprits for popularity: Bootstrap, anything related to CSS, and UI frameworks. Those tend to be the most popular links.

Well, that's it for 2017. I hope this newsletter continues to offer you something of value in your development workflow in the coming 12 months.

Now on to the most popular tools of 2017!

Top 10 Tools of 2017

Moon
A minimal, blazing fast user interface library. This was by far the most-clicked tool in this newsletter in 2017.

Timeline.js
jQuery plugin. Creates a carousel/slider in the form of a timeline, with lots of options and customizations.

Brutalist Framework
An open source framework for the brutalist web design trend. I have no idea why this was so popular in terms of clicks. Maybe purely based on curiosity.

Now UI Kit
A beautiful free Bootstrap 4 UI kit. Pro tip: This had two ingredients that are hugely popular in this newsletter: Bootstrap and some kind of UI framework.

sakura
A minimal class-less CSS framework. I'm assuming the "class-less" part is what induced so many clicks on this one.

Code My UI
A collection of HTML and CSS snippets for various UI components and patterns.

Trendy CSS Text Shadows
Free collection of beautiful long text shadows. Includes the fonts, colors, and CSS code.

Fenêtre
Picture-in-picture for your Mac. This was the most-clicked productivity tool of the year.

when-dom-ready
$(document).ready() for the 21st century. Probably not a surprise that this was popular seeing that more and more devs are dropping jQuery.

Birdview.js
Get a glance at a whole web page with an aerial view. Very unique plugin that may have use cases in specific types of apps.

The Next 10...

Public APIs
Collection of free APIs for use in web development.

htmlemail.io
Responsive HTML email templates, tested across multiple email environments.

Luxbar
Lightweight, responsive, CSS-only navigation bar.

explodal
An exploding mostly-CSS modal window. Probably a lot of curiosity clicks on this one.

Runway
Automatically builds a beautifully formatted styleguide based on CSS comments.

Propeller
A front-end responsive framework based on Google's Material Design and Bootstrap. This tool literally checks like every popularity box. Surprised it wasn't in the top 10.

Canivete
A collection of generic, multi-purpose JavaScript functions.

Pushy Buttons
They're just so satisfying. Must... push... all of them...

Bttn.css
A CSS button library with various sizes and colors to choose from.

Sticky Sidebar
Pure JavaScript plugin for adding a smart and high performance sticky sidebar to your site. Also with jQuery compatibility.

The Final 10...

Font Awesome Animation
Simple animated icons using the Font Awesome icon set and some CSS.

Input
Responsive form builder. Pick your responsive framework, select and add form fields to your custom form template,  then download your form code ready for your website.

Shoelace.css
A lightweight, forward-thinking CSS library built with future CSS syntax. It’s easy to use, highly customizable, and familiar to Bootstrap users.

Animated Icons
A small, free, SVG-based animated icon set.

VMS
A Vue.js 2.0 Content Management System. Interesting that no React tool made the top 30, but a Vue tool did.

Behaviors.js
A set of small dependency-free JavaScript modules that allow you to define dynamic page behaviors via HTML attributes.

Lozad.js
Highly performant, light, dependency-free and configurable lazy loader for images, iframes, and more, using IntersectionObserver API.

Freeter
Native Windows, Mac, or Linux app. It's an organizer for designers, programmers, project managers, bloggers, etc. The only other productivity tool to crack the top 30.

Microtip
Modern, minimal CSS tool tip library with accessibility baked in. Just 1kb minified and gzipped.

Infusion
Documentation builder for designers, based on Hugo, the static site generator. Makes the docs available offline as a PWA.

A Tweet for Thought

The most-clicked tweet of 2017 was this Japanese one, a humorous representation of the difference between null and zero in programming.
 

Send Me Your Tools!

Made something? Send links via Twitter @WebToolsWeekly (details here). No tutorials or articles, please. If you have any suggestions for improvement or corrections, feel free to reply to this email.
 

Before I Go...

Finally, here's the most-clicked JS Bin demo from my intros. It's a bit of a JavaScript puzzler, but most experienced developers should know the answer pretty quick. Explanation is in Issue #187.

Thanks to all for subscribing and reading!

Keep tooling,
Louis
webtoolsweekly.com
@LouisLazaris