Friday Issue Nr.91

2023-12-08

back

This week has few but exciting news. Astro is going strong, as well as Remix. StyleX is open-sourced, a thought from D. Abramov on Clean Code and a few interesting CSS articles.

JavaScript News

StyleX

Meta open-sourced StyleX. It is used for WhatsApp, Facebook, and Instagram. StyleX is designed for Frames like React, Preact, Solid, lit-html or Angular. It can easily apply different styles for the Component (active, hover, etc) and adjust things programmatically. My doubt is how easy it is to maintain the code and how to apply global re-usable styling. Although I’m not a CSS-in-JS person, it is definitely worth exploring and jotting down.

“StyleX combines the strengths and avoids the weaknesses of both inline styles and static CSS. Defining and using styles requires only local knowledge within a component, and avoids specificity issues while retaining features like Media Queries. StyleX builds optimized styles using collision-free atomic CSS which is superior to what could be authored and maintained by hand.”

https://stylexjs.com/

Astro 4

Highlights:

https://astro.build/blog/astro-4/

Goodbye, Clean Code

This is a fantastic post by Dan Abramov on Clean Code, Abstractions and what to do with that.

https://overreacted.io/goodbye-clean-code/

Remix v2.3.0

The Remix is going strong! Changelog: https://github.com/remix-run/remix/blob/main/CHANGELOG.md

“ We released 1 minor and 1 patch version of Remix since the last newsletter, both primarily focused on improving stability and paving the way for new features.

“Also worth mentioning is that an open-source package, Remix Development Tools, provides a user-friendly interface consisting of three tabs: Active Page, Terminal, Settings, Errors and Routes, and a side tab called Timeline.

https://www.npmjs.com/package/remix-development-tools

Why do we use AWS instead of Vercel to host our Next.js app

https://graphite.dev/blog/why-we-use-aws-instead-of-vercel

Lightweight syntax highlighting library

https://github.com/williamtroup/Syntax.js

CSS News

Radial Gradients and CSS Trigonometric Functions

https://css-irl.info/radial-gradients-and-css-trigonometric-functions/

oklch()

I guess the time has come to move away from RGB() 🙂

This short post explains and visually shows the benefits of using oklch(). Also, it gave me answers on wide-gamut P3 colours.

https://www.stefanjudis.com/today-i-learned/oklch-perceived-lightness/

Should AVIF be the dominant image format on the web?

https://tsev.dev/posts/2023-11-10-should-avif-be-the-dominant-image-format/

Free online visual CSS animation builder

https://animotion.dev/

The power of :has() selector

Get inspired and check this codepen example.

https://codepen.io/jh3y/pen/JjxPKXz

Mixed News

Figma variables guide

https://www.delasign.com/blog/figma-variables-guide/

Andris Švarcs

Somehow, I've survived over 15 years as a web developer without losing my interest in the craft. Quite the opposite, with so many great improvements in the Web standards, what was nearly impossible now is easy to make.

My career has been a wild ride through small agencies and big corporations, building everything from finance apps to health dashboards.

I'm that annoying person who needs to understand products beyond just slinging code. I ask questions like 'Why is this feature important?' and 'How will this improve the customer journey?' – you know, the kind of questions that make project managers reach for the pint aspirin. This curiosity has led me down the rabbit holes of design, accessibility, and SEO. Because apparently, making websites pretty, usable, and findable wasn't challenging enough on its own.

P.S. If this bio sounds too polished, blame my evil AI twin. I'm still working on teaching it sarcasm.

Copyright © since 2021, Andris Švarcs. All rights reserved.

Lets connect

bluesky

youtube

linkedin