🧢 Stefan's Web Weekly #9
Tags: webdev
Published: 2021-03-08 10:38:33

---
title: 🧢 Stefan's Web Weekly #9
published: true
description: Tips to avoid a computer full of random files, ping pong in pure CSS and many new tools.
tags: webdev
canonical_url: https://www.stefanjudis.com/blog/web-weekly-9/
series: Web Weekly
---

## Welcome to Web Weekly #9

Important news: [I have a new keyboard](https://twitter.com/stefanjudis/status/1367101254544064514)! I went all-in with a super fancy ergonomic mechanic one. And well... it's tough. I'm typing 30min per day on it, and hopefully I'll succeed and learn where all the keys are. Wish me luck!

![Moonlander keyboard](//images.ctfassets.net/f20lfrunubsq/6N4TnqZA6L9Uvf5P7paLQe/adf7c67f5a8312e55f64d94678053731/Screenshot_2021-03-07_at_23.29.48.png)

This week's Web Weekly includes many tools, ping pong in pure CSS, tips to avoid a computer full of random files, and, as always, GitHub repositories, new Tiny Helpers and some music.

Shall we? Let's do it!

## Your `/uses` pages

![If you document your setup online, let me know by replying to this email. I would love to include some setups next week!](//images.ctfassets.net/f20lfrunubsq/guLtcbGMMuDlVKX3xMqEj/046e977dbba80da2a57408ac71eb104a/Screenshot_2021-03-07_at_21.05.34.png)

[I shared my `/uses` page last week](https://www.stefanjudis.com/blog/web-weekly-8/#share-what-you-use) and asked you to send me yours. It means a lot to me when people reply to this weekly email. 

Let me share some `/uses` pages I received:

- [Eva Dee](https://includejs.dev/notes/my-uses-page/)
- [Kilian Valkhof](https://kilianvalkhof.com/using/)
- [Bart Veneman](https://veneman.dev/uses)
- [Lee Robinson](https://leerob.io/uses)
- [Aron Codes](https://aron.codes/uses)

## Scream (or write) into the void  

![I have a document in Writerie which is called The Void - every time (at least most of the time) I am angry about something or want to complain and would normally tweet it out, I instead write it down in The Void.](//images.ctfassets.net/f20lfrunubsq/7w0OxtI6GoIs83lYKYB2p4/4a3e1db4c4d6a9e1a904328a8013e55c/Screenshot_2021-03-07_at_21.46.07.png)

Michael Scharnagl shared his approach to dealing with anger. Instead of replying angrily on social media or writing a snarky email, he writes his rage into a document to let it out. I love this approach!

👉 <a class="btn btn__small" href="https://justmarkup.com/notes/2021-03-01-the-void/">Start writing into the void</a>

## Tech talks with a surprising turn

![Zach Leat presenting](//images.ctfassets.net/f20lfrunubsq/7K8zeBVYGZPOgcfjciBGsR/8988865fb4cb50ae1c3603a6197ffb0d/Screenshot_2021-03-07_at_21.06.52.png)

I love it when talks include a surprising element. Zach Leatherman gave "a talk about building websites" at Smashing Conf. And not only do I agree with what Zach was sharing, the talk itself included a wonderful surprise to the end. Fabulous!

👉 <a class="btn btn__small" href="https://www.zachleat.com/web/this-website-is-a-tech-talk/">Watch "a talk about websites"</a>

## Stop polluting your computer with screenshots and downloads

![Why I don't need to clean up my desktop and downloads folder in macOS](//images.ctfassets.net/f20lfrunubsq/3RximJYsdtPkUq4pNpUwLZ/47c72cfb03612aa229df4d6d00844614/Screenshot_2021-03-07_at_22.22.19.png)

I read some Twitter threads about keeping the desktop and downloads folder clean on macOS. That's a problem that I don't have because I adopted two tricks in my workflow to delete files automatically using the `/tmp` directory.

👉 <a class="btn btn__small" href="https://www.stefanjudis.com/blog/why-i-dont-need-to-clean-up-my-desktop-and-downloads-folder-in-macos/">Stop spending time on file deletion</a>

## The number one rule when having 1:1 conversations

![Oh, and of course make sure to consider the following crazy important golden rule of life and the universe: don't do anything else while having a one-on-one interaction with someone. Just never do this.](//images.ctfassets.net/f20lfrunubsq/kNn6jnVlnW5LDVAEEJY7c/007bbf95dced2387b26d41d82d798dfd/Screenshot_2021-03-02_at_00.36.11.png)

Santeri Liukkonen shared some advice on how to live in this world full of digital distractions. It's an excellent read and included this one important rule for 1:1 interactions.

👉 <a class="btn btn__small" href="https://www.lostbookofsales.com/age-of-distractions/">Read "Age of distractions"</a>

## More tools, tools, tools...

![Hidden tools – Discover a wide collection of tools made by the community](//images.ctfassets.net/f20lfrunubsq/5WA8usQmjPTWtXMieiqfFs/47249e4db2936fae2916a3115fbe4c3f/Screenshot_2021-03-07_at_21.43.08.png)

Bereket reached out to me sharing his new project – hiddentools.dev. He's a 12 years old (!) maker from Canada. Great work, Bereket!

👉 <a class="btn btn__small" href="https://hiddentools.dev/">Find more useful tools</a>

## Impressive CSS skills 

![Screenshot of CSS-only table tennis](//images.ctfassets.net/f20lfrunubsq/2zd2yxvQa8kSxJvnPe9MY2/8adf87413281ca0b1e8eafbf19931d84/Screenshot_2021-03-04_at_22.57.46.png)

There are many impressive CSS demos out there. I admire people that have the patience to build these artworks. This CSS-only ping pong table by Amit Sheen uses 360 lines of SASS and is truly impressive. 3D in CSS is so hard!

👉 <a class="btn btn__small" href="https://codepen.io/amit_sheen/pen/PobQjMX">Watch some ping pong</a>

## You might have heard about it – I ♥️ RSS

![I enjoyed the freedom to see sources as I wanted, the flexibility to move to a new reader if I wanted, the complete lack of advertising. It was hard to not fall in love with the service.](//images.ctfassets.net/f20lfrunubsq/4ynjdZbxdHE1dSV1bScj29/c3a5d321235c294d293b809d24ffc9d6/Screenshot_2021-03-06_at_21.21.20.png)

Marc shared why he's still using RSS and how you can consume Reddit, YouTube and GitHub with your RSS reader of choice! Right down my alley. 🙈

👉 <a class="btn btn__small" href="https://atthis.link/blog/2021/rss.html">Start using RSS</a>

## Car rides for your 2nd monitor

![Driveandlisten screenshot](//images.ctfassets.net/f20lfrunubsq/2ZTrUuKCnvwWcgFwkPqaBN/59f4792b88e889f6f7c3b1f27aee179b/Screenshot_2021-03-07_at_21.36.44.png)

[Bramus shared the wonderful site driveandlisten.herokuapp.com](https://www.bram.us/2021/03/06/drive-listen-drive-around-cities-while-listening-to-their-local-radios/). I'm super into it! It plays videos of cars driving around in multiple cities while playing local radio stations. The site it perfect to have it running on your 2nd monitor. 

And it's funny; the Berlin video passes where I'm writing this newsletter right now.

👉 <a class="btn btn__small" href="https://driveandlisten.herokuapp.com/">Drive around and listen to some music</a>

## Start using comments in your shell to find commands easier

![A CLI command with comments](//images.ctfassets.net/f20lfrunubsq/FvTKZHDk2ZujchYKoyqVs/2f1225af9ce7e7350e958b2e4fc47a9e/Screenshot_2021-03-07_at_22.27.11.png)

Suppose you're spending a lot of time in the terminal running multiple different commands with different configurations. In that case, running commands with comments can help to use the command history more effectively. CLIMagic shared a quick video with some nifty CLI tricks.

👉 <a class="btn btn__small" href="https://www.youtube.com/watch?v=UvZY7bYt2Lo">Level up your CLI skills</a>

## TIL: `text-transform: capitalize` is a thing

![Source code showing text-transform: capitalize](//images.ctfassets.net/f20lfrunubsq/43hr3p26277uN1GJ9YhiBS/be10f1dcb3e41c027644b612ef58d9ae/Screenshot_2021-03-07_at_22.31.20.png)

Marco Denic shared a CSS fact that I didn't know. You can use `text-transform` for more than uppercasing some characters. 🙈

👉 <a class="btn btn__small" href="https://twitter.com/denicmarko/status/1368093987576426497">Check Marco's Tweet</a>

## More visual CSS tools are landing in DevTools

![Visual Flexbox DevTools control](//images.ctfassets.net/f20lfrunubsq/6OHdjJltrL2T7EB1rE82ah/987c609635a272d48e9d996e548cfc07/Screenshot_2021-03-07_at_22.34.50.png)

Chrome 90 will ship with a new visual Flexbox tool. Firefox kicked it off with excellent CSS Grid tools, and I'm thrilled that developer tools get more powerful with every release.

👉 <a class="btn btn__small" href="https://twitter.com/stefanjudis/status/1366526458001297410?s=20">See the new Flexbox tool in action</a>

## New tiny helpers

![Screenshots of SVG Color Matrix Mixer, SVG Repo and Merge PDF](//images.ctfassets.net/f20lfrunubsq/WybO6ItivrNEaR3x276R2/f1b0c9d014eaf79ecd532af495b23155/Screenshot_2021-03-07_at_22.44.00.png)

- [SVG REPO](https://www.svgrepo.com/) – Explore, search and find the icons or vectors.
- [Merge PDFs](https://localpdf.tech/merge) – I think you get the idea. 🙈
- [SVG Color Matrix Mixer](https://www.fecolormatrix.com/) – Generate nice looking color matrix filters for your images.

## Three useful projects to have a look at 

- [github/tab-container-element](https://github.com/github/tab-container-element) – An accessible tab container element with keyboard support. 
- [ryanburgess/engineer-manager](https://github.com/ryanburgess/engineer-manager) – A list of engineering manager resource links. 
- [kuchin/awesome-cto](https://github.com/kuchin/awesome-cto) – A list of resources for Chief Technology Officers.

## A quote to think about

Sometimes, when I'm stressed, or things are not going as I expect, I can enter "complainer mode". Everything sucks then, and usually, that's not helpful. [James Pierce shared a great sentence I try to keep in mind](https://twitter.com/jimmpierce/status/1364371172075311109) in the future.

> The more you complain, the less you value your time.

## A song that makes you stop coding

![Cover: Feist – Limit to your love](//images.ctfassets.net/f20lfrunubsq/21NQepTrJh7xmaU4KNlSKJ/e19d48d295f1cf03aa85f29c0c4e84f0/Screenshot_2021-03-07_at_23.23.13.png)

An absolute classic song caught me this week. Feist's "The Limit to your Love" is one of these songs that'll never get old. Enjoy!

👉 <a class="btn btn__small" href="https://www.youtube.com/watch?v=-xG9w9chjpg">Listen to Feist</a>

---

And that's a wrap for the ninth Web Weekly! 🎉

Writing this newsletter takes me three hours every Sunday. If you enjoyed this edition, [a quick share means the world to me](https://twitter.com/intent/tweet?text=I%20like%20@stefanjudis%20weekly%20newsletter&url=https://www.stefanjudis.com/blog/web-weekly-9/) and [you can subscribe on my site](https://www.stefanjudis.com/newsletter/), too. ♥️

**Stay safe, and I'll talk to you next week!** 🎉 👋

PS. I heard the cool kids use RSS. You can find [multiple feeds on my site](https://www.stefanjudis.com/feeds/).