Web Tools #407 - Webpack, Frameworks, Testing, JS Utils

Advertisement

I've never really been a super-expert when it comes to bundling tools, task runners, or similar tooling. I've used Grunt and Gulp for doing simple stuff like minifying files and cache busting and I've recently also gotten into some more modern options that are popular in the community.

As you've noticed, the industry has moved away from straight task runners to what we refer to now as module bundlers. Two of the most popular ones over the past few years are Parcel.js and webpack.

In a previous issue I had briefly mentioned that I wrote a beginner's tutorial on Parcel.js, over on CodeinWP. Following up on that, I recently (finally!) delved into webpack and I wrote up a pretty easy to follow introductory article on that super-popular bundler:

Now on to this week's tools!

Front-end Frameworks

The Key to a Healthy Lifestyle
Noom is not a diet – it's a personalized program designed to create sustainable weight loss and behavior change. You'll partner with a Noom specialist, who is trained in psychology and will help you create a personalized action plan based on your goals, current progress, and individual life circumstances.  sponsored 

tailwind-dashboard-template
A free admin dashboard template built on top of Tailwind CSS and fully coded in React.

DevUI
An open-source front-end component library, icon set, admin template, and more for enterprise-level apps.

Inkline
A customizable Vue UI/UX library with a consistent and expressive API, designed for creating flawless responsive web apps.

nine4
A set of three free templates with a CC v1.0 license, built with Next.js and Tailwind.

Soft UI Dashboard
An innovative Bootstrap 5 dashboard template with numerous full-coded elements and components.

full-stack-ethereum
An opinionated full-stack starter for building Ethereum apps (the starter kit goes along with a tutorial linked in the repo).

node-express-boilerplate
A boilerplate for building production-ready RESTful APIs using Node.js, Express, and Mongoose.

Flatlogic
Beautifully designed web and mobile application templates built with React, Vue, Angular, React Native, and Bootstrap.

volt-react-dashboard
A React admin dashboard template and UI library based on Bootstrap 5.

VueTailwind
Open-source collection of fully responsive and beautiful HTML components made with Vue and Tailwind.

Ream
A framework for building server-rendered or statically-generated web apps in Vue 3, heavily inspired by Next.js and SvelteKit.

Podium
An easy to use server-side composition library for building apps using the microfrontends architecture pattern.
 

Testing and Debugging Tools

Run Linux Software Faster and Safer with Unikernels
Easily run unikernels today with free / open source. Build your first unikernel in minutes!  sponsored 

git-split-diffs
GitHub-style split diffs with syntax highlighting in your terminal.

Monito
Not free. A browser extension that records everything happening in a web app so you can find bugs and generate test reports.

Backlink Checker
Enter a URL to find all backlinks to a page, useful for SEO and related testing and optimization.

Lighthouse Metrics
Provides Lighthouse metrics for a web page by running tests from multiple locations for a more accurate global performance check.

Thunder Client
VS Code extension. A hand-crafted lightweight REST client for testing APIs.

Prism
An open-source HTTP mock and proxy server. Accelerate API development with realistic mock servers, powered by OpenAPI documents.

Style Check
Import a CSS library or choose from the selected options and this page will show you the effects of that library on all HTML elements.

Shapecatcher
Draw something in the box and this tool will help you to find unicode characters that closely match what you drew.

DeepSource
Automatic code analysis tool to help you find bugs, fix security flaws, and more, with a decent free plan.

On the Release Radar:

• Yellow Lab Tools - Perf testing tool at version 2+
• Cypress - JS testing framework now at version 7+

JavaScript Utilities

Run Linux Software Faster and Safer with Unikernels
Easily run unikernels today with free / open source. Build your first unikernel in minutes!  sponsored 

MathicallJS
A fast JavaScript math library designed for simulation and data processing.

Necktie
A simple DOM binding tool that binds your logic to DOM elements in an easy way, taking its powers from document.querySelector and MutationObserver capabilities.

Combine-Promises
Like Promise.all(array) but with an object instead of an array.

WinBox.js
A customizable and dependency-free library for creating apps with windows – kind of like modals, but with more of a similarity to OS window functionality.
 
betterator
A better sync and async iterator API.

Poulette
A proof of concept for a color mixer interface.

unctx
A utility to allow you to easily implement a Vue-like Composition API pattern in your vanilla JavaScript projects.

movy.js
An easy-to-use animation engine based on Three.js and GSAP.

Steno
A specialized fast async file writer that makes it fast and safe to write to the same file often/concurrently.

grfn
A tiny (~400B) utility that executes a dependency graph of async functions as concurrently as possible.

next-mdx
A fast and TypeScript-ready set of helper functions for fetching and rendering local MDX files that handles relational data and supports custom components.

p5i
p5.js, but with more friendly instance mode APIs.
 

A Tweet for Thought

If you like Dad-joke style humour, you'll enjoy this response to Bill and Melinda Gates's latest news.

 

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

If you want nostalgia with the benefits of modern technology, you'll want to check out the Open Source Rotary Cellphone.

Thanks to everyone for subscribing and reading!

Keep tooling,
Louis
@WebToolsWeekly

Support this newsletter:
PayPal.me  /  Patreon / GitHub Sponsors  /  E-Books