Let’s Create a Lightweight Native Event Bus in JavaScript
11.12.2020
An event bus is a design pattern (and while we’ll be talking about JavaScript here, it’s a design pattern in any language) that can be used to simplify communications between different components. It can also be thought of as publish/subscribe or pubsub.
The idea is that components can listen...
Why I love Tailwind
11.12.2020
Max Stoiber wrote some interesting notes about why he loves Tailwind. (Max created styled-components, so he has some skin in the styling methodology game.) There’s a lot of great history in this post about how Tailwind emerged and became a valuable tool for designers and engineers alike, but...
Unconventional Stock Image Sources
10.12.2020
This year, I learned that there is a wide world of free stock imagery available beyond Unsplash and Pexels. You see, I’ve been working on designing WordPress themes this year, and all images need to be compatible with the GPL. Unsplash and Pexels both have free and open licenses, but unfortunately...
It’s all relative.
10.12.2020
I remember sitting in the back seat of our family’s Subaru station wagon. I was six and this was long before child carseats were a thing. My dad was at the wheel and my mom played 20 Questions with me while we drove to some vacation spot I can’t even remember.
It was my mom’s turn...
Optimize Images According to Network and Device Constraints in React
10.12.2020
Connectivity has evolved beyond recognition since the beginning of the internet. We are lightyears past dial up, these days, and can watch a video in high resolution on our smartphone while being connected to a mobile network. But not all mobile connections are created equal – older...
Using CSS Custom Properties to Adjust Variable Font Weights in Dark Mode
10.12.2020
Black isn’t always slimming.
When recently testing a dark mode option for one of my sites, I experienced first-hand the issue that Robin Rendle addresses in this article. All of my page text — headings and body copy — appeared to bulk up when I switched to dark mode. And it didn’t matter what fonts...
Collective #640
10.12.2020
50 Projects in 50 Days * Moonbridge * The 2020 Web Almanac * The Rules of Margin Collapse
The post Collective #640 appeared first on Codrops
2020 was not a good year for learning
10.12.2020
There, I said it.
What did I learn about building websites in 2020? A lot. But what I learned is not nearly as important as how I learned it. So instead, I want to share a couple of strategies I used to unblock learning in less-than-ideal times.
I spent almost a decade teaching design and, let...
npm ruin dev
9.12.2020
In 2020, I rediscovered the enjoyment of building a website with plain ol’ HTML, CSS, and JavaScript — no transpilin’, no compilin’, no build tools other than my hands on the keyboard.
Seeing as my personal brand could be summed up “so late to the game that the stadium has been demolished,”...
How to Create a Favicon That Changes Automatically
9.12.2020
I found this Free Favicon Maker the other day. It’s a nice tool to make a favicon (true to its name), but unlike other favicon generators, this one lets you create one from scratch starting with a character or an emoji. Naturally, I was curious to look at the code to see how it works and, while...
Very Extremely Practical CSS Art
9.12.2020
I’ve always enjoyed the CSS art people create, but I’ve never ventured into it much myself. I’m familiar with many of the tricks involved, but still find it surprising every time: the way people are able to make such fluid and beautiful images out of little boxes. I always end...
TypeScript & Relevance
8.12.2020
In our wide world of building for the web, we have every opportunity to talk about tools. We lunge to fill every gap we find in our projects with a definitive technological approach. Some of us are given “a seat at the table” feasting on even the most minuscule of technological debates. This...