Weekly Digest 24/2021
Welcome to my Weekly Digest #24.
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
The Beauty of FizzBuzz in CSS
In this CSS implementation of FizzBuzz, we can generate beautiful patterns with math!
CSS for Web Vitals
This article covers CSS-related techniques for optimizing Web Vitals.
Inherit, initial, unset, revert
Today we’re going to take a quick look at a few special CSS keywords you can use on any CSS property: inherit, initial, revert, and unset. Also, we will ask where and when to use them to the greatest effect, and if we need more of those keywords.
Inline Styles as Classes
If you’re abhorred by using inline styles, just move that style to the class attribute! And then make sure you have CSS in place that, ya know, does what it says on the box.
Useful and Useless Code Comments
Unfortunately, many comments are not particularly helpful. The most common reason is that comments repeat the code: all of the information in the comment can easily be deduced from the code next to the comment.
A Complete Guide To Accessibility Tooling
Learning to build accessible websites can be a daunting task for those who are just starting to implement accessible practices. We’ve pulled together a wide range of accessibility tooling, ranging from single-use bookmarklets to full-blown applications, in order to help you get started with building more accessible websites.
Some great videos I watched this week
Pie Charts in React with visx
Using visx, the low-level visualization library from Airbnb, we’ll create a cool looking Pie Chart that resembles the beautiful one that the Exodus wallet has.
What’s new in React 18
Understand the top new features coming to React 18, explained simply.
Five Essential Design Patterns in Typescript
Jack is going to “do it live!” as he brings you five essential Design Patterns, from the GoF book, in Typescript, live, as you get to ask questions along the way!
How to Find and Remove Dead CSS
Ever have old CSS styles pile up that you’re afraid to remove because you’re not sure if anything else is depending on them? Here’s one way to get more confidence about which styles are actually unused and safe to delete, by using combining the code coverage results for each page on your website.
Seeking a Target
This video explores Craig Reynolds’ formula for Steering Behaviors in JavaScript (p5.js) beginning with “Seeking a Target.
Useful GitHub repositories
Fig
Fig adds autocomplete to your terminal. As you type, Fig pops up subcommands, options, and contextually relevant arguments in your existing terminal on macOS.
ni
Use the right package manager
Modern Unix
A collection of modern/faster/saner alternatives to common unix commands.
Google TypeScript Style
gts is Google’s TypeScript style guide, and the configuration for our formatter, linter, and automatic code fixer. No lint rules to edit, no configuration to update, no more bike shedding over syntax.
dribbble shots
Cake App
OYOTEE — Plant Shop Website
Blog App — UI Design
Spotify for Artists Fan Study Pitch
Tweets
Picked Pens
3D Modern House
Loki — Intro text animation
Rage
Podcasts worth listening
Syntax — What is SvelteKit?
In this Hasty Treat, Scott and Wes talk about SvelteKit — what it is and why you might want to use it.
The CSS Podcast — Custom properties
Custom properties, aka CSS variables, are runtime dynamic variables which allow you to store loose or typed values. They’re free, super fast, improve code legibility, unlock powers, are reachable with JavaScript, animateable, overall super fun and, well, kind of complex.
Smashing Podcast — What is Image Optimization in 2021?
We’re talking about Image Optimization. What steps should we follow for performant images in 2021? Drew McLellan talks to expert Addy Osmani to find out.
CodePen Radio — Andy and Una from Google’s Learn CSS Project
Learn CSS is a very cool project from a whole team of people at Google (and outside). It does a great job of documenting where is right now, in a fairly comprehensive way.
Junior to Senior — Maintainer of the JavaScript Octokit
David and Gregor discuss building and maintaining open-source software, how to be a valuable asset to your team, and growing through communication.
Thank you for reading, talk to you next week, and stay safe! 👋
