Handy CLI tool by Heydon which allows you to convert from Design Tokens Format to CSS Custom Properties, Sass Variables, ES Modules, JSON, etc. Design Tokens CLI → 🤔 New to the Design Tokens format? Design Tokens and how a W3C specification will help going forward will walk you through it.
Show CSS browser support data with css-browser-support
If you want to include Browser Support tables on your site, you can use this package by Stephanie Eckles Query for CSS browser support data, combined from caniuse and MDN, including version support started and global support percentages. Per feature that ask it, you get back an object with the browsers and the data: { …
Continue reading “Show CSS browser support data with css-browser-support
“
Be the browser’s mentor, not its micromanager
Wonderful talk by Andy Bell. We look at how we can hint the browser, rather than micromanage it by leaning into progressive enhancement, CSS layout, fluid type & space and modern CSS capabilities to build resilient front-ends that look great for everyone, regardless of their device, connection speed or context. Slides available as well
Bun is a fast all-in-one JavaScript runtime
Bundle, transpile, install and run JavaScript & TypeScript projects — all in Bun. Bun is a new JavaScript runtime with a native bundler, transpiler, task runner and npm client built-in. I’ve been following Jarred’s progress on Twitter over the past few weeks and it’s impressive what he has achieved. Building Bun, he also landed a …
Continue reading “Bun is a fast all-in-one JavaScript runtime”
GitHub: How we think about browsers
GitHub is currently shipping ES2019-compatible code, and will soon ship ES2020 code. GitHub will soon be serving JavaScript using syntax features found in the ECMAScript 2020 standard, which includes the optional chaining and nullish coalescing operators. This change will lead to a 10kb reduction in JavaScript across the site. Wow, won’t that exclude a whole …
What’s New in React Native 0.69
Photo by Lautaro Andreani on Unsplash It’s been a while since I’ve done some React Native work, but the 0.69 release seems like a very welcome one: React 18, bundled Hermes, Fabric, TurboModules, and the JSI. React Native 0.69 brings a ton of important improvements & updates to the table, with performance & memory usage …
m-cli – Swiss Army Knife for macOS
m-cli is a macOS command line tool that lets you interact with utilities and applications entirely in Terminal. Gives you a bunch of shorthand CLI commands that you can use, such as m finder showdesktop YES, m battery status, m dns flush, etc. These replace a bunch of custom aliases you might have set up …
A Previous Sibling Selector
Jim Nielsen set out to style a bunch of links that appeared before hr elements. As the element tree – generated from a Markdown file – was entirely flat, there are no enclosing section elements to hook onto in order to select those links (using something like section p:last-child a:only-child). The solution? The :has() selector: …
Styling selects? You’ve got options!
Complex vs Compound Selectors
Good post by Miriam Suzanne In CSS, there are compound selectors and also complex selectors, and I never remember which is which. Do you need to learn the difference? Probably not. But I’m tired of looking it up. Don’t tell anyone but this is the reason why many of us blog: to remember things 😉 …