DEV Community

Stefan Judis
Stefan Judis

Posted on • Updated on • Originally published at

🧒 Stefan's Web Weekly #10

Welcome to Web Weekly #10

To start this week's edition, I want to ask you: what great resources, articles or videos did you discover recently? I'd love to include a "{YOUR_NAME} recommends" section in this newsletter. Please share resources with me by replying to this email (or clicking this link when you're reading the newsletter online).

This week's Web Weekly includes CSS tricks such as repeating gradients and the :is pseudo-class, a fascinating maker story, facts about the scary insecure web ecosystem, and, as always, GitHub repositories, new Tiny Helpers and some music.

Ready? Steady? Go!

The :is pseudo-class in CSS

Kevin Powell describing CSS :is

I discovered Kevin Powell's YouTube channel, and he's such an excellent teacher. If you're wondering what the :is pseudo-class is about, this video is golden.

πŸ‘‰ Learn more about :is

"Objective" search engine results

Search results in google and duckduckgo showing women and landscapes for the term beautiful

How different could various search engine results be for general terms such as "beautiful". It turns out, very different! David Merian shared the results of Google and DuckDuckGo. This example shows the tech giants' control over the content we all consume. It's scary!

πŸ‘‰ Check the tweet

The insecure system of programming dependencies

The code was meant for internal PayPal use, and, in its package.json file, appeared to contain a mix of public and private dependencies β€” public packages from npm, as well as non-public package names, most likely hosted internally by PayPal. These names did not exist on the public npm registry at the time.

This post is wild! Alex Birsan shared how he made it to run code in the infrastructure of companies such as Apple, Netflix and PayPal. All that was possible thanks to the insecure way we install software dependencies.

πŸ‘‰ Read this scary story

Makers gonna make...

πŸ’‘.kz, πŸ‘‘.kz, 🌈.kz, 😎.kz. Buy, buy, buy, buy.  It was slightly painful watching my bank account going down, and the number of emoji domains go up.  80 emojis in, forking over money for a goat emoji domain name, you seriously start to question what you're doing.  $1200 later, 150 emoji domains were mine.

I love this story. Ben Stokes found out about emoji URLs, dug into the technical details, had an idea and went on to build a quick product.

πŸ‘‰ Learn more about the emoji product

The unhealthy hustle culture

I can’t be productive, and I can’t fully relax, and I can’t possibly be alone in this.

Speaking about maker culture... Many people have side hustles these days. Heck, I'm writing a newsletter every Sunday evening. πŸ™ˆ Molly Conway questions if that's all worth it.

πŸ‘‰ Reconsider your side projects

The user experience of disabled UI elements

Do/Dont example of disabled UI elements

Since reading Disabled buttons suck, I rethink putting disabled attributes on buttons. Justin Win shares best practices and alternatives to disabled UI elements that provide a better user experience.

πŸ‘‰ Rethink your UI

CSS functions to repeat gradients

CSS repeat gradient function explanation

This week I learned that CSS defines functions to repeat gradients. I honestly wonder why I haven't seen these functions before. 😲

πŸ‘‰ Repeat your CSS gradients

How to succeed as a writer

You’re not alone.  Every writer doubts their ability to succeedβ€Šβ€”β€Ševen the successful ones.

Josh Spector wrote a wonderful motivational piece on writing and blogging. If you have doubts about publishing things online, this post is for you!

πŸ‘‰ Become a successful writer

Make alt text required when tweeting images

Screenshot of twitter UI including a red "Add alt text" button

Since reading Eric Meyer's post that explains how to change Twitter to show images without alt text in grayscale, it's scary to see how many images are inaccessible. I came across a Chrome/Firefox extension that enforces alt text when tweeting and installed it right away.

πŸ‘‰ Require image alt text to tweet

side-by-side CLI package diffs

npm side by side diff in the terminal

The npm CLI tool recently got a valuable addition – diff. I updated one of my blog posts to reflect these changes. Read the post to find out how to show npm package diffs side-by-side right in your terminal.

πŸ‘‰ Start diffing your dependencies

The secret of convincing presentations

A good litmus test for images on slides: can you add a meaningful caption to the image - i.e., is there a point to the image? If you can’t write a caption for the image, you likely don’t need it there.

Public speaking (and slide design especially) is an art. When you get the people's attention for some time, it's on you to get the most out of their time. Tom Critchlow's post "Good Slides Reduce Complexity" includes valuable advice!

πŸ‘‰ Improve your presentations

New tiny helpers

Screenshots of unicode range interchange, myScale and ikon

  • Unicode Range Interchange – Do math on unicode-range values for web fonts.
  • myScale – A quick SVG Icon Resizer.
  • ikon – Build downloadable custom sprite sheets from dragged-and-dropped directories

Three useful projects to have a look at

A quote to think about

Remy Sharp shared quick thoughts on paid online products. I pay for a handful of tools I love using and 100% with the following statement.

Free is great, but longevity is better and always worth paying for.

A song that makes you stop coding

Cover: Patrick Wolf – Time of my life

This week's song is one of my absolute favourite lifetime tracks. Patrick Wolf's "Time of my life" includes a piano, lots of strings, and it becomes so beautiful powerful to the end. I'll never get tired of this song!

πŸ‘‰ Listen to Patrick Wolf

And that's a wrap for the tenth Web Weekly! πŸŽ‰ (oh wow... time flies)

Writing this newsletter takes me three hours every Sunday. If you enjoyed this edition, a quick share means the world to me and you can subscribe on my site, 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.

Top comments (0)