Through the pipeline: An exploration of front-end bundlers

I really like the kind of tech writing where a fellow developer lays out some specific needs, tries out different tech to fulfill those needs, and documents how it went for them. That’s exactly what Andrew Walpole did here. He wanted to try out bundlers in the context of WordPress themes and needi..

7 Practical Uses for the ::before and ::after Pseudo-Elements in CSS

CSS ::before and ::after pseudo-elements allow you to insert “content” before and after any non-replaced element (e.g. they work on a
but not an ). This effectively allows you to show something on a web page that might not be present in the HTML content. You shouldn’t use it for actual ..

CSS Modules (The Native Ones)

They are actually called “CSS Module Scripts” and are a native browser feature, as opposed to the popular open-source project that essentially does scoped styles by creating unique class name identifiers in both HTML and CSS. Native CSS Modules are a part of ES Modules (a lot like JSON modules we ..

Chapter 7: Standards

It was the year 1994 that the web came out of the shadow of academia and onto the everyone’s screens. In particular, it was the second half of the second week of December 1994 that capped off the year with three eventful days. Members of the World Wide Web Consortium huddled around a table at MIT o..

Tools to Improve UX and Win Over Your Customers

Try Hotjar for free today! An enjoyable user experience and high conversion rates go hand-in-hand. It makes sense then, that if you want to improve conversion rates, your first task is to improve user experience. To improve UX, deeply understanding your users is non-negotiable. But speaking with c..

Takes on State

React is actually a bit of an outlier with state management. While it has first-class tools like useState and Context, you’re more own your own for reactive global state. Here’s David Ceddia with “React State Management Libraries and How to Choose” which does a good job of talking about the options...

Care for the Text

How do you make a great website? Everyone has an answer at the ready: Flashy animations! The latest punk-rock CSS trick! Gradients! Illustrations! Colors to pack a punch! Vite! And, sure, all these things might make a website better. But no matter how fancy the application is or how dazzling the tec..

Platform News: Defaulting to Logical CSS, Fugu APIs, Custom Media Queries, and WordPress vs....

Looks like 2021 is the time to start using CSS Logical Properties! Plus, Chrome recently shipped a few APIs that have raised eyebrows, SVG allows us to disable its aspect ratio, WordPress focuses on the accessibility of its typography, and there’s still no update (or progress) on the development of ..

CSS-Tricks Chronicle XXXIX

I’ve been lucky enough to be a guest on some podcasts and at some events, so I thought I’d do a quick little round-up here! These Chronicle posts are just that: an opportunity to share some off-site stiff that I’ve been up to. This time, it’s all different podcasts. Web Rush Episode 122: Modern We..

Making a Site Work Offline Using the VitePWA Plugin

The VitePWA plugin from Anthony Fu is a fantastic tool for your Vite-powered sites. It helps you add a service worker that handles: offline supportcaching assets and contentprompting the user when new content is available…and other goodies! We’ll walk through the concept of service workers togethe..