This weekly digest contains a lot of interesting and inspiring articles, videos, tweets, podcasts, and designs I consumed during this week.
Interesting articles to read
Measuring Gatsby projects build time using paid plans of popular static website hosting platforms
Jamstack is showing rapid growth these days. We get more and more tools and frameworks for it almost every month, bringing a new life for the concept of static sites generation.
Kitty has been having fun with Advent of Code
recently. A few of the problems required some more advanced data structures than what JavaScript natively provides, such as linked lists, double-ended queues and circular arrays.
New in Chrome 98: Per-element opt-out for auto-dark, COLRv1, and more!
Chrome 98 is rolling out now! If you’ve signed up for the Auto Dark Theme Origin Trial, there’s a new way to opt out at a per element level. There’s now support for COLRv1, an evolution of the COLRv0 font format. And there’s plenty more.
The Fetch API has officially made its way into Node.js giving web developers a better default tool for making HTTP requests. Learn why this feature is a big deal and with it means for NPM packages like Axios.
Find and fix dangling files and unused dependencies in your JavaScript projects.
unimported
Find unused source files in javascript / typescript projects.
While adding new code to our projects, we might forget to remove the old code. Linters warn us for unused code in a module, but they fail to report unused files.
unimported analyzes your code by following the require/import statements starting from your entry file.
The result is a report showing which files are unimported, which dependencies are missing from your package.json, and which dependencies can be removed from your package.json.
Usage
Run the following command in the root of your project (next to package.json). The result will be as shown under example
npx unimported
When running unimported from a directory that doesn't contain a package.json, it will run from the first parent directory that does. To override this behavior, and run from an alternative work directory, use the [cwd] positional argument:
Highly customizable library for building interactive node-based UIs, editors, flow charts and diagrams
React Flow is a library for building node based graphs. You can easily implement custom node types and it comes with components like a mini map and graph controls. Feel free to check out the examples or read the blog post to get started.
👉 Next Major Release 👈
We are currently working on the next version. You can find the installation instructions and breaking changes in this PR. Your feedback is highly appreciated :)
Free and open fair-code licensed node based Workflow Automation Tool. Easily automate tasks across different services.
n8n - Workflow Automation Tool
n8n is an extendable workflow automation tool. With a fair-code distribution model, n8n will always have visible source code, be available to self-host, and allow you to add your own custom functions, logic and apps. n8n's node-based approach makes it highly versatile, enabling you to connect anything to everything.
Demo
📺 A short demo (< 3 min) which shows how to create a simple workflow which
automatically sends a new Slack notification every time a Github repository
received or lost a star.
Available integrations
n8n has 200+ different nodes to automate workflows. The list can be found on: https://n8n.io/nodes
In this episode of Syntax, Scott and Wes review your portfolios and websites including some from Harryxli, Austin Baird, Jacks Portfolio, and more!
CodePen Radio
Louis Hoebregts (aka Mamboleoo) has been creating wonderfully creative Pens on CodePen for many years. His early work, as we learn on this episode, was inspired by the CSS trickery of Lea Verou!
Thank you for reading, talk to you next week, and stay safe! 👋
](https://res.cloudinary.com/practicaldev/image/fetch/s--3Qd3tJSC--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://cdn.dribbble.com/users/26642/screenshots/17441096/media/26a4f96f02480722d58d2159001b2c56.png)
](https://res.cloudinary.com/practicaldev/image/fetch/s--5pBPWH3q--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://cdn.dribbble.com/users/1392449/screenshots/17440275/media/31d82e1ee72bc17ff3e0d4d2b87ec27c.png)
](https://res.cloudinary.com/practicaldev/image/fetch/s--Bgn3IsZM--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://cdn.dribbble.com/users/8915529/screenshots/17441592/media/67d65d110034c27a84a9a100d3c43c1a.png)
