TF #23 | Your weekly frontend digest

Frontend 🎨

CSS

• View transitions and stacking context: Why does my CSS View Transition ignore z-index?

• Speeding up the JavaScript ecosystem - Tailwind CSS

• CSS { In Real Life } | Messing About with CSS Gradients

• Why You Should Use px Units for margin, padding, & Other Spacing Techniques

• Better dynamic themes in Tailwind with OKLCH color magic

Misc

• Building modern Web Applications: 5 Essential Frontend Architecture Principles

• Answers to common (web) accessibility questions

• How to Do a TypeScript Conversion

• Writing Components That Work In Any Frontend Framework

• How to use the Fetch API in Node.js, Deno, and Bun

React

• Why You Want React Query | TkDodo's blog

• Headless Component: a pattern for composing React UIs

• re-re-reselect — Simplifying React state management

• A Complete Guide to Session Management in Next.js

Web performances ⚡

• Chromium Blog: How Core Web Vitals saved users 10,000 years of waiting for web pages to load

• Why We Need a Green Perf Metric

• Optimizing React applications (PDF)

This was the 4th edition of performance.now() a web performance event. Haven't seen a video yet, but I found a few slides from some of the talks.

• Diagnosing INP & Breaking down long tasks(slides)

• The Unbearable Weight of Massive JavaScript – performance.now()(slides)

• Cache rules everything (slides)

UX / UI 📱

• GrilloPress - Why designers design forms

• The UI is absolutely mindblowing!!! => 2023 UX Research Tools Map | User Interviews

• Unlocking Growth: Why A Low Friction User Signup Process Is Crucial For Your Business

• Minimalist Affordances: Making the right tradeoffs • Lea Verou

• In Search Of The Ideal Privacy Icon

Work, productivity... 📇

• Tests Are Bad For Developers There are other articles to discover that I recommend. You can also subscribe to the newsletter.

• Productivity - Sam Altman

• Why you need to know business

• How to Build a Web Developer Portfolio That Would Stand Out

• Ask Mathias: How do I delegate my work when I don’t have enough time? | LeadDev

• The Human Side of Software Engineering Teams

• The Gulf Between Design and Engineering / Design Systems International

• My process when starting a new job by Amy Hupe, content designer.

Misc 🗂️

• Building In-Video Search. Empowering video editors with… | by Netflix

• Testing with Intent: a Path to Embedded Accessibility

Tutorials 💻

• CSS Positioning Crash Course

Tips ✨

Tools & resources 🔧

• System-design-primer: Learn how to design large-scale systems. Prep for the system design interview. Includes Anki flashcards

• Introducing React components for the Maps JavaScript API | Google Cloud Blog

• Super-expressive: Super Expressive is a zero-dependency JavaScript library for building regular expressions in (almost) natural language

• Csv42: A small and fast CSV parser with support for nested JSON

• Node-glob: glob functionality for node.js

• JSON Viewer + Editor — Neko Nik

• Awesome-nodejs-security: Awesome Node.js Security resources

Videos 📼

• JetBrains JavaScript Day 2023 all videos of the free virtual event about modern JavaScript and TypeScript development

• The Story of Next.js a 12-minute summary of the history of NextJs!

• Simplifying Server Components by Mark Dalgleish - GitNation

• How To NOT Get Screwed As A Software Engineer

• Nathan Barry: Turning $1,000 in $320 Million the incredible story of convertkit and its founder.

• Why Signals Are Better Than React Hooks

Podcasts, talks... 🎙️

A beauty collection of Syntax FM episodes

• You Should Be Using JavaScript Maps & Sets

• How To Dark Mode and Beyond

• Cloudflare Workers Are Next Level With Rita Kozlov And Brendan Irvine-Broque

• JavaScript Jabber 606 Mastering ORM with TypeScript

• ShopTalk 590: Twisting Through Websites

• Whiskey Web and Whatnot - Episode 116 - Engineering Management vs Individual Contributor, Travel, and Inflation with Taylor Poindexter - Whiskey Web and Whatnot

• Front-End Fire: Web Dev Breakdown: Remix joins the Vite Train, Docusaurus 3.0, and an Update on Vercel's AI Code Generator v0 on Apple Podcasts

• Asian Efficiency - From Setbacks to Success: Reclaiming Productivity in the Face of Adversity

• IFTTD #244 - Innovation et résultats : Essayer, Échouer, Essayer avec Sebastien Luttringer 🇫🇷