What Saul Bass Can Teach Us About Web Design — Frederick O’Brien looks at the work of graphic design legend Saul Bass, exploring how the principles that informed his work are just as valuable now as they were 50 years ago.

Smashing Magazine

State Modeling in React with XState — Microsoft’s David Khourshid shares how to use XState to manage both local and global component states in React. Learn more about state machines, types, model-based testing and more in this detailed course.

Frontend Masters sponsor

The Web Didn't Change; You Did — Thoughts from Remy on framework fatigue and build complexity, suggesting that frontend development isn’t particularly harder than it used to be, it’s just what we’ve “made it harder and more complicated”.

Remy Sharp

Optimizing Video For Size And Quality — Walks through the steps to optimize video on your site to ensure fast playback and reduce stalls.

Doug Sillars

Web Frameworks: Why You Don't Always Need Them

Richard MacManus

Accessing Hardware Devices on the Web: A Roundup of APIs — Chrome tends to have more unique APIs for hardware access so take care if cross browser compatibility is necessary, but there are a lot of options nonetheless from the Gamepad API or getUserMedia to the Generic Sensor API or Web NFC.

François Beaufort

SVG: The Good, the Bad and the Ugly — The author shares their opinion of the Scalable Vector Graphics format, what its problems, are suggests what could be done to improve things.

Nicolas Lenz

Learn to Optimize Images to the New AVIF Format for Better Quality — Understand its advantage, drawbacks & comparison with other formats. See how you can use ImageKit to deliver AVIF images.

ImageKit.io sponsor

Front-of-the-Front-End and Back-of-the-Front-End Web Development — Try saying that headline fast. Anyway, Brad tries to frame a split in frontend skill sets saying that “a front-of-the-front-end developer determines the look and feel of a button, while a back-of-the-front-end developer determines what happens when that button is clicked”.

Brad Frost

Fluid Typography with CSS Clamp — Learn to create a simple, accessibility friendly, and configurable fluid type system that uses modern CSS sizing functions.

Andy Bell

Programmatically Generate Images with CSS Painting API — How to use the CSS Painting API (part of the CSS Houdini umbrella of APIs) for dynamic image creation.

Viduni Wickramarachchi

Is CSS Float Deprecated? — The short answer is of course no, but Robin argues that with both CSS Grid and Flexbox we “don’t really need float at all”.

Robin Rendle

Developing A Performant Custom Cursor — Dives into how to implement a visually interesting custom cursor.

Stefan Vitasovic

Fast & Reliable Feature Management for the Modern Enterprise

LaunchDarkly sponsor

Don’t Put pointer-events: none On Form Labels

Bruce Lawson

Full Time Front-end Software Engineer (Remote) — Experienced with React? Write fast, performant code? If so, join us on our journey to help companies better measure, analyze and share their data.

Metabase

Hiring Remote Mid-Level / Senior Full Stack Engineer in North America — Must have heavy JS/React experience at a senior/expert level. Need to be able to work on web apps and JS client libraries.

Ardan Labs

Find Your Next Job Through Hired — Create a profile on Hired to connect with hiring managers at growing startups and Fortune 500 companies. It's free for job-seekers.

Hired

Quick Menu: A 'Single Thumb' Mobile Friendly Navigation System — An interesting experimental UI element you might find useful for certain mobile use cases. Tap through for an animated GIF that shows it off.

Arif Ullah

blocks.css: Add a Layer of Dimension to Your Page Elements — This is a small CSS library that adds an animated or static extrude effect to buttons, images, video embeds, cards, etc.

Linus Lee

Neat CSS — This minimalist CSS framework seems pretty neat. It comes in at about 1KiB (and that is not minified or compressed). Related repo here

Joel Dare

Remarkbox: A Hosted Comments Service Without Ads or Tracking — Similar to Commento, but this one is pay-what-you-can for the free version and offers paid plans for self-hosting.

Russell Ballestrini

Typesense: An Open Source, Typo-Tolerant Search Engine — Pitched as an open source alternative to systems like Algolia, Typesense’s primary focus is speed and developer convenience for adding things like instant search or autosuggest to your sites. GitHub repo. BTW, Meilisearch is another great option in this space.

Typesense Inc.

The Circle of Dancing Hearts — Yes, ok Valentine’s Day was earlier this week, but that’s not stopping us sharing these animated CSS hearts. You can hover over the viewport to tilt the perspective too!

Ryan Mulligan codepen

Encrypt Storage: A Wrapper for More Secure Native Browser Storage — Not fool proof, as it’s still entirely frontend, but this uses crypto-js to encrypt the data before it’s stored.

Michelon Souza