The Collective #880

I hope this Monday is treating you well!

Today, we’ve got a mix of fresh reads and tools—and fingers crossed 🤞 you’re receiving this edition, as we’ve moved to a new platform to send you these goodies! Please let us know in case you notice something not working properly!

Something that really struck me was Guillermo Rauch's take on cookie banners and the impact they’re having on the web. He points out how these bloated, often manipulative banners are not only ruining user experience but also silently wrecking performance and trust online. And he’s right. It’s really time for tackling this issue and make a change!

Hope this gets you thinking too, and here’s to a great week ahead!

🌐 The stretch keyword: a better alternative to width: 100% in CSS?

Ollie Williams introduces the new CSS stretch keyword as a more flexible alternative to width: 100%, allowing elements to fill available space without causing overflow, simplifying layout adjustments by eliminating the need for margin calculations.

🔐 How to roll your own auth in JavaScript & TypeScript 

Robin Wieruch's tutorial shows how to build a custom session-based authentication system in JavaScript and TypeScript, focusing on security, control, and reusability.

❤️‍🔥 Care Doesn’t Scale 

Steven Scrawls challenges our obsession with scalability, suggesting that real care is inherently personal and unscalable.

📝 The <details> and <summary> elements are getting an upgrade 

Stephanie Stimac discusses long-awaited updates to the <details> and <summary> HTML elements, enhancing their styling flexibility, which will reduce developers’ need to rebuild accordions from scratch.

📋 Foundations: form validation and error messages 

Demelza Feltham highlights best practices for accessible form validation, emphasizing clear, actionable error messages to create a smoother, frustration-free experience for all users.

✅ HTML Form Validation is heavily underused 

This article discusses the underutilization of HTML form validation features, highlighting the benefits and limitations of native validation methods.

🔢 Sets, types and type checking 

This blog post covers the foundations of type theory and type-checking, explaining how types provide structure, improve performance, and catch errors in code, setting the stage for deeper exploration in future articles.

📊 Octoverse: AI leads Python to top language as the number of global developers surges 

GitHub’s 2024 Octoverse report shows explosive global developer growth, with Python surpassing JavaScript in popularity, AI driving more open-source contributions, and automation enhancing security and accessibility for a diverse, expanding community.

🍪 Cookie banners 

This tweet by Guillermo Rauch highlights how bloated, manipulative cookie banners are hurting web performance and user trust.

🎨 Kinesis 

Kinesis.js is a set of components that helps you easily create dynamic interactive animations and was now fully coded in TypeScript.

🖼️ PabloNet 

Matthieu Le Cauchois shares his journey in building an AI-driven, real-time art display that transforms webcam feeds into wall-mounted visuals, aiming to evoke new moods and interactions.

✨ Designer Spotlight: Elena Smirnova 

(From our blog) Exploring the minimalist elegance and creative depth of Prague-based digital designer Elena Smirnova.

🤖 How to Create an AI-Powered Newsletter Aggregator with React and AI Agents

(From our blog) Get started with AI agents in this practical tutorial and learn to build an AI-powered newsletter aggregator using React and KaibanJS.

💌 Meco: A better way to read newsletters

Meco is a distraction-free space for reading newsletters outside the inbox. The app is packed with features designed to supercharge your learnings from your favourite writers. Become a more productive reader and cut out the noise with Meco.

Video Vault

Animation Spotlight

AVISION - Design Platform for Creative Professionals

by VALMAX

Demo Corner

❓Did you know that…

…generative art has evolved from rule-based systems to AI-powered creativity? Originally, generative art referred to works created with algorithms or systems where the artist set specific rules, allowing randomness to influence the final piece. Artists like Georg Nees and Frieder Nake pioneered this in the 1960s, using code to blend order and chaos. Tools like Processing and p5.js continue this tradition, letting artists write code to generate interactive, evolving visuals and music.