Web Tools Weekly
What a Tool!

Issue #361  (CSS Headers, JS Libs, Testing, Uncats)06/18/20


Advertisement
The New Tab Page You’ll Actually Use
Replace your web browser’s gratuitous new tab page with a minimal list of links, grouped and sorted how you like. A Fine Start is for fans of minimalism and nice typography.
Get it for Chrome and Firefox
A Fine Start

One of the quirkiest front-end tricks I've stumbled upon recently is the ability to add CSS to any webpage using HTTP Headers. Unfortunately, this technique is supported only in Firefox (and potentially in some really old browsers), but it's kind of cool because you can basically make it appear that a web page is styled without a linked stylesheet. I went into detail on how to do this in a post on my main website a short time ago:

That post also provides a basic introduction to custom HTTP headers. If you want to peek under the hood, you can view the demo page here. Again, this only works in Firefox as far as I know.

And in case you missed it a few weeks back, David Flanagan has released the long-awaited 7th edition of his book JavaScript: The Definitive Guide. It's well worth another mention because if you're somewhat new to or even at an intermediate level with JavaScript, this is a must-have resource for ongoing learning that includes new features added starting with ES6.
 
JavaScript: The Definitive Guide
JavaScript: The Definitive Guide, 7th Edition


Now on to this week's tools!
 

JavaScript Libraries and Frameworks

The New Tab Page You’ll Actually Use
The minimal new tab page you’ll actually use. Chrome and Firefox extensions available. sponsored 

Reveal.js
A framework for creating full-featured presentations in a web browser. This is an old project that's still getting updates, now at version 4+.

htmx
Successor to Intercooler.js (details). Allows you to access Ajax, WebSockets, and Server Sent Events using HTML attributes, to build modern UIs with the simplicity and power of hypertext.

Deravel
MVC web application framework. Like Laravel but for Deno. Currently a work in progress.

FormatJS
A modular collection of JavaScript libraries for internationalization, focused on formatting numbers, dates, and strings for displaying to people.

Grandjs
A back-end framework for web apps based on Node. Useful if you don't want you to use Express.js along with a slew of packages.

Quantum JavaScript
A quantum circuit simulator, drag-and-drop circuit editor, and powerful JavaScript library that runs in your web browser.

AriJS
A framework that originated from trying to avoid virtual DOM diffing, but instead updating only the elements that changed, somewhat similar to Svelte, but without compilation.

Blitz.js
A full-stack React framework built on Next.js and inspired by Ruby on Rails.

Vidact
A compiler that converts React-compatible code to vanilla JavaScript with no virtual DOM.

ts-toolbelt
A collection of useful type utilities for higher type safety in TypeScript.

Alpine
A rugged, minimal framework for composing JavaScript behavior in your markup. Offers the reactive and declarative nature of big frameworks like Vue or React but at a much lower cost.

Testing and Debugging Tools

Ace
An accessibility checker for EPUB, developed by the DAISY Consortium, to assist with the evaluation of accessibility features of EPUB publications.

BugVilla
Universal bug tracker that allows team members to collaborate, discuss and kill bugs effectively. Multiple front-end and back-end technologies supported.

toast.log
Be aware of errors, warnings, and logs without having to open the browser's console, but instead via toast notifications.

Puppeteer Go
Simple utility to help quickly script puppeteer programs. All it does is load a URL and then let you run a function against the page once it's loaded.

Clinic.js
Open source suite of tools to help diagnose and pinpoint Node.js performance issues.

Jest
Now at version 26. A JavaScript testing framework with a focus on simplicity. Works with projects using Babel, TypeScript, Node, React, Angular, Vue, and more.

Sa11y
An accessibility quality assurance tool that visually highlights common accessibility and usability issues. Geared towards content authors, Sa11y indicates errors or warnings at the source with a simple tooltip on how to fix.

Perfume.js
A tiny, web performance monitoring library that reports field data back to your favorite analytics tool.

Glow
Adds pretty-printed code highlighting and a few other features to errors displayed using Flow.js, the popular static type checker.

Headless Testing
Run your Puppeteer and Playwright tests on headless instances in the cloud.

Testim.io
An automated testing tool that delivers super-fast authoring and amazingly stable tests. Tests can be run coded, codeless, or both.

The Uncategorizables

Tech Productivity
A brief weekly newsletter for tech professionals. Features articles, tips, and tools for improved productivity.   promoted

Geoipify
A robust GeoIP lookup API so you can track and serve your customer better.

Stacker
Turn your spreadsheets into applications. Lets you create digital tools to engage your customers, partners, and team, powered by the data in your Airtable or Google Sheets.

Spider
The easiest tool to scrape the internet. Simply point and click to turn websites into organized data and download them as JSON/CSV. No coding or configuration required.

ScreenToVideo
A powerful screen recorder and video editor.

222
Bookmarklet that's 222 bytes of JavaScript to convert any website to dark mode.

NoDesign.dev
A collection of tools for developers who have little to no artistic talent.

Dokz
Builds an awesome documentation website around your Markdown documents, using Next.js and MDX.

CoderNotes
A platform for your code snippets and general notes with a Google-like search systems that lets you easily find snippets again later.

macos-virtualbox
A Bash script that creates a macOS virtual machine guest on VirtualBox with unmodified macOS installation files downloaded directly from Apple servers. Tested on Cygwin. Works on macOS, Windows Subsystem for Linux, and CentOS 7.

A Tweet for Thought

I'm almost positive nearly every one of you has seen the blinking white guy meme. This Tweet's clip explains its origin. For some reason I always thought it was a celebrity clip, but apparently he's just some unknown podcaster.
 

Send Me Your Tools!

Made something? Send links via Direct Message on 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 might be a bit of an overstate, but here's a 1964 video of British science fiction writer Arthur C. Clarke predicting the internet.

Thanks to all for subscribing and reading!

Keep tooling,
Louis
webtoolsweekly.com
@LouisLazaris