Issue #162  (Commenting Confusing Code, jQuery, Deployment, Uncats)

(Skip to the tools section below)

In his book Maintainable JavaScript, Nicholas Zakas gives some suggestions on commenting code. One of the things he talks about is commenting code that could look like an error to a future developer, but in fact is intentional. The example he provides is the use of an assignment operator in a while loop's control condition, which he take directly from the YUI library, which he worked on.

Looking through the YUI source (which is no longer actively maintained, so keep that in mind), there are actually three such instances where code is commented in this way. Here's an example:
if ((el = cache[docStamp])) // assignment
  return el;

The single-line comment clarifies what might be construed as an error. Normally you don't see assignment operators used in conditionals in this way. Without the comment, a future developer might think this is a mistake and try to fix it (e.g. changing equals to double-equals or triple-equals). At best, the developer might waste time testing to see if it is an error, even if it isn't immediately fixed.

By default, some linters will warn about code like this (e.g. JSLint does), so again this might prompt a developer to waste time trying to fix a problem that doesn't exist. Of course, code standards for a team inheriting a project might change, and this might be a required fix, but that's another point altogether.

With the comment in place, the potentially confusing code is made clearer. When deciding to include comments in code, always comment code that could be potentially confusing or that is generally difficult to understand at first glance.

Now on to this week's tools!
70 JavaScript and DOM Tips for $5 (EPUB, MOBI, PDF)

jQuery Plugins and Tools

"jQuery's missing utils and special events." A collection of useful DOM helpers and special events for jQuery 1.8 and later.

"Elegant, responsive, flexible and lightweight modal plugin."

"Build simple step tutorial and step-by-step guide systems out of HTML checkbox inputs."

Responsive Thumbnail Gallery
"jQuery Plugin for creating image galleries that scale to fit their container."

"A jQuery UI timepicker. Manage time input fields in a standard form. Focus on the input to open an small interactive timepicker."

Add SVG-based blur effects on images, to focus on a specific portion of an image.

Tabular Input
Simple way to convert a single element into an editable data table for tabular input. Also does add/remove columns/rows, etc.

"A jQuery plugin that will flip through a list of images as your mouse sweeps across a container."

384 Pages of CSS for $7 (PDF E-Book)

Deploy, Task, Build Tools

"Build and deploy a React website quickly on Heroku."

"A CLI dashboard for your webpack dev server."

Create React App
"Create React apps with no build configuration."

"A continuous integration system built on AWS Lambda."

"Sits between npm and GitHub, observing all of the modules you depend on. When they get updated, your project gets a pull request with that update."

"The ideal starting app for React Native, best practices, generators, and more."

"Helps you modernize your old-fashioned code. It scans your code and finds the parts that can be converted to a newer version of ECMAScript."

"ServiceWorker that runs ES6 feature tests and transpiles the incoming application code as needed. Each tested feature can map to a Babel plugin."

"One command to build your React frontend."

70 JavaScript and DOM Tips for $5 (EPUB, MOBI, PDF)

The Uncategorizables

"A peer-to-peer hypermedia protocol to make the web faster, safer, and more open."

"Give 7 billion people an instant physical address that can be used offline and decoded with low tech (pen & paper)."

"Turn a markdown document into an interactive tutorial."

"We're building the Standard Library of the Internet. Create scalable microservices in an instant, share with anyone."
"Allows you to create a free sharable design brief. No sign up required."

IP 2 Country
"IP Geolocation JSON API. IPv4 and IPv6 support."

"WordPress boilerplate with modern development tools, easier configuration, and an improved folder structure."

Type Network
"A new model for type design, development, licensing, and use. It was built in response to the often complex and ever-changing requirements of good typography and smart type users."

"A tool for programmatically verifying database backups."
384 Pages of CSS for $7 (PDF E-Book)

A Tweet for Thought

Trek Glowacki with a good reminder on the benefits of components.

Suggestions / Corrections

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...

This is what Amazon's homepage looked like when it was first launched. If that doesn't give you hope for your startup, I don't know what will.

Thanks to all for subscribing and reading!

Keep tooling,
Copyright © 2013 Web Tools Weekly, All rights reserved.

Email Marketing Powered by MailChimp