Here’s a collection of interesting links I’ve found around the web. The feed updates frequently, and I compile everything into a blog post on the last day of each month.
65 links tagged "#dev"
Responsive app switcher or carousel UI with CSS view()
This CodePen uses pure CSS and its new-ish features to create a really neat card stacking effect! It uses Scroll Snapping (widely available) and Scroll-based animation (Chromium only for now) to both style the card stack and make sure they behave correctly.
A semi-serious, semi-satire, but fully incredible short video that talks about ReactJS and how and why it became the most popular web framework. Definitely worth the watch, especially if you don’t like React. Make sure to read the transcript for some added Director’s notes.
Dynamic text color contrast based on background lightness with CSS,SVG filters
If you’ve ever worked with CSS variables on a project, you know one of the main challenges is getting color contrast to work correctly. When the background color changes, the text color (which should have high contrast) might not work as well. Often we handle this by having a --color-contrast variable, but this added complexity builds up quickly.
This article goes into an alternative way that uses CSS and SVG filters to let the browser apply the contrast automatically. The CSS-only alternative has a problem with fringing, but the SVG one seems straightforward enough and gets rid of that issue. That’s pretty clever!
I assume the main drawback of that approach is that you don’t have full control over the text color, so if having an exact color is crucial to you, then you’re still stuck with hardcoding color variables.
In case you don’t know this blog, I highly recommend checking other posts out. “brr” is a blog made by an IT worker that worked for a few months in Antarctica, and regularly blogged about some of the unique situations and challenges faced there. They are back home now, and published a post about the challenges faced due to Antarctica’s very limited internet access, and how a lot of stuff we take for granted just wasn’t usable there.
Makes us think about how much code we ship on our apps and websites. Surely there are ways to make our websites work with less and require less resources to run? We never know who, how and where our users might be.
Generative AI has a lot of problems, but it’s really good at creating some fun stuff. This tool asks for a GitHub profile handle and roasts it, using public data from your profile and your public repos. It’s surprisingly good at it… and it might get your feelings hurt.
Here’s a bit of what it says about mine:
Your website might be “lightweight,” but it seems like the only thing lighter is the impact of your contributions. If I wanted to stumble upon such “high-quality” work, I’d check out my toddler’s finger painting. Keep swinging that magic wand, maybe one day you’ll code something that doesn’t make people cringe!
I’m okay, I promise 🥲 …