The Collective #901
Your weekly digest of dev & design links
Codrops is proudly hosted by Liquid Web—trusted for nearly a decade for performance, reliability, and scalability.
Olá, frontend friends! 👋
Here’s a fresh roundup of the latest frontend news, links, and resources to inspire and inform you. Whether you're looking for new ideas or just something interesting, we hope you'll discover something exciting in this edition!
Happy exploring! 💙
From our sponsor
Start learning AI in 2025
Keeping up with AI is hard – we get it!
That’s why over 1M professionals read Superhuman AI to stay ahead.
Get daily AI news, tools, and tutorials
Learn new AI skills you can use at work in 3 mins a day
Become 10X more productive
Dr. Axel Rauschmayer gives an overview of TypeScript for JavaScript developers, covering its syntax, execution, transpilation, and integration with modern tools.
javascript / tutorial / typescript
The Tamagotchi Challenge is complete with 34 creative submissions! Explore interactive demos, vote for your favorites, and see results on March 7.
three-js
🖌️ ShaderGPT™
ShaderGPT™ is an AI experiment that generates GLSL shaders from text prompts. Built with Vercel AI SDK, it turns descriptions into real-time visuals. More details here.
ai / generative-art / glsl / tool / webgl
Pavel Mazhuga experiments with Three.js TSL, using compute shaders and curl noise to morph particles into shapes. Source here.
three-js / tsl / webgpu
Jason Bradberry challenges the conventional wisdom that visible menus are always best, arguing that off-screen menus can enhance focus, aesthetics, and user experience in the right context.
opinion / web-design
Shadaj Laddad examines the stagnation in distributed systems programming, arguing for a native model that improves control, fault tolerance, and scalability.
ai / opinion / software-engineering
Xor shares compact GLSL shader tricks: fluid dynamics with sine waves, layered effects, and polar-log coordinates for natural visuals.
glsl / math
Scott Chacon explores Git config settings that even core Git developers tweak, highlighting key changes that improve usability, efficiency, and defaults.
article / git
🌐 upfetch
A lightweight, type-safe fetch client builder with schema validation, automatic parsing, and smart defaults for simpler API requests.
api / javascript
Tyler Sticka on designing in the browser with HTML/CSS for real-time feedback, fluid layouts, and modern CSS—while still valuing design tools.
opinion / web-design
Christian Heilmann creates a 'shoutout' overlay in plain HTML, CSS, and JS to mark key moments in videos for easier post-production editing.
css / javascript / tutorial
James Stuckey Weber explores position-area
, a powerful shorthand for CSS Anchor Positioning that simplifies placement while preventing overflow issues.
css / tutorial
A response to Jeremy’s critique: mobile web UX issues aren’t just on developers—business pressures and browser limits worsen the experience.
opinion / web-design
In their Sept 2024-Feb 2025 discussions, Martin and Ousterhout debate method length, comments, and TDD, revealing opposing views on code design.
discussion / software-engineering
From our sponsor
Learn how to make AI work for you
AI won’t take your job, but a person using AI might. That’s why 1,000,000+ professionals read The Rundown AI – the free newsletter that keeps you updated on the latest AI news and teaches you how to use it in just 5 minutes a day.
Giles Thomas argues blogging retains value for learning, portfolio-building, and occasional connections, even as AI tools increasingly mediate content discovery.
ai / opinion
Anthropic introduces Claude 3.7 Sonnet, a hybrid reasoning model for rapid or deep thinking, along with Claude Code, an AI-powered agentic coding tool.
ai / software-engineering / tool
Frank Reitberger’s third WebGPU experiment uses TSL and Three.js to create a real-time water simulation with shaders and procedural rendering.
tsl / webgpu
An interactive 3D hexapod simulation using Three.js for visualization, inverse kinematics for movement, and smooth spline-based animations.
3d / three-js
Martin Winkler's match-container polyfill brings Element.matchContainer()
to JavaScript, enabling real-time detection of Container Query changes using StyleObserver.
article / css / javascript
A passionate call from Sophie Koonin to reclaim the web’s creativity—build personal sites, embrace individuality, and break free from corporate platforms.
creativity / opinion
Tom Bennet shares lessons from migrating Tom’s Carnivores to Astro, where AI streamlined repetitive tasks but struggled with complex coding challenges.
ai / article / astro
Codrops is proudly sponsored by KeyCDN, the high performance content delivery network that has been built for the future.