Stay ahead in web development: latest news, tools, and insights #39
Tags: webdev, weeklyfoo, javascript, node
Published: 2024-07-01 05:29:31


weeklyfoo #39 is here: your weekly digest of all webdev news you need to know! This time you'll find 52 valuable links in 6 categories! Enjoy!
## 🚀 Read it!

- <a href="https://blog.frankmtaylor.com/2024/06/20/a-rant-about-front-end-development/?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vYmxvZy5mcmFua210YXlsb3IuY29tLzIwMjQvMDYvMjAvYS1yYW50LWFib3V0LWZyb250LWVuZC1kZXZlbG9wbWVudC8iLCJwcm9qZWN0Ijoid2Vla2x5Zm9vIiwiaW5kZXgiOjM5LCJzZWN0aW9uIjoicmVhZEl0Iiwic291cmNlIjoid2ViIn19">A Rant about Front-end Development</a>: Such an entertaining read!<small> / </small><small>*engineering*</small><small> / </small><small>42 min read</small>
- <a href="https://melkat.blog/p/unsafe-pricing?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vbWVsa2F0LmJsb2cvcC91bnNhZmUtcHJpY2luZyIsInByb2plY3QiOiJ3ZWVrbHlmb28iLCJpbmRleCI6MzksInNlY3Rpb24iOiJyZWFkSXQiLCJzb3VyY2UiOiJ3ZWIifX0%3D">Unsafe Pricing at Any Scale</a>: Especially the part about blocking AI bots is a mandatory read!<small> / </small><small>*serverless*</small><small> / </small><small>4 min read</small>
- <a href="https://htmx.org/essays/htmx-sucks/?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vaHRteC5vcmcvZXNzYXlzL2h0bXgtc3Vja3MvIiwicHJvamVjdCI6IndlZWtseWZvbyIsImluZGV4IjozOSwic2VjdGlvbiI6InJlYWRJdCIsInNvdXJjZSI6IndlYiJ9fQ%3D%3D">htmx sucks</a>: Such a great read!<small> / </small><small>*htmx*</small><small> / </small><small>10 min read</small>


<Hr />

## 📰 Good to know

- <a href="https://sunsetglow.net/posts/frontend-build-systems.html?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vc3Vuc2V0Z2xvdy5uZXQvcG9zdHMvZnJvbnRlbmQtYnVpbGQtc3lzdGVtcy5odG1sIiwicHJvamVjdCI6IndlZWtseWZvbyIsImluZGV4IjozOSwic2VjdGlvbiI6Imdvb2RUb0tub3ciLCJzb3VyY2UiOiJ3ZWIifX0%3D">Exposition of Frontend Build Systems</a>: Overview of modern tooling around frontend builds.<small> / </small><small>*ci*</small><small> / </small><small>15 min read</small>
- <a href="https://blog.codepipes.com/testing/code-coverage.html?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vYmxvZy5jb2RlcGlwZXMuY29tL3Rlc3RpbmcvY29kZS1jb3ZlcmFnZS5odG1sIiwicHJvamVjdCI6IndlZWtseWZvbyIsImluZGV4IjozOSwic2VjdGlvbiI6Imdvb2RUb0tub3ciLCJzb3VyY2UiOiJ3ZWIifX0%3D">Getting 100% code coverage doesn't eliminate bugs</a>: TL;DR - Getting 100% coverage on a project doesn’t mean you have zero bugs. Here is an extreme example to prove it.<small> / </small><small>*tests*</small><small> / </small><small>5 min read</small>
- <a href="https://blog.znote.io/2024/side-hustle-journey/?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vYmxvZy56bm90ZS5pby8yMDI0L3NpZGUtaHVzdGxlLWpvdXJuZXkvIiwicHJvamVjdCI6IndlZWtseWZvbyIsImluZGV4IjozOSwic2VjdGlvbiI6Imdvb2RUb0tub3ciLCJzb3VyY2UiOiJ3ZWIifX0%3D">How my weekend project turned into a 3 years journey</a>: Nice read about an idea that started to rise.<small> / </small><small>*znote*, *startups*</small><small> / </small><small>7 min read</small>
- <a href="https://developer.mozilla.org/en-US/blog/javascript-set-methods/?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vZGV2ZWxvcGVyLm1vemlsbGEub3JnL2VuLVVTL2Jsb2cvamF2YXNjcmlwdC1zZXQtbWV0aG9kcy8iLCJwcm9qZWN0Ijoid2Vla2x5Zm9vIiwiaW5kZXgiOjM5LCJzZWN0aW9uIjoiZ29vZFRvS25vdyIsInNvdXJjZSI6IndlYiJ9fQ%3D%3D">New JavaScript Set methods</a>: New JavaScript Set methods are arriving! Since Firefox 127, these methods are available in most major browser engines, which means you won't need a polyfill to make them work everywhere.<small> / </small><small>*javascript*</small><small> / </small><small>14 min read</small>
- <a href="https://tonsky.me/blog/crdt-filesync/?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vdG9uc2t5Lm1lL2Jsb2cvY3JkdC1maWxlc3luYy8iLCJwcm9qZWN0Ijoid2Vla2x5Zm9vIiwiaW5kZXgiOjM5LCJzZWN0aW9uIjoiZ29vZFRvS25vdyIsInNvdXJjZSI6IndlYiJ9fQ%3D%3D">Local, first, forever</a>: Thinking about a persistence service that stays longer than the average service.<small> / </small><small>*local-first*</small><small> / </small><small>6 min read</small>
- <a href="https://holtwick.de/en/blog/localfirst-resilient-sync?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vaG9sdHdpY2suZGUvZW4vYmxvZy9sb2NhbGZpcnN0LXJlc2lsaWVudC1zeW5jIiwicHJvamVjdCI6IndlZWtseWZvbyIsImluZGV4IjozOSwic2VjdGlvbiI6Imdvb2RUb0tub3ciLCJzb3VyY2UiOiJ3ZWIifX0%3D">Resilient Sync for Local First</a>: Syncing data in a local first context is not trivial but manageable.<small> / </small><small>*local-first*</small><small> / </small><small>8 min read</small>
- <a href="https://danilafe.com/blog/blog_microfeatures/?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vZGFuaWxhZmUuY29tL2Jsb2cvYmxvZ19taWNyb2ZlYXR1cmVzLyIsInByb2plY3QiOiJ3ZWVrbHlmb28iLCJpbmRleCI6MzksInNlY3Rpb24iOiJnb29kVG9Lbm93Iiwic291cmNlIjoid2ViIn19">Microfeatures I Love in Blogs and Personal Websites</a>: Sidenotes, TOC, reading progress - lots of things I never considered. But it's worth thinking about integrating some of them.<small> / </small><small>*blogs*</small><small> / </small><small>19 min read</small>
- <a href="https://collabfund.com/blog/useful-and-overlooked-skills/?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vY29sbGFiZnVuZC5jb20vYmxvZy91c2VmdWwtYW5kLW92ZXJsb29rZWQtc2tpbGxzLyIsInByb2plY3QiOiJ3ZWVrbHlmb28iLCJpbmRleCI6MzksInNlY3Rpb24iOiJnb29kVG9Lbm93Iiwic291cmNlIjoid2ViIn19">Useful and Overlooked Skills</a>: On his way to be sworn in as the most powerful man in the world, Franklin Delano Roosevelt had to be lifted out of his car and carried up the stairs.<small> / </small><small>*career*</small><small> / </small><small>6 min read</small>
- <a href="https://blog.platformatic.dev/nodejs-is-here-to-stay?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vYmxvZy5wbGF0Zm9ybWF0aWMuZGV2L25vZGVqcy1pcy1oZXJlLXRvLXN0YXkiLCJwcm9qZWN0Ijoid2Vla2x5Zm9vIiwiaW5kZXgiOjM5LCJzZWN0aW9uIjoiZ29vZFRvS25vdyIsInNvdXJjZSI6IndlYiJ9fQ%3D%3D">Node.js is Here to Stay</a>: A deep dive into the metrics<small> / </small><small>*node*</small><small> / </small><small>15 min read</small>
- <a href="https://slack.engineering/catching-compromised-cookies/?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vc2xhY2suZW5naW5lZXJpbmcvY2F0Y2hpbmctY29tcHJvbWlzZWQtY29va2llcy8iLCJwcm9qZWN0Ijoid2Vla2x5Zm9vIiwiaW5kZXgiOjM5LCJzZWN0aW9uIjoiZ29vZFRvS25vdyIsInNvdXJjZSI6IndlYiJ9fQ%3D%3D">Catching Compromised Cookies</a>: How we automatically detect stolen session cookies<small> / </small><small>*slack*, *sessions*</small><small> / </small><small>14 min read</small>
- <a href="https://www.haskellforall.com/2024/06/my-spiciest-take-on-tech-hiring.html?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vd3d3Lmhhc2tlbGxmb3JhbGwuY29tLzIwMjQvMDYvbXktc3BpY2llc3QtdGFrZS1vbi10ZWNoLWhpcmluZy5odG1sIiwicHJvamVjdCI6IndlZWtseWZvbyIsImluZGV4IjozOSwic2VjdGlvbiI6Imdvb2RUb0tub3ciLCJzb3VyY2UiOiJ3ZWIifX0%3D">My spiciest take on tech hiring</a>: ...is that you only need to administer one technical interview and one non-technical interview (each no more than an hour long).<small> / </small><small>*career*, *hiring*</small><small> / </small><small>10 min read</small>
- <a href="https://sansec.io/research/polyfill-supply-chain-attack?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vc2Fuc2VjLmlvL3Jlc2VhcmNoL3BvbHlmaWxsLXN1cHBseS1jaGFpbi1hdHRhY2siLCJwcm9qZWN0Ijoid2Vla2x5Zm9vIiwiaW5kZXgiOjM5LCJzZWN0aW9uIjoiZ29vZFRvS25vdyIsInNvdXJjZSI6IndlYiJ9fQ%3D%3D">Polyfill supply chain attack hits 100K+ sites</a>: The new Chinese owner of the popular Polyfill JS project injects malware into more than 100 thousand sites.<small> / </small><small>*security*</small><small> / </small><small>6 min read</small>
- <a href="https://www.bennadel.com/blog/4669-exploring-randomness-in-javascript.htm?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vd3d3LmJlbm5hZGVsLmNvbS9ibG9nLzQ2NjktZXhwbG9yaW5nLXJhbmRvbW5lc3MtaW4tamF2YXNjcmlwdC5odG0iLCJwcm9qZWN0Ijoid2Vla2x5Zm9vIiwiaW5kZXgiOjM5LCJzZWN0aW9uIjoiZ29vZFRvS25vdyIsInNvdXJjZSI6IndlYiJ9fQ%3D%3D">Exploring Randomness In JavaScript</a>: Math.random() and Crypto.getRandomValues() compared.<small> / </small><small>*random*</small><small> / </small><small>1 min read</small>
- <a href="https://kmcd.dev/posts/grpc-the-bad-parts/?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8va21jZC5kZXYvcG9zdHMvZ3JwYy10aGUtYmFkLXBhcnRzLyIsInByb2plY3QiOiJ3ZWVrbHlmb28iLCJpbmRleCI6MzksInNlY3Rpb24iOiJnb29kVG9Lbm93Iiwic291cmNlIjoid2ViIn19">gRPC - The Bad Parts</a>: Downsides of gRPC<small> / </small><small>*grpc*</small><small> / </small><small>9 min read</small>
- <a href="https://knowler.dev/blog/maintaining-dotfiles?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8va25vd2xlci5kZXYvYmxvZy9tYWludGFpbmluZy1kb3RmaWxlcyIsInByb2plY3QiOiJ3ZWVrbHlmb28iLCJpbmRleCI6MzksInNlY3Rpb24iOiJnb29kVG9Lbm93Iiwic291cmNlIjoid2ViIn19">Maintaining dotfiles</a>: Will definitely try out this bare repo method.<small> / </small><small>*git*, *dotfiles*</small><small> / </small><small>4 min read</small>


<Hr />

## 🧰 Tools

- <a href="https://www.notionavatarmaker.com/?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vd3d3Lm5vdGlvbmF2YXRhcm1ha2VyLmNvbS8iLCJwcm9qZWN0Ijoid2Vla2x5Zm9vIiwiaW5kZXgiOjM5LCJzZWN0aW9uIjoidG9vbHMiLCJzb3VyY2UiOiJ3ZWIifX0%3D">Notion Avatar Maker</a>: A Notion Avatar is a personalized avatar that aligns with the design style of Notion, a widely-used note-taking and organization tool platform.<small> / </small><small>*avatars*</small>
- <a href="https://github.com/TomaszRewak/js-spread-grid?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vZ2l0aHViLmNvbS9Ub21hc3pSZXdhay9qcy1zcHJlYWQtZ3JpZCIsInByb2plY3QiOiJ3ZWVrbHlmb28iLCJpbmRleCI6MzksInNlY3Rpb24iOiJ0b29scyIsInNvdXJjZSI6IndlYiJ9fQ%3D%3D">SpreadGrid</a>: JS library for creating high-performance grid-based applications<small> / </small><small>*grids*</small>
- <a href="https://github.com/anthropics/anthropic-sdk-typescript?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vZ2l0aHViLmNvbS9hbnRocm9waWNzL2FudGhyb3BpYy1zZGstdHlwZXNjcmlwdCIsInByb2plY3QiOiJ3ZWVrbHlmb28iLCJpbmRleCI6MzksInNlY3Rpb24iOiJ0b29scyIsInNvdXJjZSI6IndlYiJ9fQ%3D%3D">Anthropic TypeScript API Library</a>: Access to Anthropic's safety-first language model APIs<small> / </small><small>*sdk*, *anthropic*</small>
- <a href="https://maneken.app/?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vbWFuZWtlbi5hcHAvIiwicHJvamVjdCI6IndlZWtseWZvbyIsImluZGV4IjozOSwic2VjdGlvbiI6InRvb2xzIiwic291cmNlIjoid2ViIn19">Maneken</a>: The browser powered mockup editor<small> / </small><small>*mockups*, *images*</small>
- <a href="https://github.com/sxyazi/yazi?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vZ2l0aHViLmNvbS9zeHlhemkveWF6aSIsInByb2plY3QiOiJ3ZWVrbHlmb28iLCJpbmRleCI6MzksInNlY3Rpb24iOiJ0b29scyIsInNvdXJjZSI6IndlYiJ9fQ%3D%3D">Yazi</a>: Blazing Fast Terminal File Manager<small> / </small><small>*cli*</small>
- <a href="https://github.com/ekzhang/rushlight?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vZ2l0aHViLmNvbS9la3poYW5nL3J1c2hsaWdodCIsInByb2plY3QiOiJ3ZWVrbHlmb28iLCJpbmRleCI6MzksInNlY3Rpb24iOiJ0b29scyIsInNvdXJjZSI6IndlYiJ9fQ%3D%3D">Rushlight</a>: Real-time collaborative code editing on your own infrastructure<small> / </small><small>*editors*</small>
- <a href="https://github.com/alexcambose/custom-cache-decorator?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vZ2l0aHViLmNvbS9hbGV4Y2FtYm9zZS9jdXN0b20tY2FjaGUtZGVjb3JhdG9yIiwicHJvamVjdCI6IndlZWtseWZvbyIsImluZGV4IjozOSwic2VjdGlvbiI6InRvb2xzIiwic291cmNlIjoid2ViIn19">Cache Decorator</a>: A TypeScript library providing a customizable cache decorator for methods. This library allows you to easily cache method results with configurable caching mechanisms.<small> / </small><small>*cache*</small>
- <a href="https://github.com/dotenvx/dotenvx?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vZ2l0aHViLmNvbS9kb3RlbnZ4L2RvdGVudngiLCJwcm9qZWN0Ijoid2Vla2x5Zm9vIiwiaW5kZXgiOjM5LCJzZWN0aW9uIjoidG9vbHMiLCJzb3VyY2UiOiJ3ZWIifX0%3D">dotenvx</a>: a better dotenv–from the creator of dotenv<small> / </small><small>*dotenv*</small>
- <a href="https://github.com/glasskube/glasskube?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vZ2l0aHViLmNvbS9nbGFzc2t1YmUvZ2xhc3NrdWJlIiwicHJvamVjdCI6IndlZWtseWZvbyIsImluZGV4IjozOSwic2VjdGlvbiI6InRvb2xzIiwic291cmNlIjoid2ViIn19">Glasskube</a>: The next generation Package Manager for Kubernetes<small> / </small><small>*k8s*, *kubernetes*</small>
- <a href="https://logoipsum.com/?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vbG9nb2lwc3VtLmNvbS8iLCJwcm9qZWN0Ijoid2Vla2x5Zm9vIiwiaW5kZXgiOjM5LCJzZWN0aW9uIjoidG9vbHMiLCJzb3VyY2UiOiJ3ZWIifX0%3D">Logoipsum</a>: 100 free placeholder logos<small> / </small><small>*images*</small>
- <a href="https://kaplayjs.com/?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8va2FwbGF5anMuY29tLyIsInByb2plY3QiOiJ3ZWVrbHlmb28iLCJpbmRleCI6MzksInNlY3Rpb24iOiJ0b29scyIsInNvdXJjZSI6IndlYiJ9fQ%3D%3D">Kaplay</a>: KAPLAY is a JavaScript library that helps you make games fast and fun!<small> / </small><small>*games*, *javascript*</small>
- <a href="https://github.com/junkdog/tachyonfx?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vZ2l0aHViLmNvbS9qdW5rZG9nL3RhY2h5b25meCIsInByb2plY3QiOiJ3ZWVrbHlmb28iLCJpbmRleCI6MzksInNlY3Rpb24iOiJ0b29scyIsInNvdXJjZSI6IndlYiJ9fQ%3D%3D">Tachyonfx</a>: shader-like effects library for ratatui applications<small> / </small><small>*cli*</small>
- <a href="https://github.com/pdfslick/pdfslick?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vZ2l0aHViLmNvbS9wZGZzbGljay9wZGZzbGljayIsInByb2plY3QiOiJ3ZWVrbHlmb28iLCJpbmRleCI6MzksInNlY3Rpb24iOiJ0b29scyIsInNvdXJjZSI6IndlYiJ9fQ%3D%3D">pdfslick</a>: View and Interact with PDFs in React SolidJS, Svelte and JavaScript apps<small> / </small><small>*pdf*</small>
- <a href="https://github.com/zheksoon/snapdrag?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vZ2l0aHViLmNvbS96aGVrc29vbi9zbmFwZHJhZyIsInByb2plY3QiOiJ3ZWVrbHlmb28iLCJpbmRleCI6MzksInNlY3Rpb24iOiJ0b29scyIsInNvdXJjZSI6IndlYiJ9fQ%3D%3D">Snapdrag</a>: A simple, lightweight, and performant drag and drop library for React and vanilla JS<small> / </small><small>*dnd*</small>
- <a href="https://github.com/i365dev/LetterDrop?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vZ2l0aHViLmNvbS9pMzY1ZGV2L0xldHRlckRyb3AiLCJwcm9qZWN0Ijoid2Vla2x5Zm9vIiwiaW5kZXgiOjM5LCJzZWN0aW9uIjoidG9vbHMiLCJzb3VyY2UiOiJ3ZWIifX0%3D">LetterDrop</a>: LetterDrop is a secure and efficient newsletter management service powered by Cloudflare Workers, enabling easy creation, distribution, and subscription management of newsletters.<small> / </small><small>*newsletters*</small>
- <a href="https://scroll.pub/blog/stamp.html?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vc2Nyb2xsLnB1Yi9ibG9nL3N0YW1wLmh0bWwiLCJwcm9qZWN0Ijoid2Vla2x5Zm9vIiwiaW5kZXgiOjM5LCJzZWN0aW9uIjoidG9vbHMiLCJzb3VyY2UiOiJ3ZWIifX0%3D">Stamp</a>: a mini-language for project templates<small> / </small><small>*cli*</small>
- <a href="https://refero.design/?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vcmVmZXJvLmRlc2lnbi8iLCJwcm9qZWN0Ijoid2Vla2x5Zm9vIiwiaW5kZXgiOjM5LCJzZWN0aW9uIjoidG9vbHMiLCJzb3VyY2UiOiJ3ZWIifX0%3D">Refero</a>: Explore real-world designs from the best products<small> / </small><small>*ux*</small>
- <a href="https://github.com/kciter/ascii-3d-renderer.js?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vZ2l0aHViLmNvbS9rY2l0ZXIvYXNjaWktM2QtcmVuZGVyZXIuanMiLCJwcm9qZWN0Ijoid2Vla2x5Zm9vIiwiaW5kZXgiOjM5LCJzZWN0aW9uIjoidG9vbHMiLCJzb3VyY2UiOiJ3ZWIifX0%3D">ascii-3d-renderer.js</a>: 3D Renderer using ASCII.<small> / </small><small>*ascii*, *3d*</small>
- <a href="https://marmelab.com/blog/2024/06/20/react-admin-v5.html?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vbWFybWVsYWIuY29tL2Jsb2cvMjAyNC8wNi8yMC9yZWFjdC1hZG1pbi12NS5odG1sIiwicHJvamVjdCI6IndlZWtseWZvbyIsImluZGV4IjozOSwic2VjdGlvbiI6InRvb2xzIiwic291cmNlIjoid2ViIn19">Introducing React-Admin V5</a>: React boilerplate app under MIT license.<small> / </small><small>*react*</small>
- <a href="https://github.com/mapbox/pixelmatch?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vZ2l0aHViLmNvbS9tYXBib3gvcGl4ZWxtYXRjaCIsInByb2plY3QiOiJ3ZWVrbHlmb28iLCJpbmRleCI6MzksInNlY3Rpb24iOiJ0b29scyIsInNvdXJjZSI6IndlYiJ9fQ%3D%3D">pixelmatch</a>: The smallest, simplest and fastest JavaScript pixel-level image comparison library<small> / </small><small>*images*</small>
- <a href="https://brm.io/matter-js/?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vYnJtLmlvL21hdHRlci1qcy8iLCJwcm9qZWN0Ijoid2Vla2x5Zm9vIiwiaW5kZXgiOjM5LCJzZWN0aW9uIjoidG9vbHMiLCJzb3VyY2UiOiJ3ZWIifX0%3D">matter.js</a>: Matter.js is a 2D physics engine for the web<small> / </small><small>*physics*</small>
- <a href="https://github.com/dorklyorg/dorkly/wiki?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vZ2l0aHViLmNvbS9kb3JrbHlvcmcvZG9ya2x5L3dpa2kiLCJwcm9qZWN0Ijoid2Vla2x5Zm9vIiwiaW5kZXgiOjM5LCJzZWN0aW9uIjoidG9vbHMiLCJzb3VyY2UiOiJ3ZWIifX0%3D">Dorkly</a>: Free Open Source Feature Flag system. Dorkly is a git-based open source feature flag backend for LaunchDarkly's open source SDKs.<small> / </small><small>*featureflags*</small>
- <a href="https://github.com/facebook/memlab?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vZ2l0aHViLmNvbS9mYWNlYm9vay9tZW1sYWIiLCJwcm9qZWN0Ijoid2Vla2x5Zm9vIiwiaW5kZXgiOjM5LCJzZWN0aW9uIjoidG9vbHMiLCJzb3VyY2UiOiJ3ZWIifX0%3D">MemLab</a>: A framework for finding JavaScript memory leaks and analyzing heap snapshots<small> / </small><small>*javascript*</small>
- <a href="https://github.com/danvergara/dblab?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vZ2l0aHViLmNvbS9kYW52ZXJnYXJhL2RibGFiIiwicHJvamVjdCI6IndlZWtseWZvbyIsImluZGV4IjozOSwic2VjdGlvbiI6InRvb2xzIiwic291cmNlIjoid2ViIn19">dblab</a>: The database client every command line junkie deserves.<small> / </small><small>*db*, *cli*</small>
- <a href="https://github.com/projectdiscovery/katana?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vZ2l0aHViLmNvbS9wcm9qZWN0ZGlzY292ZXJ5L2thdGFuYSIsInByb2plY3QiOiJ3ZWVrbHlmb28iLCJpbmRleCI6MzksInNlY3Rpb24iOiJ0b29scyIsInNvdXJjZSI6IndlYiJ9fQ%3D%3D">Katana</a>: A next-generation crawling and spidering framework.<small> / </small><small>*crawling*</small>
- <a href="https://github.com/openstatusHQ/openstatus?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vZ2l0aHViLmNvbS9vcGVuc3RhdHVzSFEvb3BlbnN0YXR1cyIsInByb2plY3QiOiJ3ZWVrbHlmb28iLCJpbmRleCI6MzksInNlY3Rpb24iOiJ0b29scyIsInNvdXJjZSI6IndlYiJ9fQ%3D%3D">OpenStatus</a>: The open-source synthetic & real user monitoring platform<small> / </small><small>*monitoring*</small>


<Hr />

## 🎨 Design

- <a href="https://goodpractices.design/articles/colour-contrast?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vZ29vZHByYWN0aWNlcy5kZXNpZ24vYXJ0aWNsZXMvY29sb3VyLWNvbnRyYXN0IiwicHJvamVjdCI6IndlZWtseWZvbyIsImluZGV4IjozOSwic2VjdGlvbiI6ImRlc2lnbiIsInNvdXJjZSI6IndlYiJ9fQ%3D%3D">Intro to colour contrast</a>: Colour contrast makes a big part of the user experience for all users. Accessibility guidelines however, are not always easy to follow. In this article we will see how to meet the requirements with practical examples.<small> / </small><small>*colors*</small><small> / </small><small>18 min read</small>
- <a href="https://bootcamp.uxdesign.cc/designing-profile-account-and-setting-pages-for-better-ux-345ef4ca1490?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vYm9vdGNhbXAudXhkZXNpZ24uY2MvZGVzaWduaW5nLXByb2ZpbGUtYWNjb3VudC1hbmQtc2V0dGluZy1wYWdlcy1mb3ItYmV0dGVyLXV4LTM0NWVmNGNhMTQ5MCIsInByb2plY3QiOiJ3ZWVrbHlmb28iLCJpbmRleCI6MzksInNlY3Rpb24iOiJkZXNpZ24iLCJzb3VyY2UiOiJ3ZWIifX0%3D">Designing profile, account, and setting pages for better UX</a>: Account vs Profile, and what content should be included.<small> / </small><small>*ux*</small><small> / </small><small>11 min read</small>


<Hr />

## 📚 Tutorials

- <a href="https://developer.mozilla.org/en-US/blog/securing-apis-express-rate-limit-and-slow-down/?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vZGV2ZWxvcGVyLm1vemlsbGEub3JnL2VuLVVTL2Jsb2cvc2VjdXJpbmctYXBpcy1leHByZXNzLXJhdGUtbGltaXQtYW5kLXNsb3ctZG93bi8iLCJwcm9qZWN0Ijoid2Vla2x5Zm9vIiwiaW5kZXgiOjM5LCJzZWN0aW9uIjoidHV0Iiwic291cmNlIjoid2ViIn19">Securing APIs - Express rate limit and slow down</a>: As soon as an API gets used more frequently, definitely something to consider.<small> / </small><small>*express*</small><small> / </small><small>11 min read</small>
- <a href="https://frontendmasters.com/blog/pure-css-circular-text-without-requiring-a-monospace-font/?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vZnJvbnRlbmRtYXN0ZXJzLmNvbS9ibG9nL3B1cmUtY3NzLWNpcmN1bGFyLXRleHQtd2l0aG91dC1yZXF1aXJpbmctYS1tb25vc3BhY2UtZm9udC8iLCJwcm9qZWN0Ijoid2Vla2x5Zm9vIiwiaW5kZXgiOjM5LCJzZWN0aW9uIjoidHV0Iiwic291cmNlIjoid2ViIn19">Pure CSS Circular Text (without Requiring a Monospace Font)</a>: There is no simple and obvious way to set text on a circle in CSS. Good news though! You can create a beautiful, colorful, and even rotating circular text with pure CSS. It just takes a bit of work and we’ll go over that here.<small> / </small><small>*css*</small><small> / </small><small>11 min read</small>
- <a href="https://frontendmasters.com/blog/popovers-work-pretty-nicely-as-slide-out-drawers/?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vZnJvbnRlbmRtYXN0ZXJzLmNvbS9ibG9nL3BvcG92ZXJzLXdvcmstcHJldHR5LW5pY2VseS1hcy1zbGlkZS1vdXQtZHJhd2Vycy8iLCJwcm9qZWN0Ijoid2Vla2x5Zm9vIiwiaW5kZXgiOjM5LCJzZWN0aW9uIjoidHV0Iiwic291cmNlIjoid2ViIn19">Popovers Work Pretty Nicely as Slide-Out Drawers</a>: Pretty nice and all with built-in APIs<small> / </small><small>*css*</small><small> / </small><small>6 min read</small>
- <a href="https://johnnyreilly.com/web-workers-comlink-vite-tanstack-query?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vam9obm55cmVpbGx5LmNvbS93ZWItd29ya2Vycy1jb21saW5rLXZpdGUtdGFuc3RhY2stcXVlcnkiLCJwcm9qZWN0Ijoid2Vla2x5Zm9vIiwiaW5kZXgiOjM5LCJzZWN0aW9uIjoidHV0Iiwic291cmNlIjoid2ViIn19">Web Workers, Comlink, Vite and TanStack Query</a>: Use case to compute super expensive task.<small> / </small><small>*workers*</small><small> / </small><small>8 min read</small>


<Hr />

## 📺 Videos

- <a href="https://www.youtube.com/watch?v=su6WA0kUUJE?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vd3d3LnlvdXR1YmUuY29tL3dhdGNoP3Y9c3U2V0Ewa1VVSkUiLCJwcm9qZWN0Ijoid2Vla2x5Zm9vIiwiaW5kZXgiOjM5LCJzZWN0aW9uIjoidmlkcyIsInNvdXJjZSI6IndlYiJ9fQ%3D%3D">Web Design Engineering With the New CSS</a>: CSS Day 2024<small> / </small><small>*css*</small>
- <a href="https://www.youtube.com/watch?v=nzbV0YgSBuo?utm_source=weeklyfoo&utm_medium=web&utm_campaign=weeklyfoo-39&ref=weeklyfoo" target="_blank" rel="noopener" ping="https://api.weeklyfoo.com/api/foo/bar?foo=eyJldmVudCI6InVybC1jbGljayIsInByb3BzIjp7InVybCI6Imh0dHBzOi8vd3d3LnlvdXR1YmUuY29tL3dhdGNoP3Y9bnpiVjBZZ1NCdW8iLCJwcm9qZWN0Ijoid2Vla2x5Zm9vIiwiaW5kZXgiOjM5LCJzZWN0aW9uIjoidmlkcyIsInNvdXJjZSI6IndlYiJ9fQ%3D%3D">Facing Frontend's Existential Crisis</a>: React Summit 2024<small> / </small><small>*frontend*</small>


Want to read more? Check out the full article [here](https://weeklyfoo.com/foos/foo-039/).

To sign up for the weekly newsletter, visit [weeklyfoo.com](https://weeklyfoo.com).