TF #31 | Your weekly frontend digest

Discover the latest trends and insights in Frontend development with our curated link list.
From practical guides to cutting-edge technologies, our collection covers a wide range of topics, including Scroll-Driven Animations with CSS, TypeScript migration, CSS properties, JavaScript linters, Vue and React development, web performance, UI/UX design, productivity, refactoring, tutorials, tools, and resources.

Frontend 🎨

• A Practical Introduction to Scroll-Driven Animations with CSS scroll() and view()

  

• Migrating from Zod to Valibot: A Comparative Experience | Matthew Kwong

• TypeScript Might Not Be Your God: Case Study of Migration from TS to JSDoc

• The Complex But Awesome CSS border-image Property — Smashing Magazine

• Rust-Based JavaScript Linters: Fast, But No Typed Linting Right Now

• Designing better target sizes An interactive guide that is all about enhancing the target size area with CSS.

• HTMX and Web Components: a Perfect Match

• Dynamic Programming is not Black Magic

• Top Front-End Tools Of 2023 — Smashing Magazine

• npm in Review: A 2023 Retrospective on Growth, Security, and Quirky Facts

Vue

• Globalize Your Vue App: A Practical Guide to Vue 3 Internationalization

  

React

• Delicious Donut Components An interactive guide to component composition with React Server Components

  

• The future of React.use and React.useMemo - a powerful alternative to context selectors

• 16 Lesser Known Accessibility Issues | Toward

• https://twitter.com/dan_abramov2/status/1745795274977493317

Web performances⚡

• How To Improve INP With Chrome DevTools

  

• How Core Web Vitals affect application SEO: Understanding Google page experience ranking and Lighthouse scores – Vercel

  

UX / UI📱

• 58 rules for beautiful UI design. The right UI can elevate an application…

  

• Usability Testing of Inline Form Validation: 31% Don’t Have It, 4% Get It Wrong

• Case Study: AI-Powered Spatial Banking for Apple Vision Pro • UXDA

• An alternative macOS Dock. A unification of the Dock with Mission…

  

• Designer’s Guide To Redesign, Step-By-Step – Smart Interface Design Patterns

  

Work / Productivity 📇

• Measuring Developer Productivity: Real-World Examples

• Anna Shipman : JFDI Writing about tech, strategy and ledership

• Demystifying Project Estimation

• Applying the SPACE Framework - by Abi Noda

  

• 10 Things Software Developers Should Learn about Learning

• Founders: it doesn’t have to be this hard

Misc🔋

• The Golden Rule of Assertions | Epic Web Dev

  

• Building modern architectures: Functional Core, Imperative Shell revamp

• We removed advertising cookies, here’s what happened | Product Blog • Sentry

• The Ten Commandments of Refactoring

• Refactoring Legacy Code with the Strangler Fig Pattern

• Learning about debuggers | Andy Hippo

Tutorials 💻

• NGINX Tutorial for Beginners

• Ultimate Docker Compose Tutorial

  

• CSS in 2024, am I right? #css

• Learn Next.js Parallel Routes In 16 Minutes

Tools & resources 🔧

• Google-maps-scraper: scrape data data from Google Maps.

• Vueform | Open-Source Form Framework for Vue

  

• Heat.js - JavaScript Heat Map

  

• Graphite helps you create smaller pull requests, stay unblocked, and ship faster. Built for stacking, integrated with GitHub & VS Code.

• React Libraries for 2024

• Remote-storage: remoteStorage is a simple library that combines the localStorage API with a remote server to persist data across sessions.

• The AHA Stack | AHA

Videos 📼

• I Hate CORS

  

Podcasts, talks...🎙️

• Fullstack TypeScript Apps with No Build Step?! with Brian LeRoux - Syntax #719

  

• A pre-party to a feud (Changelog++ 🔐) with Adam Argyle, Amy Dutton, James Q Quick & Brad Garropy (JS Party)

• 598: Jen Simmons on Interop, WebKit Releases, and New CSS Features in Safari

• Bearded Talks on Beardless Hosts: VSCode Sidebars, AI, and GraphQL with Kelly Vaughn - Whiskey Web and Whatnot - Episode 126

• Get better sleep, more energy and focus with this one device - Asian Efficiency

The French corner

• IFTTD #254 - Generative Design : BTP et Nouveaux Outils avec Coraline Faurie