Friday Issue Nr. 74 | 4/08/2023

Happy Friday! Another week, another post. This week focuses on some CSS features - CSS Nesting, Light/Dark Theme and Randomness in CSS. My personal favourite is this post - “Writing CSS in 2023”. Also, Time Management from Mixed News felt like a good read.

JavaScript News

JSON to Types

I already made a post about this nice helper which converts JSON to types:

https://app.quicktype.io/ (#53)

Apparently, you can also have it in VS code and generate types without leaving your IDE. Nice.

https://marketplace.visualstudio.com/items?itemName=quicktype.quicktype

Why not Web Components?

https://daverupert.com/2023/07/why-not-webcomponents/

CSS News

CSS and Accessibility: Inclusion Through User Choice

https://www.smashingmagazine.com/2023/08/css-accessibility-inclusion-user-choice/

As it turns out, @prefers-color-scheme is one of the most widely used CSS Media features. Who would think?

CSS nesting

It seems like there are some moves towards a simpler CSS nesting option. CSS slowly becomes more like SCSS. Now you can nest without & symbol

https://drafts.csswg.org/css-nesting/#nesting

When I say now, I mean this is in draft and will be added to Firefox 117, but I like the direction.

Writing CSS in 2023

Excellent article with quick reasoning for Container Queries, Grouping styles in Layers, :is() and :where(), colours, and user preferences

https://www.smashingmagazine.com/2023/07/writing-css-2023/

Example of how to create Light/Dark/Whatever theme

The title should probably be “another way to Create a Theme”. Interesting approach anyway

https://chriskirknielsen.com/blog/future-themes-with-container-style-queries/

How to achieve Randomness in CSS

Quite an impressive animation with CSS

https://hypersphere.blog/blog/randomness-in-css-using-trigonometry/

Speaking of randomness, here is the site which generates random CSS patterns. Not sure if it is useful, but checking the CSS might be interesting.

https://random.css-pattern.com/

Mixed News

Prerender pages in Chrome

https://developer.chrome.com/blog/prerender-pages/

Managing your interrupt rate as a tech lead

Good points on time management

https://humanwhocodes.com/blog/2023/07/managing-interrupt-rate-tech-lead-time-blocking/