The Front-End Developer's Guide to the Terminal — If you’re looking to learn a modern JavaScript framework (like React) you’ll need to be familiar with the terminal. As Josh points out, many tools assume you have a good working knowledge of the CLI. So, consider this your ‘missing manual’ for all things Terminal — looking at all the important high-level fundamentals, and running through some tips and tricks along the way.

Josh W. Comeau

Building a Dialog Component — This is a solid, foundational overview of how to build color-adaptive, responsive, and accessible ‘mini and mega modals’ with the <dialog> element.

Adam Argyle

Dark Patterns in UX — Dark patterns manipulate or trick users, rather than help them. It’s easy to try and trick your users with your UI, but don’t—it only breeds distrust in both you and the internet. Learn what not to do to your users from this blog post.

Telerik UI for Angular sponsor

Designing a Better Carousel UX — Let’s be real: Carousels generally don’t have a good reputation… But here, Vitaly highlights just some of the ways we can make them more useful, looking at best practices/guidelines to improve them with honest scrolling direction, labels, thumbnails and grouped prev/next-buttons.

Vitaly Friedman

What's New In DevTools for Chrome 101 — Import and export user flow as JSON, support hwb() colors, view cascade layers in the Styles pane and more.

Jecelyn Yeen (Chrome Developers)

SVG Passthrough Precision — If an SVG is imported into a design tool, then immediately exported as another SVG, how much precision is kept? What’s added, removed, or altered? Let’s dive in.

Marc Edwards

A Web Renaissance — “Thanks to the mistrust of big tech, the creation of better tools for developers, and the weird and wonderful creativity of ordinary people, we’re seeing an incredibly unlikely comeback: the web is thriving again.”

Anil Dash

Keep Up with the Latest in Startups, Tech, & Programming in Just 5 Min — TLDR is a daily newsletter with links and TLDRs of the most interesting stories in startups 🚀, tech 📱, and coding 💻

TLDR Newsletter sponsor

Seven Web Component Tricks — A few things that may not be ‘super obvious’ about working with Web Components. Presented in a straightforward manner with code examples.

Dave Rupert

'Childish Font Sizes' — When it comes to a baseline font-size, the arguments for setting a default of 16 pixels are widely accepted. But Tyler makes the case here that there are plenty of reasons to go even larger, and shares some of the resistance that they've seen to bumping things up a bit.

Tyler Sticka

Declarative Design — Thoughts on how we approach web design, with a focus on developing the right mindset: “focus on creating the right inputs rather than trying to control every possible output”.

Jeremy Keith

The Future of CSS: CSS Toggles — Here’s a quick look at what a toggle property — a mechanism for associating toggleable state with a DOM element — may look like in practice. Note: It’s very early days on this proposal (it’s not even at the draft stage) so very much experimental at this point.

Bramus Van Damme

CSS Color Module Level 5 Reference Guide — A simple reference guide for the new color specification methods available with the (in-draft) CSS Color Module Level 5.

Nelson Michael

Stylify: A Library That Generates Utility-First CSS Based on Your HTML — This is kind of wild. You write HTML class names that look almost exactly like inline styles, then this tool will generate the right amount of CSS, along with the ‘mangled’ HTML to match.

Vladimír Macháček

Loaders — Here's a nice collection of two-dozen simple, lightweight loaders and spinners for your next project. Made with HTML, CSS and SVG. React, or copy/paste. The GitHub repo is here, npm package here — zero dependencies.

Griffin Johnston

How to Go from 1x Deploy a Week → 1x a Day → Many Times a Day

Sleuth sponsor

PWA Resources: A Curated and Categorized Collection of Resources for Progressive Web Apps

shareup

details-utils: A Suite of Utilities to Add More Features to The <details> Element — These, perhaps unsurprisingly, use JavaScript and you can try some examples here, which include click outside to close, animation, close via ESC key, and more.

Zach Leatherman

PicMo: A Plain JavaScript Emoji Picker — Gives you the option to use platform-native emojis or cross-platform ones via Twemoji, and you can even add your own custom emojis. Try some demos here.

picmo