Issue #328 (Front-end Frameworks, Testing Tools, JS Utilities)
By the time this issue arrives in your inbox, I'll be just about to return from a vacation overseas, so this intro won't have anything special in terms of tips or coding.
As always, I appreciate everyone's support in helping this newsletter stay afloat and there's even been some decent subscriber growth in my other weekly newsletter Tech Productivity, which I have a lot of fun doing because it helps me find some really interesting articles on teams, remote work, success, and so forth. So check it out if you haven't done so already – it's always a brief newsletter (10 links maximum).
I'll be back with a regular intro next week, but in the mean time, enjoy the usual awesome weekly list of tools!
React Bootstrap with Material Design
400+ material UI elements, 600+ material icons, 70+ CSS animations, Sass files, and more. Fully responsive and cross-browser.
Now at version 2+. A strong, independent CSS Framework. Only 2.7KB minified and gzipped.
A list of themes and starters for JAMstack sites.
Modern CSS reset
A bare-bones CSS reset for modern web development.
The full-stack React+GraphQL framework.
Open source high quality dashboard based on Bootstrap 4 and React 16.
Nice Boys™️ Product Boilerplate
Quickly ship your apps with the power of code generation. A personal setup toolset from Brian Lovin and Max Stoiber (aka "Nice Boys").
Now at version 1+ (Beta). A minimal and fast library for functional user interfaces
Now at version 3.6. Official site for the Atomic CSS methodology, which includes Atomizer, the tool for building sites with Atomic CSS.
Testing and Debugging Tools
Tech Productivity Newsletter
A brief weekly newsletter featuring productivity tools, articles, and resources for tech pros. promoted
Website Speed Test
Find out how much overhead your ad implementation adds to your website.
A suite of beautiful and open-source tools for debugging, testing and building with HTTP(S), on Windows, Linux, and Mac.
Live DOM Viewer
Visualizes the DOM based on entered HTML. Might be useful for testing how a browser is supposed to handled malformed HTML.
Refactor TypScript code programmatically using codemods.
A debug module that helps capture the debug context, plus object tracing information to help you better vizualise debug output.
A testing suite built specifically for Storybook (development environment and playground for UI components). It allows you to center both your development and testing around the stories you're already writing.
Development helper for inspecting and opening Svelte components in your editor.
Custom jest matchers to test the state of the DOM.
Plugin for stylelint (the CSS linter) with accessibility rules.
Detect the running environment and context of the current script.
Lightweight SQL query builder. Makes it easy to compose safe parameterized SQL queries using template literals.
Lightweight currency conversion library, successor of money.js.
Copy to clipboard functionality with no dependencies.
Allows you to read/write a sequence of data values (aka, a queue) asynchronously, similar to streams or observables. But any data/event that is still pending can be revoked.
Now at version 2+. An HTML5 saveAs() FileSaver implementation.
An auto-suggest component with accessibility and flexible styling.
Makes WebWorkers enjoyable. A tiny library (1.1kB) that removes the mental barrier of thinking about postMessage and hides the fact that you are working with workers.
A Tweet for Thought
How AI products actually work.
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...
CJSS is an interesting experiment. It's a library that you can include in your page and then build your entire page using just CSS. Not recommended for real use, but interesting to poke around the code.
Thanks to all for subscribing and reading!