Frontend Weekly Digest #369 (24–30 Jun 2024)

Web-development

• Popovers Work Pretty Nicely as Slide-Out Drawers
• Poppin’ In
• Beyond monospace: the search for the perfect coding font
• A Rant about Front-end Development
• 13 Practical Updates to Optimize Website Performance
• Pivoting From React to Native DOM APIs: A Real World Example

• Tools
  • Vercel v0 and the future of AI-powered UI generation
  • window.ai — running AI LOCALLY from DevTools!
• Accessibility
  • How to browse the web with the keyboard alone
  • How To Make A Strong Case For Accessibility
• Effects
  • Digital meets Physical: Risograph Printing with WebGL
  • Creating a Glowing Text Marquee Animation

CSS

• A Text-Reveal Effect Using conic-gradient() in CSS
• This was CSS Day 2024 — the 10th edition
• Type Fluidity: Calculate fluid typography sizes
• Transitioning to Auto Height
• daisyUI adoption guide: Overview, examples, and alternatives
• Exploring Pigment CSS, a zero-runtime CSS-in-JS library by MUI

JavaScript

• Ecma International approves ECMAScript 2024: What’s new?
• 7 Use Cases for Javascript Proxies
• New JavaScript Set methods
• Browser Support Tests in JavaScript for Modern Web Features
• Million.js adoption guide: Overview, examples, and alternatives
• Dealing with Unicode strings, done right and better.
• EmberConf 2024: 12 videos

• React
  • How to Validate Forms in React and React Native Using Yup and Formik
  • Static Site Generation (SSG) with Next.js
  • CSS-in-JS and React Server Components: A Developer Guide
  • Enhancing The New York Times Web Performance with React 18
  • Comprehensive React.js Cheatsheet for Developers
  • Using Chrome’s Document Picture-in-Picture API in React
• Vue
  • Vue.js Live 2024
  • Micro-frontend architecture alongside Vue 3 migration
  • Recreating the Queens Game in Vue
• Angular
  • 5 ESLint rules to enforce modern Angular features
  • Angular: Ways to prevent ClickJacking from the web server and the front end application
  • Angular Animations Tutorial: Route Transitions