👀 How to Build a Drag-and-Drop Kanban Board

A complete screencast walkthrough of using React to build a Trello-like app based around the familiar Kanban board pattern. It also serves as an introduction to the dnd-kit drag-and-drop toolkit.

KLITON BARE

📌 Issue 29 / 09.08.2023


📄 npmgraph: A Way to Visualize Dependency Graphs

Give this Web-based tool one or more package names (or a package.json of your own) and you can see a visualization of the dependency graphs for those packages, including where they intersect. Packages can be colored by various criteria (such as number of maintainers) and you can download a SVG of the resulting graphs to paste into your reports and presentations if you like scaring people that way. There’s a lot more to this tool than meets the eye so have a play.

KIEFFER, BRIGANTE, ET AL.


📄 A Compilation of Outstanding JS Testing Articles

Since we’re taking a couple of weeks off, you might be keen to have some Node related reading stacked up, and Yoni delivers with his opinionated list of 10 outstanding testing articles, all with a Node slant to them. He also mentions his own list of JavaScript and Node.js Testing Best Practices which is worth revisiting too.

YONI GOLDBERG


©️NODE.JS WEEKLY

💿 Macintosh.js: A Virtual Macintosh Running via Electron

An impressive virtual machine emulating a 1991 Macintosh Quadra 900 with System 8, all running in Electron. We linked to this several years ago but it’s had some updates since then and runs faster than before. As well as a few games, such as Oregon Trail, there are a variety of apps pre-installed, including a trial of Adobe Photoshop 3 which starts up faster than my real Photoshop now.. (Download necessary since it's an Electron app and all..)

FELIX RIESEBERG, APPLE, ET AL.

📌 Issue 30 / 11.08.2023


📄 My Experience Modernizing Packages to ESM

What a post! Mark, well known for his work on React, Redux, and much more, details the painful experiences and hard-earned lessons he picked up while migrating the Redux packages to ES modules.

MARK 'ACEMARKE' ERIKSON


📄 Things You Forgot (or Never Knew) Because of React

“I’ve written before about how React is the new default frontend framework, and how I don’t think most people using React on a regular basis realize quite how much it’s fallen behind.” High level thoughts about the React ‘bubble’ and some reasons to look beyond it, including a round up of some of the alternative options.

JOSH COLLINSWORTH


©️JS WEEKLY

🕯 Size Limit 8.2: JavaScript Performance Budgeting Tool

Calculate the real ‘cost’ to run your JS app or lib and maintain an eye on performance and raise the alarm (in your CI system, say) when things go awry. Supports ES modules and tree shaking.

ANDREY SITNIK

➡️ Typograms: A Way to Render ASCII Diagrams More Elegantly

An intriguing project where you ‘draw’ diagrams in plain ASCII text within special script tags and these get rendered into much nicer looking versions. An interesting approach if Mermaid is too full on for your needs.

SAM GOTO / GOOGLE

➡️ Creating a Screen + Camera Recorder with the Document Picture-in-Picture API

This is more powerful than I was expecting. You can basically record a screencast using browser APIs. In Chrome, at least.

SÉBASTIEN JALLIFFIER VERNE